feat: added particle and reformatting

This commit is contained in:
Bart van der Braak 2024-02-02 01:08:13 +01:00
parent 5158767019
commit 32b6bf7582
147 changed files with 1186 additions and 922 deletions

View file

@ -1,16 +1,16 @@
<script lang="ts" context="module">
import { z } from "zod";
import { z } from 'zod';
const languages = {
en: "English",
fr: "French",
de: "German",
es: "Spanish",
pt: "Portuguese",
ru: "Russian",
ja: "Japanese",
ko: "Korean",
zh: "Chinese"
en: 'English',
fr: 'French',
de: 'German',
es: 'Spanish',
pt: 'Portuguese',
ru: 'Russian',
ja: 'Japanese',
ko: 'Korean',
zh: 'Chinese'
} as const;
type Language = keyof typeof languages;
@ -18,10 +18,10 @@
export const accountFormSchema = z.object({
name: z
.string({
required_error: "Required."
required_error: 'Required.'
})
.min(2, "Name must be at least 2 characters.")
.max(30, "Name must not be longer than 30 characters"),
.min(2, 'Name must be at least 2 characters.')
.max(30, 'Name must not be longer than 30 characters'),
// Hack: https://github.com/colinhacks/zod/issues/2280
language: z.enum(Object.keys(languages) as [Language, ...Language[]])
});
@ -30,9 +30,9 @@
</script>
<script lang="ts">
import * as Form from "$lib/components/ui/form";
import type { SuperValidated } from "sveltekit-superforms";
import { cn } from "$lib/utils";
import * as Form from '$lib/components/ui/form';
import type { SuperValidated } from 'sveltekit-superforms';
import { cn } from '$lib/utils';
export let data: SuperValidated<AccountFormSchema>;
</script>
@ -62,10 +62,7 @@
<Form.Select selected={{ value, label: languages[value] }}>
<Form.SelectTrigger
placeholder="Select language"
class={cn(
"w-[200px] justify-between",
!attrs.input.value && "text-muted-foreground"
)}
class={cn('w-[200px] justify-between', !attrs.input.value && 'text-muted-foreground')}
/>
<Form.SelectContent class="h-52 overflow-y-auto">
{#each Object.entries(languages) as [value, lang]}
@ -75,9 +72,7 @@
{/each}
</Form.SelectContent>
</Form.Select>
<Form.Description>
This is the language that will be used in the dashboard.
</Form.Description>
<Form.Description>This is the language that will be used in the dashboard.</Form.Description>
<Form.Validation />
</Form.Field>
</Form.Item>