1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
|
"use client";
import { ColumnDef } from "@tanstack/react-table";
import { FileInfoItem } from "../actions";
import { Button } from "@/components/ui/button";
import { Download } from "lucide-react";
import { formatDolceDateTime } from "../utils/date-formatter";
interface FileListColumnsProps {
onDownload: (file: FileInfoItem) => void;
lng?: string;
}
export const createFileListColumns = ({
onDownload,
lng = "ko",
}: FileListColumnsProps): ColumnDef<FileInfoItem>[] => [
{
accessorKey: "FileSeq",
header: lng === "ko" ? "순번" : "No.",
minSize: 80,
cell: ({ row }) => {
return <div className="text-center">{row.getValue("FileSeq")}</div>;
},
},
{
accessorKey: "FileName",
header: lng === "ko" ? "파일명" : "File Name",
minSize: 300,
cell: ({ row }) => {
return <div className="font-medium">{row.getValue("FileName")}</div>;
},
},
{
accessorKey: "FileSize",
header: lng === "ko" ? "파일크기" : "File Size",
minSize: 100,
cell: ({ row }) => {
const size = parseInt(row.getValue("FileSize") as string);
if (isNaN(size) || size === 0) return "-";
if (size < 1024) return `${size} B`;
if (size < 1024 * 1024) return `${(size / 1024).toFixed(2)} KB`;
return `${(size / (1024 * 1024)).toFixed(2)} MB`;
},
},
{
accessorKey: "CreateDt",
header: lng === "ko" ? "생성일시" : "Created Date",
minSize: 200,
cell: ({ row }) => {
const date = row.getValue("CreateDt") as string;
return <div className="text-sm text-muted-foreground">{formatDolceDateTime(date)}</div>;
},
},
{
id: "actions",
header: lng === "ko" ? "다운로드" : "Download",
minSize: 120,
cell: ({ row }) => {
return (
<Button
variant="outline"
size="sm"
onClick={() => onDownload(row.original)}
>
<Download className="h-4 w-4 mr-2" />
{lng === "ko" ? "다운로드" : "Download"}
</Button>
);
},
},
];
|