summaryrefslogtreecommitdiff
path: root/components/data-table
diff options
context:
space:
mode:
Diffstat (limited to 'components/data-table')
-rw-r--r--components/data-table/data-table-filter-list.tsx4
-rw-r--r--components/data-table/data-table-group-list.tsx7
-rw-r--r--components/data-table/data-table-pin-left.tsx7
-rw-r--r--components/data-table/data-table-pin-right.tsx9
-rw-r--r--components/data-table/data-table-sort-list.tsx8
-rw-r--r--components/data-table/data-table-view-options.tsx8
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>