move default definition

mui · Feb 6, 2024 · f5f1a19 · f5f1a19
1 parent 59f1c27
commit f5f1a19
Show file tree

Hide file tree

Showing 7 changed files with 29 additions and 33 deletions.
diff --git a/docs/src/modules/components/ApiPage.js b/docs/src/modules/components/ApiPage.js
@@ -21,6 +21,7 @@ import ClassesSection, {
   getClassesToC,
 } from 'docs/src/modules/components/ApiPage/sections/ClassesSection';
 import SlotsSection from 'docs/src/modules/components/ApiPage/sections/SlotsSection';
+import { DEFAULT_API_LAYOUT_STORAGE_KEYS } from 'docs/src/modules/components/ApiPage/sections/ToggleDisplayOption';
 
 export function getTranslatedHeader(t, header) {
   const translations = {
@@ -73,7 +74,7 @@ export default function ApiPage(props) {
     disableAd = false,
     pageContent,
     defaultLayout = 'table',
-    layoutStorageKey,
+    layoutStorageKey = DEFAULT_API_LAYOUT_STORAGE_KEYS,
   } = props;
   const t = useTranslate();
   const userLanguage = useUserLanguage();
@@ -264,7 +265,7 @@ export default function ApiPage(props) {
           componentName={pageContent.name}
           spreadHint={spreadHint}
           defaultLayout={defaultLayout}
-          layoutStorageKey={layoutStorageKey?.props}
+          layoutStorageKey={layoutStorageKey.props}
         />
         {cssComponent && (
           <React.Fragment>
@@ -323,7 +324,7 @@ export default function ApiPage(props) {
             t('api-docs.slotDescription').replace(/{{slotGuideLink}}/, slotGuideLink)
           }
           defaultLayout={defaultLayout}
-          layoutStorageKey={layoutStorageKey?.slots}
+          layoutStorageKey={layoutStorageKey.slots}
         />
         <ClassesSection
           componentClasses={componentClasses}
@@ -332,7 +333,7 @@ export default function ApiPage(props) {
           spreadHint={t('api-docs.classesDescription')}
           styleOverridesLink={styleOverridesLink}
           defaultLayout={defaultLayout}
-          layoutStorageKey={layoutStorageKey?.classes}
+          layoutStorageKey={layoutStorageKey.classes}
           displayClassKeys
         />
       </MarkdownElement>

diff --git a/docs/src/modules/components/ApiPage/sections/ClassesSection.tsx b/docs/src/modules/components/ApiPage/sections/ClassesSection.tsx
@@ -4,7 +4,6 @@ import { useTranslate } from 'docs/src/modules/utils/i18n';
 import { ComponentClassDefinition } from '@mui-internal/docs-utilities';
 import Box from '@mui/material/Box';
 import ToggleDisplayOption, {
-  API_LAYOUT_STORAGE_KEYS,
   ApiDisplayOptions,
   useApiPageOption,
 } from 'docs/src/modules/components/ApiPage/sections/ToggleDisplayOption';
@@ -51,7 +50,7 @@ export type ClassesSectionProps = {
   titleHash: string;
   level?: 'h2' | 'h3' | 'h4';
   defaultLayout: ApiDisplayOptions;
-  layoutStorageKey?: string;
+  layoutStorageKey: string;
   displayClassKeys: boolean;
   styleOverridesLink: string;
 };
@@ -68,7 +67,7 @@ export default function ClassesSection(props: ClassesSectionProps) {
     displayClassKeys,
     styleOverridesLink,
     defaultLayout,
-    layoutStorageKey = API_LAYOUT_STORAGE_KEYS.classes,
+    layoutStorageKey,
   } = props;
   const t = useTranslate();
 

diff --git a/docs/src/modules/components/ApiPage/sections/PropertiesSection.js b/docs/src/modules/components/ApiPage/sections/PropertiesSection.js
@@ -4,7 +4,6 @@ import PropTypes from 'prop-types';
 import Box from '@mui/material/Box';
 import { useTranslate } from 'docs/src/modules/utils/i18n';
 import ToggleDisplayOption, {
-  API_LAYOUT_STORAGE_KEYS,
   useApiPageOption,
 } from 'docs/src/modules/components/ApiPage/sections/ToggleDisplayOption';
 import PropertiesList, { getHash } from 'docs/src/modules/components/ApiPage/list/PropertiesList';
@@ -52,7 +51,7 @@ export default function PropertiesSection(props) {
     hooksParameters = false,
     hooksReturnValue = false,
     defaultLayout,
-    layoutStorageKey = API_LAYOUT_STORAGE_KEYS.props,
+    layoutStorageKey,
   } = props;
   const t = useTranslate();
 
@@ -154,7 +153,7 @@ PropertiesSection.propTypes = {
   defaultLayout: PropTypes.oneOf(['collapsed', 'expanded', 'table']).isRequired,
   hooksParameters: PropTypes.bool,
   hooksReturnValue: PropTypes.bool,
-  layoutStorageKey: PropTypes.string,
+  layoutStorageKey: PropTypes.string.isRequired,
   level: PropTypes.string,
   properties: PropTypes.object.isRequired,
   propertiesDescriptions: PropTypes.object.isRequired,

diff --git a/docs/src/modules/components/ApiPage/sections/SlotsSection.tsx b/docs/src/modules/components/ApiPage/sections/SlotsSection.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 import Box from '@mui/material/Box';
 import { useTranslate } from 'docs/src/modules/utils/i18n';
 import ToggleDisplayOption, {
-  API_LAYOUT_STORAGE_KEYS,
   ApiDisplayOptions,
   useApiPageOption,
 } from 'docs/src/modules/components/ApiPage/sections/ToggleDisplayOption';
@@ -18,7 +17,7 @@ export type SlotsSectionProps = {
   titleHash?: string;
   level?: 'h2' | 'h3' | 'h4';
   defaultLayout: ApiDisplayOptions;
-  layoutStorageKey?: string;
+  layoutStorageKey: string;
   spreadHint?: string;
 };
 
@@ -32,7 +31,7 @@ export default function SlotsSection(props: SlotsSectionProps) {
     level: Level = 'h2',
     spreadHint,
     defaultLayout,
-    layoutStorageKey = API_LAYOUT_STORAGE_KEYS.slots,
+    layoutStorageKey,
   } = props;
   const t = useTranslate();
 

diff --git a/docs/src/modules/components/ApiPage/sections/ToggleDisplayOption.tsx b/docs/src/modules/components/ApiPage/sections/ToggleDisplayOption.tsx
@@ -11,7 +11,7 @@ export type ApiDisplayOptions = 'collapsed' | 'expanded' | 'table';
 
 const options: ApiDisplayOptions[] = ['collapsed', 'expanded', 'table'];
 
-export const API_LAYOUT_STORAGE_KEYS = {
+export const DEFAULT_API_LAYOUT_STORAGE_KEYS = {
   slots: 'apiPage_slots',
   props: 'apiPage_props',
   classes: 'apiPage_classes',
@@ -71,20 +71,6 @@ export function useApiPageOption(
   return [option, updateOption];
 }
 
-export function getApiPageLayout() {
-  const rep: { [key: string]: string } = {};
-
-  Object.values(API_LAYOUT_STORAGE_KEYS).forEach((localStorageKey) => {
-    try {
-      const savedOption = localStorage.getItem(localStorageKey);
-      rep[localStorageKey] = savedOption || 'none';
-    } catch {
-      rep[localStorageKey] = 'none';
-    }
-  });
-  return rep;
-}
-
 // Fix Toggle buton highlight (taken from /~https://github.com/mui/material-ui/issues/18091)
 type TooltipToggleButtonProps = ToggleButtonProps & {
   /**

diff --git a/docs/src/modules/components/ComponentsApiContent.js b/docs/src/modules/components/ComponentsApiContent.js
@@ -10,6 +10,7 @@ import MarkdownElement from 'docs/src/modules/components/MarkdownElement';
 import PropertiesSection from 'docs/src/modules/components/ApiPage/sections/PropertiesSection';
 import ClassesSection from 'docs/src/modules/components/ApiPage/sections/ClassesSection';
 import SlotsSection from 'docs/src/modules/components/ApiPage/sections/SlotsSection';
+import { DEFAULT_API_LAYOUT_STORAGE_KEYS } from 'docs/src/modules/components/ApiPage/sections/ToggleDisplayOption';
 
 function getTranslatedHeader(t, header, text) {
   const translations = {
@@ -49,7 +50,12 @@ Heading.propTypes = {
 };
 
 export default function ComponentsApiContent(props) {
-  const { descriptions, pageContents, defaultLayout = 'table', layoutStorageKey } = props;
+  const {
+    descriptions,
+    pageContents,
+    defaultLayout = 'table',
+    layoutStorageKey = DEFAULT_API_LAYOUT_STORAGE_KEYS,
+  } = props;
   const t = useTranslate();
   const userLanguage = useUserLanguage();
   const router = useRouter();
@@ -151,7 +157,7 @@ export default function ComponentsApiContent(props) {
             level="h3"
             titleHash={`${componentNameKebabCase}-props`}
             defaultLayout={defaultLayout}
-            layoutStorageKey={layoutStorageKey?.props}
+            layoutStorageKey={layoutStorageKey.props}
           />
           <br />
           {cssComponent && (
@@ -219,7 +225,7 @@ export default function ComponentsApiContent(props) {
               t('api-docs.slotDescription').replace(/{{slotGuideLink}}/, slotGuideLink)
             }
             defaultLayout={defaultLayout}
-            layoutStorageKey={layoutStorageKey?.slots}
+            layoutStorageKey={layoutStorageKey.slots}
           />
           <ClassesSection
             componentClasses={componentClasses}
@@ -229,7 +235,7 @@ export default function ComponentsApiContent(props) {
             titleHash={`${componentNameKebabCase}-classes`}
             level="h3"
             defaultLayout={defaultLayout}
-            layoutStorageKey={layoutStorageKey?.classes}
+            layoutStorageKey={layoutStorageKey.classes}
           />
         </MarkdownElement>
         <svg style={{ display: 'none' }} xmlns="http://www.w3.org/2000/svg">

diff --git a/docs/src/modules/components/HooksApiContent.js b/docs/src/modules/components/HooksApiContent.js
@@ -7,6 +7,7 @@ import { useTranslate, useUserLanguage } from 'docs/src/modules/utils/i18n';
 import PropertiesSection from 'docs/src/modules/components/ApiPage/sections/PropertiesSection';
 import HighlightedCode from 'docs/src/modules/components/HighlightedCode';
 import MarkdownElement from 'docs/src/modules/components/MarkdownElement';
+import { DEFAULT_API_LAYOUT_STORAGE_KEYS } from 'docs/src/modules/components/ApiPage/sections/ToggleDisplayOption';
 
 function getTranslatedHeader(t, header, text) {
   const translations = {
@@ -43,7 +44,12 @@ Heading.propTypes = {
 };
 
 export default function HooksApiContent(props) {
-  const { descriptions, pagesContents, defaultLayout = 'table', layoutStorageKey } = props;
+  const {
+    descriptions,
+    pagesContents,
+    defaultLayout = 'table',
+    layoutStorageKey = DEFAULT_API_LAYOUT_STORAGE_KEYS,
+  } = props;
   const userLanguage = useUserLanguage();
   const t = useTranslate();