Correction from PR

marmelab · Jun 3, 2022 · cce9edc · cce9edc
1 parent da149ba
commit cce9edc
Showing 1 changed file with 49 additions and 44 deletions.
diff --git a/packages/ra-ui-materialui/src/layout/Menu.stories.tsx b/packages/ra-ui-materialui/src/layout/Menu.stories.tsx
@@ -11,47 +11,7 @@ export default { title: 'ra-ui-materialui/layout/Menu' };
 
 const resources = ['Posts', 'Comments', 'Tags', 'Users', 'Orders', 'Reviews'];
 
-export const MenuDefault = () => (
-    <Admin dataProvider={testDataProvider()} layout={StorybookLayoutDefault}>
-        {resources.map((resource, index) => {
-            return (
-                <Resource
-                    name={resource}
-                    key={`resource_${index}`}
-                    list={<StorybookList name={resource} />}
-                />
-            );
-        })}
-    </Admin>
-);
-const StorybookLayoutDefault = props => (
-    <Layout {...props} menu={StorybookMenuDefault} appBar={StorybookAppBar} />
-);
-const StorybookMenuDefault = () => {
-    return <Menu hasDashboard={true} dense={false} />;
-};
-
-export const MenuDense = () => (
-    <Admin dataProvider={testDataProvider()} layout={StorybookLayoutDense}>
-        {resources.map((resource, index) => {
-            return (
-                <Resource
-                    name={resource}
-                    key={`resource_${index}`}
-                    list={<StorybookList name={resource} />}
-                />
-            );
-        })}
-    </Admin>
-);
-const StorybookLayoutDense = props => (
-    <Layout {...props} menu={StorybookMenuDense} appBar={StorybookAppBar} />
-);
-const StorybookMenuDense = () => {
-    return <Menu hasDashboard={true} dense={true} />;
-};
-
-const StorybookAppBar = props => {
+const DemoAppBar = props => {
     const darkTheme = createTheme({
         palette: { mode: 'dark' },
     });
@@ -61,9 +21,8 @@ const StorybookAppBar = props => {
             elevation={1}
             sx={{ flexDirection: 'row', flexWrap: 'nowrap' }}
         >
-            <SidebarToggleButton />
             <Box sx={{ flex: '1 1 100%' }}>
-                <Typography variant="h6" id="react-admin-title" />
+                <SidebarToggleButton />
             </Box>
             <Box sx={{ flex: '0 0 auto' }}>
                 <ToggleThemeButton
@@ -75,9 +34,55 @@ const StorybookAppBar = props => {
     );
 };
 
-const StorybookList = ({ name }) => (
+const DemoList = ({ name }) => (
     <>
         <Title title={name} />
         <Typography variant="h4">{name}</Typography>
     </>
 );
+
+export const Default = () => {
+    const DefaultLayout = props => (
+        <Layout {...props} menu={MenuDefault} appBar={DemoAppBar} />
+    );
+    const MenuDefault = () => {
+        return <Menu hasDashboard={true} dense={false} />;
+    };
+
+    return (
+        <Admin dataProvider={testDataProvider()} layout={DefaultLayout}>
+            {resources.map((resource, index) => {
+                return (
+                    <Resource
+                        name={resource}
+                        key={`resource_${index}`}
+                        list={<DemoList name={resource} />}
+                    />
+                );
+            })}
+        </Admin>
+    );
+};
+
+export const Dense = () => {
+    const LayoutDense = props => (
+        <Layout {...props} menu={MenuDense} appBar={DemoAppBar} />
+    );
+    const MenuDense = props => {
+        return <Menu {...props} hasDashboard={true} dense={true} />;
+    };
+
+    return (
+        <Admin dataProvider={testDataProvider()} layout={LayoutDense}>
+            {resources.map((resource, index) => {
+                return (
+                    <Resource
+                        name={resource}
+                        key={`resource_${index}`}
+                        list={<DemoList name={resource} />}
+                    />
+                );
+            })}
+        </Admin>
+    );
+};