diff options
Diffstat (limited to 'lib/gtc-contract/status/update-gtc-document-sheet.tsx')
| -rw-r--r-- | lib/gtc-contract/status/update-gtc-document-sheet.tsx | 148 |
1 files changed, 148 insertions, 0 deletions
diff --git a/lib/gtc-contract/status/update-gtc-document-sheet.tsx b/lib/gtc-contract/status/update-gtc-document-sheet.tsx new file mode 100644 index 00000000..9d133ecc --- /dev/null +++ b/lib/gtc-contract/status/update-gtc-document-sheet.tsx @@ -0,0 +1,148 @@ +"use client" + +import * as React from "react" +import { zodResolver } from "@hookform/resolvers/zod" +import { Loader } from "lucide-react" +import { useForm } from "react-hook-form" +import { toast } from "sonner" + +import { + Sheet, + SheetClose, + SheetContent, + SheetDescription, + SheetFooter, + SheetHeader, + SheetTitle, +} from "@/components/ui/sheet" +import { Button } from "@/components/ui/button" +import { + Form, + FormControl, + FormField, + FormItem, + FormLabel, + FormMessage, +} from "@/components/ui/form" +import { Textarea } from "@/components/ui/textarea" + +import { type GtcDocumentWithRelations } from "@/db/schema/gtc" +import { updateGtcDocumentSchema, type UpdateGtcDocumentSchema } from "@/lib/gtc-contract/validations" +import { updateGtcDocument } from "@/lib/gtc-contract/service" + +export interface UpdateGtcDocumentSheetProps + extends React.ComponentPropsWithRef<typeof Sheet> { + gtcDocument: GtcDocumentWithRelations | null +} + +export function UpdateGtcDocumentSheet({ gtcDocument, ...props }: UpdateGtcDocumentSheetProps) { + const [isUpdatePending, startUpdateTransition] = React.useTransition() + + const form = useForm<UpdateGtcDocumentSchema>({ + resolver: zodResolver(updateGtcDocumentSchema), + defaultValues: { + editReason: "", + isActive: gtcDocument?.isActive ?? true, + }, + }) + + // gtcDocument prop 바뀔 때마다 form.reset + React.useEffect(() => { + if (gtcDocument) { + form.reset({ + editReason: "", + isActive: gtcDocument.isActive, + }) + } + }, [gtcDocument, form]) + + async function onSubmit(input: UpdateGtcDocumentSchema) { + startUpdateTransition(async () => { + if (!gtcDocument) return + + try { + const result = await updateGtcDocument(gtcDocument.id, input) + + if (result.error) { + toast.error(result.error) + return + } + + form.reset() + props.onOpenChange?.(false) + toast.success("GTC 문서가 업데이트되었습니다!") + } catch (error) { + toast.error("문서 업데이트 중 오류가 발생했습니다.") + } + }) + } + + return ( + <Sheet {...props}> + <SheetContent className="flex flex-col gap-6 sm:max-w-md"> + <SheetHeader className="text-left"> + <SheetTitle>Update GTC Document</SheetTitle> + <SheetDescription> + GTC 문서 정보를 수정하고 변경사항을 저장하세요 + </SheetDescription> + </SheetHeader> + + <Form {...form}> + <form + onSubmit={form.handleSubmit(onSubmit)} + className="flex flex-col gap-4" + > + {/* 문서 정보 표시 */} + <div className="space-y-2 p-3 bg-muted/50 rounded-lg"> + <div className="text-sm font-medium">현재 문서 정보</div> + <div className="text-xs text-muted-foreground space-y-1"> + <div>구분: {gtcDocument?.type === "standard" ? "표준" : "프로젝트"}</div> + {gtcDocument?.project && ( + <div>프로젝트: {gtcDocument.project.name} ({gtcDocument.project.code})</div> + )} + <div>리비전: v{gtcDocument?.revision}</div> + </div> + </div> + + {/* 편집 사유 */} + <FormField + control={form.control} + name="editReason" + render={({ field }) => ( + <FormItem> + <FormLabel>편집 사유 (권장)</FormLabel> + <FormControl> + <Textarea + placeholder="편집 사유를 입력하세요..." + {...field} + rows={3} + /> + </FormControl> + <FormMessage /> + </FormItem> + )} + /> + + <SheetFooter className="gap-2 pt-2 sm:space-x-0"> + <SheetClose asChild> + <Button type="button" variant="outline"> + Cancel + </Button> + </SheetClose> + + <Button type="submit" disabled={isUpdatePending}> + {isUpdatePending && ( + <Loader + className="mr-2 size-4 animate-spin" + aria-hidden="true" + /> + )} + Save + </Button> + </SheetFooter> + </form> + </Form> + </SheetContent> + </Sheet> + ) +}
\ No newline at end of file |