Coves frontend - a photon fork
1<script lang="ts">
2 import { client } from '$lib/api/client.svelte'
3 import { errorMessage } from '$lib/app/error'
4 import { t } from '$lib/app/i18n'
5 import { Button, TextInput, toast } from 'mono-svelte'
6
7 interface Props {
8 note?: string
9 person: number
10 onsubmit?: (note: string | null) => void
11 }
12
13 let { note: passedNote = '', person, onsubmit }: Props = $props()
14 let note = $state(passedNote)
15
16 // man wtf is this
17 let loading = $state<boolean | null>(false)
18
19 async function submit(note: string | null) {
20 try {
21 loading = note ? true : null
22 if (!client().setNote) throw new Error('unsupported')
23
24 await client().setNote!({ person_id: person, note: note })
25
26 onsubmit?.(note)
27 } catch (err) {
28 toast({
29 content: errorMessage(err as string),
30 type: 'error',
31 })
32 }
33 loading = false
34 }
35</script>
36
37<form
38 onsubmit={(e) => {
39 e.preventDefault()
40 submit(note)
41 }}
42 class="contents"
43>
44 <TextInput bind:value={note} label={$t('nav.commands.content')} required />
45 <div class="flex flex-row gap-2 *:flex-1">
46 <Button loading={loading === true} submit color="primary" size="lg">
47 {$t('form.submit')}
48 </Button>
49 <Button
50 onclick={() => submit(null)}
51 loading={loading === null}
52 color="danger"
53 size="lg"
54 >
55 {$t('common.remove')}
56 </Button>
57 </div>
58</form>