1import {
2 EntityDataTable,
3 DataTablePagination,
4 TableFiltering,
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 TableFilteringComponent = TableFiltering 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 TableFilteringComponent,
31 DataTablePaginationComponent,
32 EntityDataTableComponent
33 }
34};
35
36export default meta;
37
38
39type Story = StoryObj<typeof EntityTable>;
40
41export const BasicEntityTable: Story = {
42 args: {
43 fetchEntity: fetchEntity,
44 columnsFn: columnsFnBasicEntityTable,
45 filteredColumn: "name",
46 entityKey: "entities",
47 onCreate: () => alert("Create entity"),
48 onEdit: (entity: any) => alert(`Edit entity: ${JSON.stringify(entity)}`),
49 onOpen: (entity: any) => alert(`Open entity: ${JSON.stringify(entity)}`),
50 onDelete: (entity: any) => alert(`Delete entity: ${JSON.stringify(entity)}`),
51 }
52};
53
54export const LoadingEntityTable: Story = {
55 args: {
56 fetchEntity: fetchEntityLoading,
57 columnsFn: columnsFnBasicEntityTable,
58 filteredColumn: "name",
59 entityKey: "entities",
60 onCreate: () => alert("Create entity"),
61 onEdit: (entity: any) => alert(`Edit entity: ${JSON.stringify(entity)}`),
62 onOpen: (entity: any) => alert(`Open entity: ${JSON.stringify(entity)}`),
63 onDelete: (entity: any) => alert(`Delete entity: ${JSON.stringify(entity)}`),
64 }
65};