feat: deals filters

src/app/deals/components/desktop/DealsTable/DealsTable.tsx

@@ -1,63 +1,39 @@
-import { IconEdit } from "@tabler/icons-react";
-import { MRT_TableOptions } from "mantine-react-table";
-import { ActionIcon, Group, Pagination, Stack, Tooltip } from "@mantine/core";
+import { FC } from "react";
+import { IconMoodSad } from "@tabler/icons-react";
+import { Group, Pagination, Stack, Text } from "@mantine/core";
 import useDealsTableColumns from "@/app/deals/components/desktop/DealsTable/useDealsTableColumns";
 import { useDealsContext } from "@/app/deals/contexts/DealsContext";
 import BaseTable from "@/components/ui/BaseTable/BaseTable";
-import { useDrawersContext } from "@/drawers/DrawersContext";
-import { DealSchema } from "@/lib/client";
 
-const DealsTable = () => {
-    const { deals, paginationInfo, page, setPage, dealsCrud } =
+const DealsTable: FC = () => {
+    const { deals, paginationInfo, page, setPage, dealsFilters } =
         useDealsContext();
-    const { openDrawer } = useDrawersContext();
     const columns = useDealsTableColumns();
-    const defaultSorting = [{ id: "createdAt", desc: false }];
-
-    const onEditDeal = (deal: DealSchema) => {
-        openDrawer({
-            key: "dealEditorDrawer",
-            props: {
-                deal,
-                dealsCrud,
-            },
-        });
-    };
 
     return (
         <Stack
             gap={"xs"}
             h={"calc(100vh - 125px)"}>
             <BaseTable
-                data={deals}
+                records={[...deals]}
                 columns={columns}
-                restProps={
-                    {
-                        enableSorting: true,
-                        enableColumnActions: false,
-                        paginationDisplayMode: "pages",
-                        initialState: {
-                            sorting: defaultSorting,
-                        },
-                        mantinePaginationProps: {
-                            showRowsPerPage: false,
-                        },
-                        enableStickyHeader: true,
-                        enableStickyFooter: true,
-                        enableRowActions: true,
-                        renderRowActions: ({ row }) => (
-                            <Tooltip label="Редактировать">
-                                <ActionIcon
-                                    bdrs={"md"}
-                                    size={"lg"}
-                                    onClick={() => onEditDeal(row.original)}
-                                    variant={"default"}>
-                                    <IconEdit />
-                                </ActionIcon>
-                            </Tooltip>
-                        ),
-                    } as MRT_TableOptions<DealSchema>
+                sortStatus={{
+                    columnAccessor: dealsFilters.sortingField,
+                    direction: dealsFilters.sortingDirection,
+                }}
+                onSortStatusChange={sorting => {
+                    dealsFilters.setSortingField(sorting.columnAccessor);
+                    dealsFilters.setSortingDirection(sorting.direction);
+                }}
+                emptyState={
+                    <Group
+                        align={"center"}
+                        gap={"xs"}>
+                        <Text>Нет сделок</Text>
+                        <IconMoodSad />
+                    </Group>
                 }
+                groups={undefined}
             />
             {paginationInfo && paginationInfo.totalPages > 1 && (
                 <Group justify={"flex-end"}>