Update category colors

This commit is contained in:
Ryan Pandya 2025-01-13 19:37:29 -08:00
parent 2fa8b6261f
commit a932321324
3 changed files with 70 additions and 61 deletions

View File

@ -34,6 +34,7 @@ import { useForm } from "react-hook-form";
import { z } from "zod"; import { z } from "zod";
import { zUpdateCategoryRequestSchema, ZUpdateCategoryRequest } from "@lifetracker/shared/types/categories"; import { zUpdateCategoryRequestSchema, ZUpdateCategoryRequest } from "@lifetracker/shared/types/categories";
import { Textarea } from "@/components/ui/textarea";
export default function EditCategoryDialog({ export default function EditCategoryDialog({
category: initialCategory, category: initialCategory,
@ -88,12 +89,31 @@ export default function EditCategoryDialog({
<Form {...form}> <Form {...form}>
<form onSubmit={form.handleSubmit((val) => mutate(val))}> <form onSubmit={form.handleSubmit((val) => mutate(val))}>
<div className="flex w-full flex-col space-y-2"> <div className="flex w-full flex-col space-y-2">
<div style={{ display: "grid", gridTemplateColumns: "5em 1fr 75px", gap: "10px" }}>
<FormField
control={form.control}
name="code"
render={({ field }) => (
<FormItem>
{/* <FormLabel>Code</FormLabel> */}
<FormControl>
<Input
type="text"
placeholder="Code"
{...field}
className="w-full rounded border p-2"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField <FormField
control={form.control} control={form.control}
name="name" name="name"
render={({ field }) => ( render={({ field }) => (
<FormItem> <FormItem>
<FormLabel>Name</FormLabel> {/* <FormLabel>Name</FormLabel> */}
<FormControl> <FormControl>
<Input <Input
type="text" type="text"
@ -108,46 +128,10 @@ export default function EditCategoryDialog({
/> />
<FormField <FormField
control={form.control} control={form.control}
name="code" name="color.name"
render={({ field }) => ( render={({ field }) => (
<FormItem> <FormItem>
<FormLabel>Code</FormLabel> {/* <FormLabel>Color</FormLabel> */}
<FormControl>
<Input
type="number"
placeholder="Code"
{...field}
className="w-full rounded border p-2"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="description"
render={({ field }) => (
<FormItem>
<FormLabel>Description</FormLabel>
<FormControl>
<Input
type="text"
placeholder="Description"
{...field}
className="w-full rounded border p-2"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
{/* <FormField
control={form.control}
name="colorId"
render={({ field }) => (
<FormItem>
<FormLabel>Color</FormLabel>
<FormControl> <FormControl>
<Input <Input
type="text" type="text"
@ -159,7 +143,25 @@ export default function EditCategoryDialog({
<FormMessage /> <FormMessage />
</FormItem> </FormItem>
)} )}
/> */} />
</div>
<FormField
control={form.control}
name="description"
render={({ field }) => (
<FormItem>
{/* <FormLabel>Description</FormLabel> */}
<FormControl>
<Textarea
placeholder="Description"
{...field}
className="w-full rounded border p-2"
/>
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<DialogFooter className="sm:justify-end"> <DialogFooter className="sm:justify-end">
<DialogClose asChild> <DialogClose asChild>
<Button type="button" variant="secondary"> <Button type="button" variant="secondary">

View File

@ -32,11 +32,13 @@ export const zGetCategoryResponseSchema = z.object({
export type ZGetCategoryResponse = z.infer<typeof zGetCategoryResponseSchema>; export type ZGetCategoryResponse = z.infer<typeof zGetCategoryResponseSchema>;
export const zUpdateCategoryRequestSchema = z.object({ export const zUpdateCategoryRequestSchema = z.object({
code: z.number().nullish(), code: z.number(),
name: z.string().optional(), name: z.string().optional(),
description: z.string().optional(), description: z.string().optional(),
colorId: z.string().nullish(),
parentId: z.string().nullish(), parentId: z.string().nullish(),
categoryId: z.string(), categoryId: z.string(),
color: z.object({
name: z.string(),
}),
}); });
export type ZUpdateCategoryRequest = z.infer<typeof zUpdateCategoryRequestSchema>; export type ZUpdateCategoryRequest = z.infer<typeof zUpdateCategoryRequestSchema>;

View File

@ -222,13 +222,19 @@ export const categoriesAppRouter = router({
}), }),
) )
.mutation(async ({ input, ctx }) => { .mutation(async ({ input, ctx }) => {
console.log("Updating"); const colorIdQuery = await ctx.db.select({ id: colors.id }).from(colors).where(
and(
eq(colors.name, input.color.name),
eq(colors.userId, ctx.user.id),
)
);
const res = await ctx.db const res = await ctx.db
.update(categories) .update(categories)
.set({ .set({
name: input.name, name: input.name,
description: input.description, description: input.description,
code: input.code, code: input.code,
colorId: colorIdQuery[0].id,
}) })
.where( .where(
and( and(
@ -236,7 +242,6 @@ export const categoriesAppRouter = router({
eq(categories.userId, ctx.user.id), eq(categories.userId, ctx.user.id),
), ),
).returning(); ).returning();
console.log(res);
return res[0]; return res[0];
}), }),
delete: authedProcedure delete: authedProcedure