summaryrefslogtreecommitdiff
path: root/lib/tech-vendor-candidates/table/candidates-table.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'lib/tech-vendor-candidates/table/candidates-table.tsx')
-rw-r--r--lib/tech-vendor-candidates/table/candidates-table.tsx173
1 files changed, 0 insertions, 173 deletions
diff --git a/lib/tech-vendor-candidates/table/candidates-table.tsx b/lib/tech-vendor-candidates/table/candidates-table.tsx
deleted file mode 100644
index 9dab8f6d..00000000
--- a/lib/tech-vendor-candidates/table/candidates-table.tsx
+++ /dev/null
@@ -1,173 +0,0 @@
-"use client"
-
-import * as React from "react"
-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 { useFeatureFlags } from "./feature-flags-provider"
-import { getVendorCandidateCounts, getVendorCandidates } from "../service"
-import { vendorCandidates ,VendorCandidatesWithVendorInfo} from "@/db/schema/vendors"
-import { VendorCandidateTableFloatingBar } from "./candidates-table-floating-bar"
-import { getColumns } from "./candidates-table-columns"
-import { CandidatesTableToolbarActions } from "./candidates-table-toolbar-actions"
-import { DeleteCandidatesDialog } from "./delete-candidates-dialog"
-import { UpdateCandidateSheet } from "./update-candidate-sheet"
-import { getCandidateStatusIcon } from "@/lib/vendor-candidates/utils"
-
-interface VendorCandidatesTableProps {
- promises: Promise<
- [
- Awaited<ReturnType<typeof getVendorCandidates>>,
- Awaited<ReturnType<typeof getVendorCandidateCounts>>,
- ]
- >
-}
-
-export function VendorCandidateTable({ promises }: VendorCandidatesTableProps) {
- const { featureFlags } = useFeatureFlags()
-
- const [{ data, pageCount }, statusCounts] =
- React.use(promises)
-
-
-
- const [rowAction, setRowAction] =
- React.useState<DataTableRowAction<VendorCandidatesWithVendorInfo> | null>(null)
-
- const columns = React.useMemo(
- () => getColumns({ setRowAction }),
- [setRowAction]
- )
-
- /**
- * This component can render either a faceted filter or a search filter based on the `options` prop.
- *
- * @prop options - An array of objects, each representing a filter option. If provided, a faceted filter is rendered. If not, a search filter is rendered.
- *
- * Each `option` object has the following properties:
- * @prop {string} label - The label for the filter option.
- * @prop {string} value - The value for the filter option.
- * @prop {React.ReactNode} [icon] - An optional icon to display next to the label.
- * @prop {boolean} [withCount] - An optional boolean to display the count of the filter option.
- */
- const filterFields: DataTableFilterField<VendorCandidatesWithVendorInfo>[] = [
-
- {
- id: "status",
- label: "Status",
- options: vendorCandidates.status.enumValues.map((status) => ({
- label: toSentenceCase(status),
- value: status,
- count: statusCounts[status],
- })),
- },
-
- ]
-
- /**
- * Advanced filter fields for the data table.
- * These fields provide more complex filtering options compared to the regular filterFields.
- *
- * Key differences from regular filterFields:
- * 1. More field types: Includes 'text', 'multi-select', 'date', and 'boolean'.
- * 2. Enhanced flexibility: Allows for more precise and varied filtering options.
- * 3. Used with DataTableAdvancedToolbar: Enables a more sophisticated filtering UI.
- * 4. Date and boolean types: Adds support for filtering by date ranges and boolean values.
- */
- const advancedFilterFields: DataTableAdvancedFilterField<VendorCandidatesWithVendorInfo>[] = [
- {
- id: "companyName",
- label: "Company Name",
- type: "text",
- },
- {
- id: "contactEmail",
- label: "Contact Email",
- type: "text",
- },
- {
- id: "contactPhone",
- label: "Contact Phone",
- type: "text",
- },
- {
- id: "source",
- label: "source",
- type: "text",
- },
- {
- id: "status",
- label: "Status",
- type: "multi-select",
- options: vendorCandidates.status.enumValues.map((status) => ({
- label: (status),
- value: status,
- icon: getCandidateStatusIcon(status),
- count: statusCounts[status],
- })),
- },
-
- {
- id: "createdAt",
- label: "수집일",
- type: "date",
- },
- ]
-
-
- const { table } = useDataTable({
- data,
- columns,
- pageCount,
- filterFields,
- enablePinning: true,
- enableAdvancedFilter: true,
- initialState: {
- sorting: [{ id: "createdAt", desc: true }],
- columnPinning: { right: ["actions"] },
- },
- getRowId: (originalRow) => String(originalRow.id),
- shallow: false,
- clearOnDefault: true,
- })
-
- return (
- <>
- <DataTable
- table={table}
- floatingBar={<VendorCandidateTableFloatingBar table={table} />}
- >
-
- <DataTableAdvancedToolbar
- table={table}
- filterFields={advancedFilterFields}
- shallow={false}
- >
- <CandidatesTableToolbarActions table={table} />
- </DataTableAdvancedToolbar>
-
- </DataTable>
- <UpdateCandidateSheet
- open={rowAction?.type === "update"}
- onOpenChange={() => setRowAction(null)}
- candidate={rowAction?.row.original ?? null}
- />
- <DeleteCandidatesDialog
- open={rowAction?.type === "delete"}
- onOpenChange={() => setRowAction(null)}
- candidates={rowAction?.row.original ? [rowAction?.row.original] : []}
- showTrigger={false}
- onSuccess={() => rowAction?.row.toggleSelected(false)}
- />
-
- </>
- )
-}