[docs] Prepare scripts for migrating to new structure

docs/data/base/pages.ts

@@ -0,0 +1,12 @@
+import pagesApi from './pagesApi';
+
+const pages = [
+  {
+    title: 'Component API',
+    pathname: '/base/api',
+    icon: 'CodeIcon',
+    children: pagesApi,
+  },
+];
+
+export default pages;

docs/data/base/pagesApi.js

@@ -0,0 +1 @@
+module.exports = [];

docs/data/material/pages.ts

@@ -0,0 +1,240 @@
+import pagesApi from './pagesApi';
+
+const pages = [
+  {
+    pathname: '/material/getting-started',
+    icon: 'DescriptionIcon',
+    children: [
+      { pathname: '/material/getting-started/installation' },
+      { pathname: '/material/getting-started/usage' },
+      { pathname: '/material/getting-started/example-projects' },
+      { pathname: '/material/getting-started/templates' },
+      { pathname: '/material/getting-started/learn' },
+      { pathname: '/material/getting-started/faq', title: 'FAQs' },
+      { pathname: '/material/getting-started/supported-components' },
+      { pathname: '/material/getting-started/supported-platforms' },
+      { pathname: '/material/getting-started/support' },
+    ],
+  },
+  {
+    pathname: '/material/react-',
+    title: 'Components',
+    icon: 'ToggleOnIcon',
+    children: [
+      {
+        pathname: '/material/components/inputs',
+        subheader: 'inputs',
+        children: [
+          { pathname: '/material/react-autocomplete' },
+          { pathname: '/material/react-buttons', title: 'Button' },
+          { pathname: '/material/react-button-group' },
+          { pathname: '/material/react-checkboxes', title: 'Checkbox' },
+          { pathname: '/material/react-floating-action-button' },
+          { pathname: '/material/react-radio-buttons', title: 'Radio button' },
+          { pathname: '/material/react-rating' },
+          { pathname: '/material/react-selects', title: 'Select' },
+          { pathname: '/material/react-slider' },
+          { pathname: '/material/react-switches', title: 'Switch' },
+          { pathname: '/material/react-text-fields', title: 'Text field' },
+          { pathname: '/material/react-transfer-list' },
+          { pathname: '/material/react-toggle-button' },
+        ],
+      },
+      {
+        pathname: '/material/components/data-display',
+        subheader: 'data-display',
+        children: [
+          { pathname: '/material/react-avatars', title: 'Avatar' },
+          { pathname: '/material/react-badges', title: 'Badge' },
+          { pathname: '/material/react-chips', title: 'Chip' },
+          { pathname: '/material/react-dividers', title: 'Divider' },
+          { pathname: '/material/react-icons' },
+          { pathname: '/material/react-material-icons' },
+          { pathname: '/material/react-lists', title: 'List' },
+          { pathname: '/material/react-tables', title: 'Table' },
+          { pathname: '/material/react-tooltips', title: 'Tooltip' },
+          { pathname: '/material/react-typography' },
+        ],
+      },
+      {
+        pathname: '/material/components/feedback',
+        subheader: 'feedback',
+        children: [
+          { pathname: '/material/react-alert' },
+          { pathname: '/material/react-backdrop' },
+          { pathname: '/material/react-dialogs' },
+          { pathname: '/material/react-progress' },
+          { pathname: '/material/react-skeleton' },
+          { pathname: '/material/react-snackbars', title: 'Snackbar' },
+        ],
+      },
+      {
+        pathname: '/material/components/surfaces',
+        subheader: 'surfaces',
+        children: [
+          { pathname: '/material/react-accordion' },
+          { pathname: '/material/react-app-bar' },
+          { pathname: '/material/react-cards', title: 'Card' },
+          { pathname: '/material/react-paper' },
+        ],
+      },
+      {
+        pathname: '/material/components/navigation',
+        subheader: 'navigation',
+        children: [
+          { pathname: '/material/react-bottom-navigation' },
+          { pathname: '/material/react-breadcrumbs' },
+          { pathname: '/material/react-drawers', title: 'Drawer' },
+          { pathname: '/material/react-links', title: 'Link' },
+          { pathname: '/material/react-menus', title: 'Menu' },
+          { pathname: '/material/react-pagination' },
+          { pathname: '/material/react-speed-dial' },
+          { pathname: '/material/react-steppers', title: 'Stepper' },
+          { pathname: '/material/react-tabs' },
+        ],
+      },
+      {
+        pathname: '/material/components/layout',
+        subheader: 'layout',
+        children: [
+          { pathname: '/material/react-box' },
+          { pathname: '/material/react-container' },
+          { pathname: '/material/react-grid' },
+          { pathname: '/material/react-stack' },
+          { pathname: '/material/react-image-list' },
+          { pathname: '/material/react-hidden' },
+        ],
+      },
+      {
+        pathname: '/material/components/utils',
+        subheader: 'utils',
+        children: [
+          { pathname: '/material/react-click-away-listener' },
+          { pathname: '/material/react-css-baseline', title: 'CSS Baseline' },
+          { pathname: '/material/react-modal' },
+          { pathname: '/material/react-no-ssr', title: 'No SSR' },
+          { pathname: '/material/react-popover' },
+          { pathname: '/material/react-popper' },
+          { pathname: '/material/react-portal' },
+          { pathname: '/material/react-textarea-autosize' },
+          { pathname: '/material/react-transitions' },
+          { pathname: '/material/react-use-media-query', title: 'useMediaQuery' },
+        ],
+      },
+      {
+        pathname: '/x/data-grid',
+        subheader: 'data-grid',
+      },
+      {
+        pathname: '/material',
+        subheader: 'lab',
+        children: [
+          { pathname: '/material/about-the-lab', title: 'About the lab 🧪' },
+          {
+            pathname: '/material/lab/pickers',
+            subheader: 'pickers',
+            title: 'Date / Time',
+            children: [
+              { pathname: '/material/react-pickers', title: 'Introduction' },
+              { pathname: '/material/react-date-picker' },
+              {
+                pathname: '/material/react-date-range-picker',
+                title: 'Date Range Picker ⚡️',
+              },
+              { pathname: '/material/react-date-time-picker' },
+              { pathname: '/material/react-time-picker' },
+            ],
+          },
+          { pathname: '/material/react-masonry' },
+          { pathname: '/material/react-timeline' },
+          { pathname: '/material/react-trap-focus' },
+          { pathname: '/material/react-tree-view' },
+        ],
+      },
+    ],
+  },
+  {
+    title: 'Component API',
+    pathname: '/material/api',
+    icon: 'CodeIcon',
+    children: [
+      ...pagesApi,
+      {
+        pathname: '/x/api/mui-data-grid',
+        title: 'Data Grid',
+      },
+    ],
+  },
+  {
+    pathname: '/material/customization',
+    icon: 'CreateIcon',
+    children: [
+      {
+        pathname: '/material/customization',
+        subheader: '/material/customization/theme',
+        children: [
+          { pathname: '/material/customization/theming' },
+          { pathname: '/material/customization/palette' },
+          { pathname: '/material/customization/dark-mode', title: 'Dark mode' },
+          { pathname: '/material/customization/typography' },
+          { pathname: '/material/customization/spacing' },
+          { pathname: '/material/customization/breakpoints' },
+          { pathname: '/material/customization/density' },
+          { pathname: '/material/customization/z-index', title: 'z-index' },
+          { pathname: '/material/customization/transitions' },
+          { pathname: '/material/customization/theme-components', title: 'Components' },
+          { pathname: '/material/customization/default-theme', title: 'Default Theme' },
+        ],
+      },
+      { pathname: '/material/customization/how-to-customize' },
+      { pathname: '/material/customization/color' },
+      { pathname: '/material/customization/unstyled-components' },
+    ],
+  },
+  {
+    pathname: '/material/guides',
+    title: 'How To Guides',
+    icon: 'VisibilityIcon',
+    children: [
+      { pathname: '/material/guides/api', title: 'API Design Approach' },
+      { pathname: '/material/guides/classname-generator', title: 'ClassName Generator' },
+      { pathname: '/material/guides/understand-mui-packages', title: 'Understand MUI packages' },
+      { pathname: '/material/guides/typescript', title: 'TypeScript' },
+      { pathname: '/material/guides/interoperability', title: 'Style Library Interoperability' },
+      { pathname: '/material/guides/styled-engine' },
+      { pathname: '/material/guides/minimizing-bundle-size' },
+      { pathname: '/material/guides/composition' },
+      { pathname: '/material/guides/routing' },
+      { pathname: '/material/guides/server-rendering' },
+      { pathname: '/material/guides/responsive-ui', title: 'Responsive UI' },
+      {
+        pathname: '/material/guides/pickers-migration',
+        title: 'Migration from @material-ui/pickers',
+      },
+      { pathname: '/material/guides/migration-v4', title: 'Migration From v4' },
+      { pathname: '/material/guides/migration-v3', title: 'Migration From v3' },
+      { pathname: '/material/guides/migration-v0x', title: 'Migration From v0.x' },
+      { pathname: '/material/guides/testing' },
+      { pathname: '/material/guides/localization' },
+      { pathname: '/material/guides/content-security-policy', title: 'Content Security Policy' },
+      { pathname: '/material/guides/right-to-left', title: 'Right-to-left' },
+      { pathname: '/material/guides/flow' },
+    ],
+  },
+  {
+    pathname: '/material/discover-more',
+    icon: 'AddIcon',
+    children: [
+      { pathname: '/material/discover-more/showcase' },
+      { pathname: '/material/discover-more/related-projects' },
+      { pathname: '/material/discover-more/roadmap' },
+      { pathname: '/material/discover-more/backers', title: 'Sponsors & Backers' },
+      { pathname: '/material/discover-more/vision' },
+      { pathname: '/material/discover-more/changelog' },
+      { pathname: '/material/discover-more/languages' },
+      { pathname: '/about', title: 'About us' },
+    ],
+  },
+];
+
+export default pages;

