JCEEE/famdone
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

payday tests

Browse Source
This commit is contained in:
JCEEE
2026-09-20 17:49:14 +01:00
parent 9e6d835061
commit 18511b6546
2 changed files with 58 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/components/index.ts
+1
View File
@@ -6,6 +6,7 @@ export { default as ViewHeader } from './ViewHeader.svelte';
export { default as Card } from './Card.svelte';
export { default as CardGrid } from './CardGrid.svelte';
export { default as Button } from './Button.svelte';
export { default as SaveButton } from './SaveButton.svelte';
export { default as Accordion } from './Accordion.svelte';
export { default as AccordionItem } from './AccordionItem.svelte';
export { default as Chat } from './Chat.svelte';
frontend/src/routes/[fam]/[username]/settings/+page.svelte
+57 -12
View File
@@ -9,6 +9,7 @@
CardGrid,
Card,
Button,
SaveButton,
Accordion,
AccordionItem,
NoticeDialog
@@ -89,6 +90,17 @@
});
let qrDataUrl = $state('');
let copied = $state(false);
// Save-button success feedback: each save form holds a SaveButton ref and
// flashes it green for 4s from its use:enhance callback on success.
type Flasher = { flash: () => void } | null;
let renameBtn: Flasher = $state(null);
let paydayBtn: Flasher = $state(null);
let seasonBtn: Flasher = $state(null);
let lockBtn: Flasher = $state(null);
let addMemberBtn: Flasher = $state(null);
let inviteBtn: Flasher = $state(null);
let applyCodeBtn: Flasher = $state(null);
let parentInviteName = $state('');
let parentInviteEmail = $state('');
@@ -153,6 +165,7 @@
if (result.type === 'success') {
const d = result.data as { ok?: boolean; error?: string } | undefined;
if (d?.ok) {
inviteBtn?.flash();
notices.success(
'Invite sent',
`Email sent to ${parentInviteEmail} with a join link and code.`
@@ -209,7 +222,16 @@
<code class="slug-inline">/{famSlug}</code> even if you rename it — links you've shared keep
working.
</p>
<form method="POST" action="?/renameFam" use:enhance>
<form
method="POST"
action="?/renameFam"
use:enhance={() => {
return async ({ result, update }) => {
await update();
if (result.type === 'success') renameBtn?.flash();
};
}}
>
<label class="field-label" for="fam-name">Display name</label>
<input
id="fam-name"
@@ -218,7 +240,7 @@
placeholder={fam?.name || 'Family name'}
required
/>
<Button type="submit" size="sm">Rename</Button>
<SaveButton bind:this={renameBtn} label="Rename" />
</form>
{#if fam?.slug}
<p class="hint slug-line">
@@ -234,6 +256,7 @@
use:enhance={() => {
return async ({ result }) => {
if (result.type === 'error') alert(result.error || 'Failed to update payday');
else if (result.type === 'success') paydayBtn?.flash();
};
}}
class="payday-form"
@@ -265,7 +288,7 @@
{/each}
</select>
</div>
<Button type="submit" size="sm">Set payday</Button>
<SaveButton bind:this={paydayBtn} label="Set payday" />
</form>
<p class="hint">
Payday: the week starts on this day and weekly earnings are settled at this time. Pick
@@ -278,7 +301,17 @@
Group chores into seasons. Tick a season on to make it available for assignment; untick to
disable it.
</p>
<form method="POST" action="?/createSeason" use:enhance class="season-form">
<form
method="POST"
action="?/createSeason"
use:enhance={() => {
return async ({ result, update }) => {
await update();
if (result.type === 'success') seasonBtn?.flash();
};
}}
class="season-form"
>
<label class="field-label" for="season-name">New season</label>
<input id="season-name" name="name" placeholder="Season name" required />
<div class="season-color-row">
@@ -297,7 +330,7 @@
</div>
<input type="hidden" name="color" value={seasonColor} />
</div>
<Button type="submit" size="sm">Add</Button>
<SaveButton bind:this={seasonBtn} label="Add" />
</form>
<ul class="season-list">
@@ -385,8 +418,10 @@
return async ({ result }) => {
if (result.type !== 'success') return;
const d = result.data as any;
if (d?.ok) lockMins = String(d.lockMins);
else if (d?.error) alert(d.error);
if (d?.ok) {
lockMins = String(d.lockMins);
lockBtn?.flash();
} else if (d?.error) alert(d.error);
};
}}
>
@@ -395,7 +430,7 @@
<option value="2">After 2 minutes of no use</option>
<option value="10">After 10 minutes of no use</option>
</select>
<Button type="submit" size="sm">Save</Button>
<SaveButton bind:this={lockBtn} label="Save" />
</form>
</Card>
</CardGrid>
@@ -405,7 +440,16 @@
<CardGrid>
<Card title="New member" cols={1}>
<p class="hint">Add a child. They'll pick their own colour after joining.</p>
<form method="POST" action="?/addMember" use:enhance>
<form
method="POST"
action="?/addMember"
use:enhance={() => {
return async ({ result, update }) => {
await update();
if (result.type === 'success') addMemberBtn?.flash();
};
}}
>
<label class="field-label" for="new-child">New child</label>
<input
id="new-child"
@@ -414,7 +458,7 @@
placeholder="Child name"
required
/>
<Button type="submit" size="sm">Add child</Button>
<SaveButton bind:this={addMemberBtn} label="Add child" />
</form>
</Card>
@@ -631,7 +675,7 @@
placeholder="parent@example.com"
required
/>
<Button type="submit" size="sm">Send invite</Button>
<SaveButton bind:this={inviteBtn} label="Send invite" />
</form>
<p class="hint">They'll receive a link with a code to set up their own password.</p>
</Card>
@@ -704,6 +748,7 @@
const d = result.data as { error?: string; ok?: boolean };
accessMsg = d.error || 'Code applied — access enabled.';
accessCodeInput = '';
if (d.ok && !d.error) applyCodeBtn?.flash();
}
await update();
};
@@ -715,7 +760,7 @@
placeholder="Enter access code"
autocomplete="off"
/>
<Button type="submit" size="sm" variant="primary">Apply code</Button>
<SaveButton bind:this={applyCodeBtn} label="Apply code" />
</form>
{/if}
{#if accessMsg}