diff options
Diffstat (limited to 'components/data-table')
| -rw-r--r-- | components/data-table/data-table-filter-list.tsx | 4 | ||||
| -rw-r--r-- | components/data-table/data-table-group-list.tsx | 7 | ||||
| -rw-r--r-- | components/data-table/data-table-pin-left.tsx | 7 | ||||
| -rw-r--r-- | components/data-table/data-table-pin-right.tsx | 9 | ||||
| -rw-r--r-- | components/data-table/data-table-sort-list.tsx | 8 | ||||
| -rw-r--r-- | components/data-table/data-table-view-options.tsx | 8 |
6 files changed, 34 insertions, 9 deletions
diff --git a/components/data-table/data-table-filter-list.tsx b/components/data-table/data-table-filter-list.tsx index 3efa02ed..6088e912 100644 --- a/components/data-table/data-table-filter-list.tsx +++ b/components/data-table/data-table-filter-list.tsx @@ -580,7 +580,7 @@ export function DataTableFilterList<TData>({ {/* 텍스트는 모바일에서 숨기고, sm 이상에서만 보임 */} <span className="hidden sm:inline"> - {t("Filters")} + {t("tableToolBar.filters")} </span> {filters.length > 0 && ( @@ -603,7 +603,7 @@ export function DataTableFilterList<TData>({ )} > {filters.length > 0 ? ( - <h4 className="font-medium leading-none"> {t("Filters")}</h4> + <h4 className="font-medium leading-none"> {t("tableToolBar.filters")}</h4> ) : ( <div className="flex flex-col gap-1"> <h4 className="font-medium leading-none">{t("nofilters")}</h4> diff --git a/components/data-table/data-table-group-list.tsx b/components/data-table/data-table-group-list.tsx index fcae9a79..213b429f 100644 --- a/components/data-table/data-table-group-list.tsx +++ b/components/data-table/data-table-group-list.tsx @@ -26,6 +26,8 @@ import { SortableItem, SortableDragHandle, } from "@/components/ui/sortable" +import { useTranslation } from '@/i18n/client' +import { useParams, usePathname } from "next/navigation"; interface DataTableGroupListProps<TData> { /** TanStack Table 인스턴스 (grouping을 이미 사용할 수 있어야 함) */ @@ -42,6 +44,9 @@ export function DataTableGroupList<TData>({ shallow, }: DataTableGroupListProps<TData>) { const id = React.useId() + const params = useParams(); + const lng = params?.lng as string; + const { t } = useTranslation(lng); // ------------------------------------------------------ // 1) 초기 그룹핑 상태 + URL Query State 동기화 @@ -156,7 +161,7 @@ export function DataTableGroupList<TData>({ aria-controls={`${id}-group-dialog`} > <Layers className="size-3" aria-hidden="true" /> - <span className="hidden sm:inline">그룹</span> + <span className="hidden sm:inline">{t("tableToolBar.group")}</span> {uniqueGrouping.length > 0 && ( <Badge variant="secondary" diff --git a/components/data-table/data-table-pin-left.tsx b/components/data-table/data-table-pin-left.tsx index 27116774..aed86844 100644 --- a/components/data-table/data-table-pin-left.tsx +++ b/components/data-table/data-table-pin-left.tsx @@ -20,6 +20,8 @@ import { PopoverContent, PopoverTrigger, } from "@/components/ui/popover" +import { useTranslation } from '@/i18n/client' +import { useParams, usePathname } from "next/navigation"; /** * Helper function to check if a column is a parent column (has subcolumns) @@ -92,6 +94,9 @@ const AUTO_PIN_LEFT_COLUMNS = ['select'] export function PinLeftButton<TData>({ table }: { table: Table<TData> }) { const [open, setOpen] = React.useState(false) const triggerRef = React.useRef<HTMLButtonElement>(null) + const params = useParams(); + const lng = params?.lng as string; + const { t } = useTranslation(lng); // Try to auto-pin select and action columns if they exist React.useEffect(() => { @@ -180,7 +185,7 @@ export function PinLeftButton<TData>({ table }: { table: Table<TData> }) { <MoveLeft className="size-4" /> <span className="hidden sm:inline"> - 왼쪽 고정 + {t("tableToolBar.leftPin")} </span> </Button> </PopoverTrigger> diff --git a/components/data-table/data-table-pin-right.tsx b/components/data-table/data-table-pin-right.tsx index 133740e1..1555985b 100644 --- a/components/data-table/data-table-pin-right.tsx +++ b/components/data-table/data-table-pin-right.tsx @@ -20,7 +20,8 @@ import { PopoverContent, PopoverTrigger, } from "@/components/ui/popover" - +import { useTranslation } from '@/i18n/client' +import { useParams, usePathname } from "next/navigation"; /** * Helper function to check if a column is a parent column (has subcolumns) */ @@ -92,7 +93,9 @@ const AUTO_PIN_RIGHT_COLUMNS = ['actions', "action"] export function PinRightButton<TData>({ table }: { table: Table<TData> }) { const [open, setOpen] = React.useState(false) const triggerRef = React.useRef<HTMLButtonElement>(null) - + const params = useParams(); + const lng = params?.lng as string; + const { t } = useTranslation(lng); // Try to auto-pin actions columns if they exist React.useEffect(() => { AUTO_PIN_RIGHT_COLUMNS.forEach((columnId) => { @@ -179,7 +182,7 @@ export function PinRightButton<TData>({ table }: { table: Table<TData> }) { <MoveRight className="size-4" /> <span className="hidden sm:inline"> - 오른 고정 + {t("tableToolBar.rigthPin")} </span> </Button> </PopoverTrigger> diff --git a/components/data-table/data-table-sort-list.tsx b/components/data-table/data-table-sort-list.tsx index c752f2f4..21926f34 100644 --- a/components/data-table/data-table-sort-list.tsx +++ b/components/data-table/data-table-sort-list.tsx @@ -47,6 +47,8 @@ import { SortableDragHandle, SortableItem, } from "@/components/ui/sortable" +import { useTranslation } from '@/i18n/client' +import { useParams, usePathname } from "next/navigation"; interface DataTableSortListProps<TData> { table: Table<TData> @@ -63,6 +65,10 @@ export function DataTableSortList<TData>({ }: DataTableSortListProps<TData>) { renderCount++; + const params = useParams(); + const lng = params?.lng as string; + const { t } = useTranslation(lng); + const id = React.useId() const initialSorting = (table.initialState.sorting ?? @@ -186,7 +192,7 @@ export function DataTableSortList<TData>({ <ArrowDownUp className="size-3" aria-hidden="true" /> <span className="hidden sm:inline"> - 정렬 + {t("tableToolBar.sort")} </span> {uniqueSorting.length > 0 && ( diff --git a/components/data-table/data-table-view-options.tsx b/components/data-table/data-table-view-options.tsx index c4167b47..422e3065 100644 --- a/components/data-table/data-table-view-options.tsx +++ b/components/data-table/data-table-view-options.tsx @@ -37,6 +37,8 @@ import { SortableItem, SortableDragHandle, } from "@/components/ui/sortable" +import { useTranslation } from '@/i18n/client' +import { useParams, usePathname } from "next/navigation"; /** @@ -68,6 +70,10 @@ export function DataTableViewOptions<TData>({ }: DataTableViewOptionsProps<TData>) { const triggerRef = React.useRef<HTMLButtonElement>(null) + const params = useParams(); + const lng = params?.lng as string; + const { t } = useTranslation(lng); + // 1) Identify columns that can be hidden const hideableCols = React.useMemo(() => { return table @@ -128,7 +134,7 @@ export function DataTableViewOptions<TData>({ className="gap-2" > <Settings2 className="size-4" /> - <span className="hidden sm:inline">보기</span> + <span className="hidden sm:inline">{t("tableToolBar.view")}</span> </Button> </PopoverTrigger> |