docs/data/material/pagesApi.js

@@ -0,0 +1 @@
+module.exports = [];

docs/data/styles/pages.ts

@@ -0,0 +1,14 @@
+const pages = [
+  {
+    pathname: '/styles',
+    title: 'Styles (legacy)',
+    icon: 'StyleIcon',
+    children: [
+      { pathname: '/styles/basics' },
+      { pathname: '/styles/advanced' },
+      { pathname: '/styles/api', title: 'API' },
+    ],
+  },
+];
+
+export default pages;

docs/data/system/pages.ts

@@ -0,0 +1,27 @@
+const pages = [
+  {
+    pathname: '/system',
+    icon: 'BuildIcon',
+    children: [
+      { pathname: '/system/basics' },
+      { pathname: '/system/properties' },
+      { pathname: '/system/the-sx-prop', title: 'The sx prop' },
+      { pathname: '/system/borders' },
+      { pathname: '/system/display' },
+      { pathname: '/system/flexbox' },
+      { pathname: '/system/grid' },
+      { pathname: '/system/palette' },
+      { pathname: '/system/positions' },
+      { pathname: '/system/shadows' },
+      { pathname: '/system/sizing' },
+      { pathname: '/system/spacing' },
+      { pathname: '/system/screen-readers' },
+      { pathname: '/system/typography' },
+      { pathname: '/system/advanced' },
+      { pathname: '/system/box' },
+      { pathname: '/system/styled', title: 'styled' },
+    ],
+  },
+];
+
+export default pages;

