gitscope
← marzneshin / nightly / dashboard/src/libs/entity-table/stories/entity-table.stories.tsx
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/libs/entity-table/stories/entity-table.stories.tsx · TypeScript
Blame Raw
 1import {
 2    EntityDataTable,
 3    DataTablePagination,
 4    TableSearch,
 5} from "../components";
 6import { EntityTable } from "../entity-table";
 7import React from "react";
 8import type { Meta, StoryObj } from "@storybook/react";
 9import { QueryClientProvider, QueryClient } from "@tanstack/react-query";
10
11import { columnsFnBasicEntityTable } from "./columns-fns";
12import { fetchEntity, fetchEntityLoading } from "./fetch-entities";
13
14const TableSearchComponent = TableSearch as React.FC<unknown>;
15const DataTablePaginationComponent = DataTablePagination as React.FC<unknown>;
16const EntityDataTableComponent = EntityDataTable as React.FC<unknown>;
17
18const queryClient = new QueryClient();
19
20const meta: Meta<typeof EntityTable> = {
21    title: "Features/Entity Table/Entity Table",
22    component: EntityTable,
23    decorators: [(Story) => (
24        <QueryClientProvider client={queryClient}>
25            <Story />
26        </QueryClientProvider>
27    )],
28    tags: ["autodocs"],
29    subcomponents: {
30        TableSearchComponent,
31        DataTablePaginationComponent,
32        EntityDataTableComponent
33    }
34};
35
36export default meta;
37
38
39type Story = StoryObj<typeof EntityTable>;
40
41const onEdit = (entity: any) => alert(`Edit entity: ${JSON.stringify(entity)}`)
42const onDelete = (entity: any) => alert(`Delete entity: ${JSON.stringify(entity)}`)
43const onOpen = (entity: any) => alert(`Open entity: ${JSON.stringify(entity)}`)
44
45export const BasicEntityTable: Story = {
46    args: {
47        fetchEntity: fetchEntity,
48        columns: columnsFnBasicEntityTable({ onEdit, onDelete, onOpen }),
49        primaryFilter: "name",
50        entityKey: "entities",
51        onCreate: () => alert("Create entity"),
52        onOpen: onOpen,
53    }
54};
55
56export const LoadingEntityTable: Story = {
57    args: {
58        fetchEntity: fetchEntityLoading,
59        columns: columnsFnBasicEntityTable({ onEdit, onDelete, onOpen }),
60        primaryFilter: "name",
61        entityKey: "entities",
62        onCreate: () => alert("Create entity"),
63        onOpen: onOpen,
64    }
65};