From 2acf5f8966a40c1c9a97680c8dc263ee3f1ad3d1 Mon Sep 17 00:00:00 2001 From: dujinkim Date: Wed, 2 Jul 2025 00:45:49 +0000 Subject: (대표님/최겸) 20250702 변경사항 업데이트 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lib/qna/table/qna-table.tsx | 236 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 236 insertions(+) create mode 100644 lib/qna/table/qna-table.tsx (limited to 'lib/qna/table/qna-table.tsx') diff --git a/lib/qna/table/qna-table.tsx b/lib/qna/table/qna-table.tsx new file mode 100644 index 00000000..45efc124 --- /dev/null +++ b/lib/qna/table/qna-table.tsx @@ -0,0 +1,236 @@ +"use client" + +import * as React from "react" +import { qnaView, type QnaViewSelect } from "@/db/schema" +import type { + DataTableAdvancedFilterField, + DataTableFilterField, + DataTableRowAction, +} from "@/types/table" + +import { toSentenceCase } from "@/lib/utils" +import { useDataTable } from "@/hooks/use-data-table" +import { DataTable } from "@/components/data-table/data-table" +import { DataTableAdvancedToolbar } from "@/components/data-table/data-table-advanced-toolbar" +import { DataTableToolbar } from "@/components/data-table/data-table-toolbar" + +import { QNA_FILTER_OPTIONS, QNA_DOMAIN, QNA_VENDOR_TYPE } from "@/lib/qna/validation" +import { DeleteQnaDialog } from "./delete-qna-dialog" +import { CreateQnaDialog } from "./create-qna-dialog" +import { UpdateQnaSheet } from "./update-qna-sheet" +import { QnaTableToolbarActions } from "./qna-table-toolbar-actions" +import { getColumns } from "./qna-table-columns" +import { getQnaList } from "../service" +import { useRouter } from "next/navigation" +import { getDomainIcon, getQnaStatusIcon, getVendorTypeIcon } from "./utils" +import { useSession } from "next-auth/react"; + +interface QnaTableProps { + promises: Promise< + [ + Awaited>, + // 추가 통계 데이터가 필요하면 여기에 추가 + ] + > + domain:string +} + +export function QnaTable({ promises, domain }: QnaTableProps) { + const [{ data, pageCount }] = React.use(promises) + const router = useRouter() + const { data: session } = useSession(); + + console.log(data) + + const [rowAction, setRowAction] = + React.useState | null>(null) + + const [isCreateDialogOpen, setIsCreateDialogOpen] = React.useState(false) + + const columns = React.useMemo( + () => + getColumns({ + setRowAction, + router, + currentUserId: session?.user?.id, // 여기서 전달 + }), + [router, setRowAction, session?.user?.id] + ); + // 기본 필터 필드들 (상단 검색/필터 바용) + const filterFields: DataTableFilterField[] = [ + { + id: "title", + label: "제목", + placeholder: "제목으로 검색...", + }, + { + id: "authorName", + label: "작성자", + placeholder: "작성자명으로 검색...", + }, + { + id: "companyName", + label: "회사명", + placeholder: "회사명으로 검색...", + }, + { + id: "authorDomain", + label: "도메인", + options: QNA_FILTER_OPTIONS.authorDomain.map((domain) => ({ + label: domain.label, + value: domain.value, + icon: getDomainIcon(domain.value), + })), + }, + { + id: "vendorType", + label: "벤더 타입", + options: QNA_FILTER_OPTIONS.vendorType.map((type) => ({ + label: type.label, + value: type.value, + icon: getVendorTypeIcon(type.value), + })), + }, + { + id: "hasAnswers", + label: "답변 상태", + options: QNA_FILTER_OPTIONS.hasAnswers.map((status) => ({ + label: status.label, + value: status.value, + icon: getQnaStatusIcon(status.value), + })), + }, + ] + + // 고급 필터 필드들 (고급 검색용) + const advancedFilterFields: DataTableAdvancedFilterField[] = [ + { + id: "title", + label: "제목", + type: "text", + }, + { + id: "content", + label: "내용", + type: "text", + }, + { + id: "authorName", + label: "작성자명", + type: "text", + }, + { + id: "companyName", + label: "회사명", + type: "text", + }, + { + id: "authorDomain", + label: "사용자 도메인", + type: "multi-select", + options: QNA_FILTER_OPTIONS.authorDomain.map((domain) => ({ + label: domain.label, + value: domain.value, + icon: getDomainIcon(domain.value), + })), + }, + { + id: "vendorType", + label: "벤더 타입", + type: "multi-select", + options: QNA_FILTER_OPTIONS.vendorType.map((type) => ({ + label: type.label, + value: type.value, + icon: getVendorTypeIcon(type.value), + })), + }, + { + id: "hasAnswers", + label: "답변 여부", + type: "boolean", + }, + { + id: "isPopular", + label: "인기 질문", + type: "boolean", + }, + { + id: "totalAnswers", + label: "답변 수", + type: "number", + }, + { + id: "totalComments", + label: "댓글 수", + type: "number", + }, + { + id: "createdAt", + label: "작성일", + type: "date", + }, + { + id: "lastActivityAt", + label: "최근 활동일", + type: "date", + }, + ] + + const { table } = useDataTable({ + data, + columns, + pageCount, + filterFields, + enablePinning: true, + enableAdvancedFilter: true, + initialState: { + sorting: [{ id: "lastActivityAt", desc: true }], // 최근 활동순으로 기본 정렬 + columnPinning: { right: ["actions"] }, + }, + getRowId: (originalRow) => originalRow.id.toString(), + shallow: false, + clearOnDefault: true, + }) + + return ( + <> + + + setIsCreateDialogOpen(true)} + /> + + + + {/* 질문 생성 다이얼로그 */} + + + {/* 질문 수정 시트 */} + setRowAction(null)} + qna={rowAction?.row.original ?? null} + /> + + {/* 질문 삭제 다이얼로그 */} + setRowAction(null)} + qnas={rowAction?.row.original ? [rowAction?.row.original] : []} + showTrigger={false} + onSuccess={() => rowAction?.row.toggleSelected(false)} + /> + + ) +} \ No newline at end of file -- cgit v1.2.3