docs/next.config.js

@@ -3,6 +3,7 @@ const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
 const pkg = require('../package.json');
 const { findPages } = require('./src/modules/utils/find');
 const { LANGUAGES, LANGUAGES_SSR } = require('./src/modules/constants');
+const FEATURE_TOGGLE = require('./src/featureToggle');
 
 const workspaceRoot = path.join(__dirname, '../');
 
@@ -226,6 +227,65 @@ module.exports = {
       { source: '/api/:rest*/', destination: '/api-docs/:rest*/' },
     ];
   },
+  async redirects() {
+    if (FEATURE_TOGGLE.enable_redirects) {
+      return [
+        {
+          source: '/getting-started/:path*',
+          destination: '/material/getting-started/:path*',
+          permanent: false,
+        },
+        {
+          source: '/customization/:path*',
+          destination: '/material/customization/:path*',
+          permanent: false,
+        },
+        {
+          source: '/guides/:path*',
+          destination: '/material/guides/:path*',
+          permanent: false,
+        },
+        {
+          source: '/discover-more/:path*',
+          destination: '/material/discover-more/:path*',
+          permanent: false,
+        },
+        {
+          source: '/components/about-the-lab',
+          destination: '/material/about-the-lab',
+          permanent: false,
+        },
+        {
+          source: '/components/data-grid/:path*',
+          destination: '/x/react-data-grid/:path*',
+          permanent: false,
+        },
+        {
+          source: '/components/:path*',
+          destination: '/material/react-:path*',
+          permanent: false,
+        },
+        {
+          source: '/api/data-grid/:path*',
+          destination: '/x/api/mui-data-grid/:path*',
+          permanent: false,
+        },
+        {
+          source:
+            // if this regex change, make sure to update `replaceMarkdownLinks`
+            '/api/:path(loading-button|tab-list|tab-panel|date-picker|date-time-picker|time-picker|calendar-picker|calendar-picker-skeleton|desktop-picker|mobile-date-picker|month-picker|pickers-day|static-date-picker|year-picker|masonry|timeline|timeline-connector|timeline-content|timeline-dot|timeline-item|timeline-opposite-content|timeline-separator|unstable-trap-focus|tree-item|tree-view)',
+          destination: '/material/api/mui-lab/:path*',
+          permanent: false,
+        },
+        {
+          source: '/api/:path*',
+          destination: '/material/api/mui-material/:path*',
+          permanent: false,
+        },
+      ];
+    }
+    return [];
+  },
   // Can be turned on when https://github.com/vercel/next.js/issues/24640 is fixed
   optimizeFonts: false,
 };