From 7a671bdd6b32f2b9b1cd438f8a10b1dc682d5f8b Mon Sep 17 00:00:00 2001
From: alexandre <alex.fauquette@gmail.com>
Date: Thu, 15 Feb 2024 09:38:24 +0100
Subject: [PATCH 1/3] [docs-infra] New way of providing API layout config

---
 .../ApiBuilders/ComponentApiBuilder.ts                 | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts b/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts
index a0921b4325c1ed..a41897914c20d1 100644
--- a/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts
+++ b/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts
@@ -360,6 +360,7 @@ const generateApiPage = async (
   reactApi: ReactApi,
   sortingStrategies?: SortingStrategiesType,
   onlyJsonFile: boolean = false,
+  layoutConfigPath: string = '',
 ) => {
   const normalizedApiPathname = reactApi.apiPathname.replace(/\\/g, '/');
   /**
@@ -424,10 +425,15 @@ const generateApiPage = async (
   import ApiPage from 'docs/src/modules/components/ApiPage';
   import mapApiPageTranslations from 'docs/src/modules/utils/mapApiPageTranslations';
   import jsonPageContent from './${kebabCase(reactApi.name)}.json';
-
+${
+  layoutConfigPath === ''
+    ? ''
+    : `  import layoutConfig from '${layoutConfigPath}';
+`
+}
   export default function Page(props) {
     const { descriptions, pageContent } = props;
-    return <ApiPage descriptions={descriptions} pageContent={pageContent} />;
+    return <ApiPage ${layoutConfigPath === '' ? '' : '{...layoutConfig} '}descriptions={descriptions} pageContent={pageContent} />;
   }
 
   Page.getInitialProps = () => {

From 0944e2788c23b480824652aafdff092e0c9587f9 Mon Sep 17 00:00:00 2001
From: alexandre <alex.fauquette@gmail.com>
Date: Thu, 15 Feb 2024 09:47:51 +0100
Subject: [PATCH 2/3] pass props

---
 packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts | 1 +
 packages/api-docs-builder/buildApiUtils.ts                   | 4 ++++
 2 files changed, 5 insertions(+)

diff --git a/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts b/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts
index a41897914c20d1..b3ba1c0006f5da 100644
--- a/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts
+++ b/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts
@@ -808,6 +808,7 @@ export default async function generateComponentApi(
       reactApi,
       projectSettings.sortingStrategies,
       generateJsonFileOnly,
+      componentInfo.layoutConfigPath,
     );
 
     if (
diff --git a/packages/api-docs-builder/buildApiUtils.ts b/packages/api-docs-builder/buildApiUtils.ts
index 1ef45d3484ca66..a62c632111ae4a 100644
--- a/packages/api-docs-builder/buildApiUtils.ts
+++ b/packages/api-docs-builder/buildApiUtils.ts
@@ -142,6 +142,10 @@ export type ComponentInfo = {
   };
   getDemos: () => Array<{ demoPageTitle: string; demoPathname: string }>;
   apiPagesDirectory: string;
+  /**
+   * The path to import specific layout config of the page if needed.
+   */
+  layoutConfigPath?: string;
   skipApiGeneration?: boolean;
   /**
    * If `true`, the component's name match one of the MUI System components.

From aa46984694d4d799eb032ad96d7a58c5b70f4acf Mon Sep 17 00:00:00 2001
From: alexandre <alex.fauquette@gmail.com>
Date: Thu, 15 Feb 2024 09:53:00 +0100
Subject: [PATCH 3/3] move import order

---
 .../ApiBuilders/ComponentApiBuilder.ts             | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts b/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts
index b3ba1c0006f5da..ebe0d2e8374a07 100644
--- a/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts
+++ b/packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts
@@ -423,14 +423,14 @@ const generateApiPage = async (
       path.resolve(apiPagesDirectory, `${kebabCase(reactApi.name)}.js`),
       `import * as React from 'react';
   import ApiPage from 'docs/src/modules/components/ApiPage';
-  import mapApiPageTranslations from 'docs/src/modules/utils/mapApiPageTranslations';
+  import mapApiPageTranslations from 'docs/src/modules/utils/mapApiPageTranslations';${
+    layoutConfigPath === ''
+      ? ''
+      : `
+  import layoutConfig from '${layoutConfigPath}';`
+  }
   import jsonPageContent from './${kebabCase(reactApi.name)}.json';
-${
-  layoutConfigPath === ''
-    ? ''
-    : `  import layoutConfig from '${layoutConfigPath}';
-`
-}
+
   export default function Page(props) {
     const { descriptions, pageContent } = props;
     return <ApiPage ${layoutConfigPath === '' ? '' : '{...layoutConfig} '}descriptions={descriptions} pageContent={pageContent} />;