add: tasks func()

Signed-off-by: Kenneth Obsequio <k80308392@gmail.com>
2026-09-27 00:12:54 +08:00 · 2026-05-20 13:18:44 +08:00
parent 2b1955608d
commit 8e67b84d4d
36 changed files with 3752 additions and 3 deletions
@@ -0,0 +1,193 @@
+import { useMemo, useRef, useState, useCallback } from "react";
+import { useNavigate } from "react-router-dom";
+
+import { useAdminTask } from "@/contexts/AdminTaskContext";
+
+import DataTable from "@/components/generic/Table/DataTable";
+import { FilterSheet } from "@/components/generic/Sheet/FilterSheet";
+import { ArchiveDialog } from "@/components/generic/Dialogs/ArchiveDialog";
+import { RestoreDialog } from "@/components/generic/Dialogs/RestoreDialog";
+
+import { buildDataColumns, columnPinning } from "../../config/task_list/columns.config";
+import { buildToolbarActions } from "../../config/task_list/toolbar.config";
+import { buildSelectionActions } from "../../config/task_list/selection.config";
+import { buildRowActions } from "../../config/task_list/rowActions.config";
+
+import { getTimestamp } from "@/utils/timestamp.util";
+
+export default function TaskListTable() {
+    const navigate = useNavigate();
+
+    const {
+        taskLists, attributes, pagination, loading,
+        fetchTaskLists, fetchArchivedTaskLists,
+        archiveTaskList, restoreTaskList,
+        bulkArchiveTaskLists, bulkRestoreTaskLists,
+    } = useAdminTask();
+
+    const [showArchived, setShowArchived] = useState(false);
+    const [archiveTarget, setArchiveTarget] = useState(null);
+    const [restoreTarget, setRestoreTarget] = useState(null);
+    const [archiveIds, setArchiveIds] = useState(null);
+    const [restoreIds, setRestoreIds] = useState(null);
+
+    const tableRefsRef = useRef({
+        getFilters: () => [],
+        getSort: () => [],
+        resetSelection: () => { },
+        tableInstance: null,
+    });
+
+    const handleRefsReady = (refs) => {
+        tableRefsRef.current = refs;
+    };
+
+    // ── Toggle archived view ──────────────────────────────────────────────────
+    const handleToggleArchived = useCallback(() => {
+        const next = !showArchived;
+        setShowArchived(next);
+        fetchTaskLists({
+            page: 1,
+            limit: pagination?.limit ?? 10,
+            filters: tableRefsRef.current.getFilters(),
+            sort: tableRefsRef.current.getSort(),
+            archived: next,
+        });
+    }, [showArchived, pagination, fetchTaskLists, fetchArchivedTaskLists]);
+
+    // ── Refetch helper ────────────────────────────────────────────────────────
+    const handleSuccess = () => {
+        setArchiveTarget(null);
+        setRestoreTarget(null);
+        setArchiveIds(null);
+        setRestoreIds(null);
+        tableRefsRef.current.resetSelection?.();
+        const fetcher = showArchived ? fetchArchivedTaskLists : fetchTaskLists;
+        fetcher({
+            page: 1,
+            limit: pagination?.limit ?? 10,
+            filters: tableRefsRef.current.getFilters(),
+            sort: tableRefsRef.current.getSort(),
+        });
+    };
+
+    // ── Export config ─────────────────────────────────────────────────────────
+    const exportConfig = {
+        allData: taskLists,
+        attributes,
+        filename: `${getTimestamp()}_TaskLists`,
+        sheetName: "Task Lists",
+    };
+
+    // ── Row actions ───────────────────────────────────────────────────────────
+    const rowActions = buildRowActions({
+        navigate,
+        onArchive: (row) => setArchiveTarget(row),
+        onRestore: (row) => setRestoreTarget(row),
+        showArchived,
+    });
+
+    // ── Toolbar ───────────────────────────────────────────────────────────────
+    const toolbarActions = buildToolbarActions({
+        fetchTaskLists, fetchArchivedTaskLists, pagination, navigate,
+        showArchived,
+        onToggleArchived: handleToggleArchived,
+        getFilters: () => tableRefsRef.current.getFilters(),
+        getSort: () => tableRefsRef.current.getSort(),
+        getTableInstance: () => tableRefsRef.current.tableInstance,
+    });
+
+    // ── Selection ─────────────────────────────────────────────────────────────
+    const selectionActions = buildSelectionActions({
+        exportConfig,
+        showArchived,
+        onArchive: (row) => setArchiveTarget(row),
+        onArchiveMany: (ids) => setArchiveIds(ids),
+        onRestore: (row) => setRestoreTarget(row),
+        onRestoreMany: (ids) => setRestoreIds(ids),
+        getTableInstance: () => tableRefsRef.current.tableInstance,
+    });
+
+    // ── Columns ───────────────────────────────────────────────────────────────
+    const columns = useMemo(
+        () => buildDataColumns(attributes, rowActions),
+        [attributes, rowActions]
+    );
+
+    return (
+        <>
+            <DataTable
+                title="Task Lists"
+                data={taskLists}
+                columns={columns}
+                attributes={attributes}
+                pagination={pagination}
+                loading={loading}
+                onFetch={fetchTaskLists}
+                onFetchFilterData={() => []}
+                onRefsReady={handleRefsReady}
+                renderFilterSheet={({ open, onOpenChange, column, attr, data, loading }) => (
+                    <FilterSheet
+                        open={open}
+                        onOpenChange={onOpenChange}
+                        column={column}
+                        attr={attr}
+                        data={data}
+                        loading={loading}
+                    />
+                )}
+                columnPinning={columnPinning}
+                toolbarActions={toolbarActions}
+                selectionActions={selectionActions}
+                recordLabel="task list"
+                emptyMessage="No task lists found."
+            />
+
+            {/* Single archive */}
+            <ArchiveDialog
+                open={!!archiveTarget}
+                onOpenChange={(v) => !v && setArchiveTarget(null)}
+                entity={archiveTarget}
+                entityLabel="Task List"
+                getName={(r) => r?.name}
+                onArchive={(r) => archiveTaskList(r?.task_list_id)}
+                loading={loading}
+                onSuccess={handleSuccess}
+            />
+
+            {/* Single restore */}
+            <RestoreDialog
+                open={!!restoreTarget}
+                onOpenChange={(v) => !v && setRestoreTarget(null)}
+                entity={restoreTarget}
+                entityLabel="Task List"
+                getName={(r) => r?.name}
+                onRestore={(r) => restoreTaskList(r?.task_list_id)}
+                loading={loading}
+                onSuccess={handleSuccess}
+            />
+
+            {/* Bulk archive */}
+            <ArchiveDialog
+                open={!!archiveIds}
+                onOpenChange={(v) => !v && setArchiveIds(null)}
+                ids={archiveIds ?? []}
+                entityLabel="Task List"
+                onArchive={(ids) => bulkArchiveTaskLists(ids)}
+                loading={loading}
+                onSuccess={handleSuccess}
+            />
+
+            {/* Bulk restore */}
+            <RestoreDialog
+                open={!!restoreIds}
+                onOpenChange={(v) => !v && setRestoreIds(null)}
+                ids={restoreIds ?? []}
+                entityLabel="Task List"
+                onRestore={(ids) => bulkRestoreTaskLists(ids)}
+                loading={loading}
+                onSuccess={handleSuccess}
+            />
+        </>
+    );
+}