gitscope
← marzneshin / v0.6.0 / dashboard/src/features/entity-table/hooks/use-sidebar-entity-table.ts
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/entity-table/hooks/use-sidebar-entity-table.ts · TypeScript
Blame Raw
  1import { useMemo } from "react";
  2import { useTranslation } from "react-i18next";
  3import { useQuery } from "@tanstack/react-query";
  4import {
  5    usePrimaryFiltering,
  6    usePagination,
  7    useEntityTable,
  8    useVisibility,
  9    useSorting,
 10    useFilters,
 11    type EntitySidebarQueryKeyType,
 12    type FetchEntityReturn,
 13    type SidebarQueryKey,
 14    type UseRowSelectionReturn
 15} from ".";
 16import { useScreenBreakpoint } from "@marzneshin/hooks";
 17import {
 18    type SidebarEntityCardSectionsProps
 19} from "@marzneshin/features/entity-table/components";
 20
 21interface UseSidebarEntityTableParams<T, S> {
 22    fetchEntity: ({ queryKey }: EntitySidebarQueryKeyType) => FetchEntityReturn<T>;
 23    sidebarEntities: S[];
 24    setSidebarEntityId: (entity: string | undefined) => void;
 25    sidebarEntityId?: string;
 26    sidebarCardProps: SidebarEntityCardSectionsProps<S>;
 27    secondaryEntityKey: string;
 28    columnsFn: any;
 29    filteredColumn: string;
 30    entityKey: string;
 31    rowSelection?: UseRowSelectionReturn;
 32    manualSorting?: boolean;
 33    onCreate: () => void;
 34    onEdit: (entity: T) => void;
 35    onOpen: (entity: T) => void;
 36    onDelete: (entity: T) => void;
 37}
 38
 39export const useSidebarEntityTable = <T, S>({
 40    fetchEntity,
 41    columnsFn,
 42    filteredColumn,
 43    rowSelection,
 44    entityKey,
 45    onCreate,
 46    onEdit,
 47    onOpen,
 48    onDelete,
 49    sidebarEntityId,
 50    setSidebarEntityId,
 51    sidebarEntities,
 52    sidebarCardProps,
 53    secondaryEntityKey,
 54}: UseSidebarEntityTableParams<T, S>) => {
 55    const { t } = useTranslation();
 56    const primaryFilter = usePrimaryFiltering({ column: filteredColumn });
 57    const filters = useFilters();
 58    const sorting = useSorting();
 59    const visibility = useVisibility();
 60    const desktop = useScreenBreakpoint("md");
 61    const { onPaginationChange, pageIndex, pageSize } = usePagination();
 62
 63    const query: SidebarQueryKey = [
 64        entityKey,
 65        sidebarEntityId,
 66        secondaryEntityKey,
 67        {
 68            page: pageIndex,
 69            size: pageSize,
 70        },
 71        primaryFilter.columnFilters,
 72        {
 73            sortBy: sorting.sorting[0]?.id ? sorting.sorting[0].id : "created_at",
 74            desc: sorting.sorting[0]?.desc
 75        },
 76        { filters: filters.columnsFilter }
 77    ];
 78
 79    const { data, isFetching } = useQuery({
 80        queryFn: fetchEntity,
 81        queryKey: query,
 82        initialData: { entities: [], pageCount: 1 },
 83    });
 84
 85    const columns = columnsFn({ onEdit, onDelete, onOpen });
 86    const table = useEntityTable({
 87        data,
 88        columns,
 89        pageSize,
 90        pageIndex,
 91        rowSelection,
 92        visibility,
 93        sorting,
 94        onPaginationChange,
 95    });
 96
 97    const entityTableContextValue = useMemo(
 98        () => ({ table, data: data.entities, primaryFilter, filters, isLoading: isFetching }),
 99        [table, data.entities, filters, primaryFilter, isFetching],
100    );
101
102    const sidebarEntityTableContextValue = useMemo(
103        () => ({
104            sidebarEntities,
105            setSidebarEntityId,
106            sidebarEntityId,
107            sidebarCardProps
108        }),
109        [sidebarEntities, setSidebarEntityId, sidebarEntityId, sidebarCardProps],
110    );
111
112    return {
113        t,
114        desktop,
115        table,
116        entityTableContextValue,
117        sidebarEntityTableContextValue,
118        columns,
119        onCreate
120    };
121};