mirror of
https://codeberg.org/MarkusThielker/finances.git
synced 2025-04-12 05:08:43 +00:00
N-FIN-42: add default category selection to form
This commit is contained in:
parent
228aa983e0
commit
715ce17e1f
4 changed files with 34 additions and 2 deletions
|
@ -147,6 +147,7 @@ export default function EntityPageClientContent({entities, categories, onSubmit,
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
<EntityForm
|
<EntityForm
|
||||||
value={selectedEntity}
|
value={selectedEntity}
|
||||||
|
categories={categories}
|
||||||
onSubmit={handleSubmit}
|
onSubmit={handleSubmit}
|
||||||
className="grid grid-cols-1 md:grid-cols-2 gap-4 py-4"/>
|
className="grid grid-cols-1 md:grid-cols-2 gap-4 py-4"/>
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
|
@ -168,6 +169,7 @@ export default function EntityPageClientContent({entities, categories, onSubmit,
|
||||||
</DrawerHeader>
|
</DrawerHeader>
|
||||||
<EntityForm
|
<EntityForm
|
||||||
value={selectedEntity}
|
value={selectedEntity}
|
||||||
|
categories={categories}
|
||||||
onSubmit={handleSubmit}
|
onSubmit={handleSubmit}
|
||||||
className="grid grid-cols-1 md:grid-cols-2 gap-4 py-4"/>
|
className="grid grid-cols-1 md:grid-cols-2 gap-4 py-4"/>
|
||||||
</DrawerContent>
|
</DrawerContent>
|
||||||
|
|
|
@ -12,11 +12,13 @@ import { useRouter } from 'next/navigation';
|
||||||
import { toast } from 'sonner';
|
import { toast } from 'sonner';
|
||||||
import { sonnerContent } from '@/components/ui/sonner';
|
import { sonnerContent } from '@/components/ui/sonner';
|
||||||
import { entityFormSchema } from '@/lib/form-schemas/entityFormSchema';
|
import { entityFormSchema } from '@/lib/form-schemas/entityFormSchema';
|
||||||
import { Entity, EntityType } from '@prisma/client';
|
import { Category, Entity, EntityType } from '@prisma/client';
|
||||||
import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
|
import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
|
||||||
|
import { AutoCompleteInput } from '@/components/ui/auto-complete-input';
|
||||||
|
|
||||||
export default function EntityForm({value, onSubmit, className}: {
|
export default function EntityForm({value, categories, onSubmit, className}: {
|
||||||
value: Entity | undefined,
|
value: Entity | undefined,
|
||||||
|
categories: Category[],
|
||||||
onSubmit: (data: z.infer<typeof entityFormSchema>) => Promise<ActionResponse>
|
onSubmit: (data: z.infer<typeof entityFormSchema>) => Promise<ActionResponse>
|
||||||
className?: string
|
className?: string
|
||||||
}) {
|
}) {
|
||||||
|
@ -29,6 +31,7 @@ export default function EntityForm({value, onSubmit, className}: {
|
||||||
id: value?.id ?? undefined,
|
id: value?.id ?? undefined,
|
||||||
name: value?.name ?? '',
|
name: value?.name ?? '',
|
||||||
type: value?.type ?? EntityType.Entity,
|
type: value?.type ?? EntityType.Entity,
|
||||||
|
defaultCategoryId: value?.defaultCategoryId ?? undefined,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -40,6 +43,13 @@ export default function EntityForm({value, onSubmit, className}: {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const categoriesMapped = categories?.map((category) => {
|
||||||
|
return {
|
||||||
|
label: category.name,
|
||||||
|
value: category.id,
|
||||||
|
};
|
||||||
|
}) ?? [];
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Form {...form}>
|
<Form {...form}>
|
||||||
<form autoComplete="off" onSubmit={form.handleSubmit(handleSubmit)}>
|
<form autoComplete="off" onSubmit={form.handleSubmit(handleSubmit)}>
|
||||||
|
@ -94,6 +104,22 @@ export default function EntityForm({value, onSubmit, className}: {
|
||||||
</FormItem>
|
</FormItem>
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="defaultCategoryId"
|
||||||
|
render={({field}) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Category</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<AutoCompleteInput
|
||||||
|
placeholder="Select category"
|
||||||
|
items={categoriesMapped}
|
||||||
|
{...field} />
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage/>
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<Button type="submit" className="w-full">{value?.id ? 'Update Entity' : 'Create Entity'}</Button>
|
<Button type="submit" className="w-full">{value?.id ? 'Update Entity' : 'Create Entity'}</Button>
|
||||||
</form>
|
</form>
|
||||||
|
|
|
@ -9,6 +9,7 @@ export default async function entityCreateUpdate({
|
||||||
id,
|
id,
|
||||||
name,
|
name,
|
||||||
type,
|
type,
|
||||||
|
defaultCategoryId,
|
||||||
}: z.infer<typeof entityFormSchema>): Promise<ActionResponse> {
|
}: z.infer<typeof entityFormSchema>): Promise<ActionResponse> {
|
||||||
'use server';
|
'use server';
|
||||||
|
|
||||||
|
@ -32,6 +33,7 @@ export default async function entityCreateUpdate({
|
||||||
data: {
|
data: {
|
||||||
name: name,
|
name: name,
|
||||||
type: type,
|
type: type,
|
||||||
|
defaultCategoryId: defaultCategoryId,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
@ -47,6 +49,7 @@ export default async function entityCreateUpdate({
|
||||||
userId: user.id,
|
userId: user.id,
|
||||||
name: name,
|
name: name,
|
||||||
type: type,
|
type: type,
|
||||||
|
defaultCategoryId: defaultCategoryId,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -5,4 +5,5 @@ export const entityFormSchema = z.object({
|
||||||
id: z.number().positive().optional(),
|
id: z.number().positive().optional(),
|
||||||
name: z.string().min(1).max(32),
|
name: z.string().min(1).max(32),
|
||||||
type: z.nativeEnum(EntityType),
|
type: z.nativeEnum(EntityType),
|
||||||
|
defaultCategoryId: z.number().positive().optional(),
|
||||||
});
|
});
|
||||||
|
|
Loading…
Add table
Reference in a new issue