-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
build: add DataGrid Storybook stories
- Loading branch information
1 parent
88f9be4
commit ff08ac5
Showing
1 changed file
with
73 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,73 @@ | ||
import Box from "@mui/material/Box"; | ||
import ConstructionIcon from "@mui/icons-material/Construction"; | ||
import { withNavDecorator, type NavDecoratorArgs } from "@/../.storybook/decorators"; | ||
import { TABLE_VIEW_DATA_SETS } from "@/layouts/CoreItemsListView/types"; | ||
import { | ||
workOrderTableProps, | ||
type WorkOrderTableRowData, | ||
} from "@/pages/WorkOrdersListView/tableProps"; | ||
import { MOCK_WORK_ORDERS } from "@/tests/mockItems"; | ||
import { DataGrid, type DataGridProps } from "./DataGrid"; | ||
import type { Meta, StoryObj } from "@storybook/react"; | ||
|
||
const meta = { | ||
title: "Components/DataGrid", | ||
component: DataGrid<WorkOrderTableRowData>, | ||
tags: ["autodocs"], | ||
parameters: { | ||
layout: "padded", | ||
}, | ||
decorators: [ | ||
(Story) => ( | ||
<Box | ||
sx={{ | ||
margin: "1rem", | ||
display: "flex", | ||
height: "90vh", | ||
minHeight: "21rem", // 336px | ||
alignItems: "center", | ||
justifyContent: "center", | ||
}} | ||
> | ||
<Story /> | ||
</Box> | ||
), | ||
withNavDecorator, | ||
], | ||
args: { | ||
/* DataGrid requires its parent node to have explicit dimensions (not %-based), but | ||
sometimes the Storybook rendering process yields a DataGrid before its Box-decorator-parent | ||
is rendered with known dimensions, so `logLevel` is false here to silence those warnings.*/ | ||
logLevel: false, | ||
}, | ||
} satisfies Meta<DataGridProps<WorkOrderTableRowData>>; | ||
|
||
export default meta; | ||
|
||
/////////////////////////////////////////////////////////// | ||
// STORIES | ||
|
||
export const WorkOrdersDemo = { | ||
args: { | ||
...workOrderTableProps, | ||
rowDataItemName: "Work Orders", | ||
backgroundIcon: <ConstructionIcon />, | ||
rows: [ | ||
...MOCK_WORK_ORDERS.myWorkOrders.createdByUser.map((wo) => ({ | ||
dataSet: TABLE_VIEW_DATA_SETS.SENT, | ||
...wo, | ||
})), | ||
...MOCK_WORK_ORDERS.myWorkOrders.assignedToUser.map((wo) => ({ | ||
dataSet: TABLE_VIEW_DATA_SETS.RECEIVED, | ||
...wo, | ||
})), | ||
], | ||
}, | ||
} satisfies StoryObj<typeof meta & NavDecoratorArgs>; | ||
|
||
export const Empty = { | ||
args: { | ||
...WorkOrdersDemo.args, | ||
rows: [], | ||
}, | ||
} satisfies StoryObj<typeof meta>; |