summaryrefslogtreecommitdiff
path: root/lib/qna/table/qna-table.tsx
diff options
context:
space:
mode:
authordujinkim <dujin.kim@dtsolution.co.kr>2025-07-02 00:45:49 +0000
committerdujinkim <dujin.kim@dtsolution.co.kr>2025-07-02 00:45:49 +0000
commit2acf5f8966a40c1c9a97680c8dc263ee3f1ad3d1 (patch)
treef406b5c86f563347c7fd088a85fd1a82284dc5ff /lib/qna/table/qna-table.tsx
parent6a9ca20deddcdcbe8495cf5a73ec7ea5f53f9b55 (diff)
(대표님/최겸) 20250702 변경사항 업데이트
Diffstat (limited to 'lib/qna/table/qna-table.tsx')
-rw-r--r--lib/qna/table/qna-table.tsx236
1 files changed, 236 insertions, 0 deletions
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<ReturnType<typeof getQnaList>>,
+ // 추가 통계 데이터가 필요하면 여기에 추가
+ ]
+ >
+ 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<DataTableRowAction<QnaViewSelect> | 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<QnaViewSelect>[] = [
+ {
+ 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<QnaViewSelect>[] = [
+ {
+ 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 (
+ <>
+ <DataTable
+ table={table}
+ >
+ <DataTableAdvancedToolbar
+ table={table}
+ filterFields={advancedFilterFields}
+ shallow={false}
+ >
+ <QnaTableToolbarActions
+ table={table}
+ domain={domain}
+ onCreateClick={() => setIsCreateDialogOpen(true)}
+ />
+ </DataTableAdvancedToolbar>
+ </DataTable>
+
+ {/* 질문 생성 다이얼로그 */}
+ <CreateQnaDialog
+ open={isCreateDialogOpen}
+ onOpenChange={setIsCreateDialogOpen}
+ />
+
+ {/* 질문 수정 시트 */}
+ <UpdateQnaSheet
+ open={rowAction?.type === "update"}
+ onOpenChange={() => setRowAction(null)}
+ qna={rowAction?.row.original ?? null}
+ />
+
+ {/* 질문 삭제 다이얼로그 */}
+ <DeleteQnaDialog
+ open={rowAction?.type === "delete"}
+ onOpenChange={() => setRowAction(null)}
+ qnas={rowAction?.row.original ? [rowAction?.row.original] : []}
+ showTrigger={false}
+ onSuccess={() => rowAction?.row.toggleSelected(false)}
+ />
+ </>
+ )
+} \ No newline at end of file