diff options
Diffstat (limited to 'components/form-data/delete-form-data-dialog.tsx')
| -rw-r--r-- | components/form-data/delete-form-data-dialog.tsx | 67 |
1 files changed, 39 insertions, 28 deletions
diff --git a/components/form-data/delete-form-data-dialog.tsx b/components/form-data/delete-form-data-dialog.tsx index ca2f8729..9298b43b 100644 --- a/components/form-data/delete-form-data-dialog.tsx +++ b/components/form-data/delete-form-data-dialog.tsx @@ -3,6 +3,8 @@ import * as React from "react" import { Loader, Trash } from "lucide-react" import { toast } from "sonner" +import { useParams } from "next/navigation" +import { useTranslation } from "@/i18n/client" import { useMediaQuery } from "@/hooks/use-media-query" import { Button } from "@/components/ui/button" @@ -55,22 +57,26 @@ export function DeleteFormDataDialog({ }: DeleteFormDataDialogProps) { const [isDeletePending, startDeleteTransition] = React.useTransition() const isDesktop = useMediaQuery("(min-width: 640px)") + + const params = useParams(); + const lng = (params?.lng as string) || "ko"; + const { t } = useTranslation(lng, "engineering"); // TAG_NO가 있는 항목들만 필터링 - const validItems = formData.filter(item => item.TAG_NO?.trim()) - const tagNos = validItems.map(item => item.TAG_NO).filter(Boolean) as string[] + const validItems = formData.filter(item => item.TAG_IDX?.trim()) + const tagIdxs = validItems.map(item => item.TAG_IDX).filter(Boolean) as string[] function onDelete() { startDeleteTransition(async () => { - if (tagNos.length === 0) { - toast.error("No valid items to delete") + if (tagIdxs.length === 0) { + toast.error(t("delete.noValidItems")) return } const result = await deleteFormDataByTags({ formCode, contractItemId, - tagNos, + tagIdxs, }) if (result.error) { @@ -88,12 +94,15 @@ export function DeleteFormDataDialog({ // 데이터 불일치 경고 console.warn(`Data inconsistency: FormEntries deleted: ${deletedCount}, Tags deleted: ${deletedTagsCount}`) toast.error( - `Deleted ${deletedCount} form entries and ${deletedTagsCount} tags (data inconsistency detected)` + t("delete.dataInconsistency", { deletedCount, deletedTagsCount }) ) } else { // 정상적인 삭제 완료 toast.success( - `Successfully deleted ${deletedCount} item${deletedCount === 1 ? "" : "s"}` + t("delete.successMessage", { + count: deletedCount, + items: deletedCount === 1 ? t("delete.item") : t("delete.items") + }) ) } @@ -101,7 +110,7 @@ export function DeleteFormDataDialog({ }) } - const itemCount = tagNos.length + const itemCount = tagIdxs.length const hasValidItems = itemCount > 0 if (isDesktop) { @@ -115,24 +124,25 @@ export function DeleteFormDataDialog({ disabled={!hasValidItems} > <Trash className="mr-2 size-4" aria-hidden="true" /> - Delete ({itemCount}) + {t("buttons.delete")} ({itemCount}) </Button> </DialogTrigger> ) : null} <DialogContent> <DialogHeader> - <DialogTitle>Are you absolutely sure?</DialogTitle> + <DialogTitle>{t("delete.confirmTitle")}</DialogTitle> <DialogDescription> - This action cannot be undone. This will permanently delete{" "} - <span className="font-medium">{itemCount}</span> - {itemCount === 1 ? " item" : " items"} and related tag records from the database. + {t("delete.confirmDescription", { + count: itemCount, + items: itemCount === 1 ? t("delete.item") : t("delete.items") + })} {itemCount > 0 && ( <> <br /> <br /> <span className="text-sm text-muted-foreground"> - TAG_NO(s): {tagNos.slice(0, 3).join(", ")} - {tagNos.length > 3 && ` and ${tagNos.length - 3} more...`} + {t("delete.tagNumbers")}: {tagIdxs.slice(0, 3).join(", ")} + {tagIdxs.length > 3 && t("delete.andMore", { count: tagIdxs.length - 3 })} </span> </> )} @@ -140,10 +150,10 @@ export function DeleteFormDataDialog({ </DialogHeader> <DialogFooter className="gap-2 sm:space-x-0"> <DialogClose asChild> - <Button variant="outline">Cancel</Button> + <Button variant="outline">{t("buttons.cancel")}</Button> </DialogClose> <Button - aria-label="Delete selected entries" + aria-label={t("delete.deleteButtonLabel")} variant="destructive" onClick={onDelete} disabled={isDeletePending || !hasValidItems} @@ -154,7 +164,7 @@ export function DeleteFormDataDialog({ aria-hidden="true" /> )} - Delete + {t("buttons.delete")} </Button> </DialogFooter> </DialogContent> @@ -172,24 +182,25 @@ export function DeleteFormDataDialog({ disabled={!hasValidItems} > <Trash className="mr-2 size-4" aria-hidden="true" /> - Delete ({itemCount}) + {t("buttons.delete")} ({itemCount}) </Button> </DrawerTrigger> ) : null} <DrawerContent> <DrawerHeader> - <DrawerTitle>Are you absolutely sure?</DrawerTitle> + <DrawerTitle>{t("delete.confirmTitle")}</DrawerTitle> <DrawerDescription> - This action cannot be undone. This will permanently delete{" "} - <span className="font-medium">{itemCount}</span> - {itemCount === 1 ? " item" : " items"} and related tag records from the database. + {t("delete.confirmDescription", { + count: itemCount, + items: itemCount === 1 ? t("delete.item") : t("delete.items") + })} {itemCount > 0 && ( <> <br /> <br /> <span className="text-sm text-muted-foreground"> - TAG_NO(s): {tagNos.slice(0, 3).join(", ")} - {tagNos.length > 3 && ` and ${tagNos.length - 3} more...`} + {t("delete.tagNumbers")}: {tagIdxs.slice(0, 3).join(", ")} + {tagIdxs.length > 3 && t("delete.andMore", { count: tagIdxs.length - 3 })} </span> </> )} @@ -197,10 +208,10 @@ export function DeleteFormDataDialog({ </DrawerHeader> <DrawerFooter className="gap-2 sm:space-x-0"> <DrawerClose asChild> - <Button variant="outline">Cancel</Button> + <Button variant="outline">{t("buttons.cancel")}</Button> </DrawerClose> <Button - aria-label="Delete selected entries" + aria-label={t("delete.deleteButtonLabel")} variant="destructive" onClick={onDelete} disabled={isDeletePending || !hasValidItems} @@ -208,7 +219,7 @@ export function DeleteFormDataDialog({ {isDeletePending && ( <Loader className="mr-2 size-4 animate-spin" aria-hidden="true" /> )} - Delete + {t("buttons.delete")} </Button> </DrawerFooter> </DrawerContent> |