diff options
Diffstat (limited to 'lib/tags')
| -rw-r--r-- | lib/tags/table/add-tag-dialog.tsx | 76 |
1 files changed, 40 insertions, 36 deletions
diff --git a/lib/tags/table/add-tag-dialog.tsx b/lib/tags/table/add-tag-dialog.tsx index e5207cd8..f3eaed3f 100644 --- a/lib/tags/table/add-tag-dialog.tsx +++ b/lib/tags/table/add-tag-dialog.tsx @@ -1,7 +1,7 @@ "use client" import * as React from "react" -import { useRouter } from "next/navigation" +import { useRouter, useParams } from "next/navigation" import { useForm, useWatch, useFieldArray } from "react-hook-form" import { zodResolver } from "@hookform/resolvers/zod" import { toast } from "sonner" @@ -51,6 +51,7 @@ import { import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip" import { cn } from "@/lib/utils" import { Badge } from "@/components/ui/badge" +import { useTranslation } from "@/i18n/client" import type { CreateTagSchema } from "@/lib/tags/validations" import { createTagSchema } from "@/lib/tags/validations" @@ -102,6 +103,9 @@ interface AddTagDialogProps { export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { const router = useRouter() + const params = useParams() + const lng = (params?.lng as string) || "ko" + const { t } = useTranslation(lng, "engineering") const [open, setOpen] = React.useState(false) const [tagTypeList, setTagTypeList] = React.useState<TagTypeOption[]>([]) @@ -134,7 +138,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { const result = await getClassOptions(selectedPackageId) setClassOptions(result) } catch (err) { - toast.error("클래스 옵션을 불러오는데 실패했습니다.") + toast.error(t("toast.classOptionsLoadFailed")) } finally { setIsLoadingClasses(false) } @@ -198,7 +202,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { form.setValue("rows", updatedRows); return true } catch (err) { - toast.error("서브필드를 불러오는데 실패했습니다.") + toast.error(t("toast.subfieldsLoadFailed")) setSubFields([]) return false } finally { @@ -310,7 +314,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { // --------------- async function onSubmit(data: MultiTagFormValues) { if (!selectedPackageId) { - toast.error("No selectedPackageId."); + toast.error(t("toast.noSelectedPackageId")); return; } @@ -353,12 +357,12 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { // Show results to the user if (successfulTags.length > 0) { - toast.success(`${successfulTags.length}개의 태그가 성공적으로 생성되었습니다!`); + toast.success(`${successfulTags.length}${t("toast.tagsCreatedSuccess")}`); } if (failedTags.length > 0) { console.log("Failed tags:", failedTags); - toast.error(`${failedTags.length}개의 태그 생성에 실패했습니다.`); + toast.error(`${failedTags.length}${t("toast.tagsCreateFailed")}`); } // Refresh the page @@ -370,7 +374,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { setOpen(false); } } catch (err) { - toast.error("태그 생성 처리에 실패했습니다."); + toast.error(t("toast.tagProcessingFailed")); } finally { setIsSubmitting(false); } @@ -435,7 +439,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { return ( <FormItem className="w-1/3"> - <FormLabel>Class</FormLabel> + <FormLabel>{t("labels.class")}</FormLabel> <FormControl> <Popover open={popoverOpen} onOpenChange={setPopoverOpen}> <PopoverTrigger asChild> @@ -448,13 +452,13 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { > {isLoadingClasses ? ( <> - <span>클래스 로딩 중...</span> + <span>{t("messages.loadingClasses")}</span> <Loader2 className="ml-2 h-4 w-4 animate-spin" /> </> ) : ( <> <span className="truncate mr-1 flex-grow text-left"> - {field.value || "클래스 선택..."} + {field.value || t("placeholders.selectClass")} </span> <ChevronsUpDown className="h-4 w-4 opacity-50 flex-shrink-0" /> </> @@ -465,7 +469,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { <Command key={commandId}> <CommandInput key={`${commandId}-input`} - placeholder="클래스 검색..." + placeholder={t("placeholders.searchClass")} value={classSearchTerm} onValueChange={setClassSearchTerm} /> @@ -475,7 +479,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { const target = e.currentTarget; target.scrollTop += e.deltaY; // 직접 스크롤 처리 }}> - <CommandEmpty key={`${commandId}-empty`}>검색 결과가 없습니다.</CommandEmpty> + <CommandEmpty key={`${commandId}-empty`}>{t("messages.noSearchResults")}</CommandEmpty> <CommandGroup key={`${commandId}-group`}> {classOptions.map((opt, optIndex) => { if (!classOptionIdsRef.current[opt.code]) { @@ -543,7 +547,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { disabled={!selectedClassOption} > <SelectTrigger className="h-9"> - <SelectValue placeholder="서브클래스 선택..." /> + <SelectValue placeholder={t("placeholders.selectSubclass")} /> </SelectTrigger> <SelectContent> {selectedClassOption?.subclasses.map((subclass) => ( @@ -576,7 +580,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { return ( <FormItem className={width}> - <FormLabel>Tag Type</FormLabel> + <FormLabel>{t("labels.tagType")}</FormLabel> <FormControl> {isReadOnly ? ( <div className="relative"> @@ -592,7 +596,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { key={`tag-type-placeholder-${inputId}`} {...field} readOnly - placeholder="클래스 선택시 자동으로 결정됩니다" + placeholder={t("placeholders.autoSetByClass")} className="h-9 bg-muted" /> )} @@ -610,15 +614,15 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { return ( <div className="flex justify-center items-center py-8"> <Loader2 className="h-8 w-8 animate-spin text-primary" /> - <div className="ml-3 text-muted-foreground">필드 로딩 중...</div> + <div className="ml-3 text-muted-foreground">{t("messages.loadingFields")}</div> </div> ) } if (subFields.length === 0 && selectedTagTypeCode) { const message = selectedClassOption?.subclasses && selectedClassOption.subclasses.length > 0 - ? "서브클래스를 선택해주세요." - : "이 태그 유형에 대한 필드가 없습니다." + ? t("messages.selectSubclassFirst") + : t("messages.noFieldsForTagType") return ( <div className="py-4 text-center text-muted-foreground"> @@ -630,7 +634,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { if (subFields.length === 0) { return ( <div className="py-4 text-center text-muted-foreground"> - 태그 데이터를 입력하려면 먼저 상단에서 클래스를 선택하세요. + {t("messages.selectClassFirst")} </div> ) } @@ -639,10 +643,10 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { <div className="space-y-4"> {/* 헤더 */} <div className="flex justify-between items-center"> - <h3 className="text-sm font-medium">태그 항목 ({fields.length}개)</h3> + <h3 className="text-sm font-medium">{t("sections.tagItems")} ({fields.length}개)</h3> {!areAllTagNosValid && ( <Badge variant="destructive" className="ml-2"> - 유효하지 않은 태그 존재 + {t("messages.invalidTagsExist")} </Badge> )} </div> @@ -655,10 +659,10 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { <TableRow> <TableHead className="w-10 text-center">#</TableHead> <TableHead className="w-[120px]"> - <div className="font-medium">Tag No</div> + <div className="font-medium">{t("labels.tagNo")}</div> </TableHead> <TableHead className="w-[180px]"> - <div className="font-medium">Description</div> + <div className="font-medium">{t("labels.description")}</div> </TableHead> {/* Subfields */} @@ -680,7 +684,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { </TableHead> ))} - <TableHead className="w-[100px] text-center sticky right-0 bg-muted">Actions</TableHead> + <TableHead className="w-[100px] text-center sticky right-0 bg-muted">{t("labels.actions")}</TableHead> </TableRow> </TableHeader> @@ -738,7 +742,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { <Input {...field} className="h-8 w-full" - placeholder="항목 이름 입력" + placeholder={t("placeholders.enterDescription")} title={field.value || ""} /> </FormControl> @@ -768,7 +772,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { className="w-full h-8 truncate" title={field.value || ""} > - <SelectValue placeholder={`선택...`} className="truncate" /> + <SelectValue placeholder={t("placeholders.selectOption")} className="truncate" /> </SelectTrigger> <SelectContent align="start" @@ -792,7 +796,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { <Input {...field} className="h-8 w-full" - placeholder={`입력...`} + placeholder={t("placeholders.enterValue")} title={field.value || ""} /> )} @@ -820,7 +824,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { </Button> </TooltipTrigger> <TooltipContent side="left"> - <p>행 복제</p> + <p>{t("tooltips.duplicateRow")}</p> </TooltipContent> </Tooltip> </TooltipProvider> @@ -843,7 +847,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { </Button> </TooltipTrigger> <TooltipContent side="left"> - <p>행 삭제</p> + <p>{t("tooltips.deleteRow")}</p> </TooltipContent> </Tooltip> </TooltipProvider> @@ -864,7 +868,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { disabled={!selectedTagTypeCode || isLoadingSubFields || subFields.length === 0} > <Plus className="h-4 w-4 mr-2" /> - 새 행 추가 + {t("buttons.addRow")} </Button> </div> </div> @@ -903,15 +907,15 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { > <DialogTrigger asChild> <Button variant="default" size="sm"> - 태그 추가 + {t("buttons.addTags")} </Button> </DialogTrigger> <DialogContent className="max-h-[90vh] max-w-[95vw]" style={{ width: 1500 }}> <DialogHeader> - <DialogTitle>새 태그 추가</DialogTitle> + <DialogTitle>{t("dialogs.addFormTag")}</DialogTitle> <DialogDescription> - 클래스와 서브클래스를 선택하여 태그 유형과 하위 필드를 로드한 다음, 여러 행을 추가하여 여러 태그를 생성하세요. + {t("dialogs.selectClassToLoadFields")} </DialogDescription> </DialogHeader> @@ -968,7 +972,7 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { }} disabled={isSubmitting} > - 취소 + {t("buttons.cancel")} </Button> <Button type="submit" @@ -977,10 +981,10 @@ export function AddTagDialog({ selectedPackageId }: AddTagDialogProps) { {isSubmitting ? ( <> <Loader2 className="mr-2 h-4 w-4 animate-spin" /> - 처리 중... + {t("messages.processing")} </> ) : ( - `${fields.length}개 태그 생성` + `${fields.length}${t("buttons.createTags")}` )} </Button> </div> |