Skip to content

[docs-infra] ApiPage component migration to mui-docs#48016

Draft
brijeshb42 wants to merge 53 commits intomui:masterfrom
brijeshb42:docs-apipage-migration
Draft

[docs-infra] ApiPage component migration to mui-docs#48016
brijeshb42 wants to merge 53 commits intomui:masterfrom
brijeshb42:docs-apipage-migration

Conversation

@brijeshb42
Copy link
Contributor

Create a configurable <DocsApp> component in @mui/docs/DocsApp that
encapsulates the common provider tree and boilerplate previously
duplicated between material-ui and mui-x _app files.

New module: packages/mui-docs/src/DocsApp/
- DocsApp.tsx: Configurable component rendering the full provider tree
  (DocsProvider → CodeCopyProvider → CodeStylingProvider →
  CodeVariantProvider → PageContext → DemoContext → ThemeWrapper →
  StyledEngineProvider → AnalyticsProvider → children + GoogleAnalytics).
  Accepts props for config, serviceWorkerPath, pageContextValue,
  demoContextValue, adConfig, ThemeWrapper, and onInit.
- createGetInitialProps.ts: Factory for MyApp.getInitialProps,
  parameterized by translationsContext (webpack require.context).
  Follows the same pattern as @mui/docs/Document's createGetInitialProps.
- reportWebVitals.ts: Shared reportWebVitals function.
- printConsoleBanner.ts: Exported function for the MUI ASCII banner.
- serviceWorker.ts: registerServiceWorker(swPath) parameterized by path.
- loadDependencies.ts: Material Icons CSS font loading via fg-loadcss.

Moved into DocsApp/ (only used by DocsApp, no external consumers):
- AnalyticsProvider.tsx (from src/AnalyticsProvider/)
- GoogleAnalytics.tsx (from src/GoogleAnalytics/)
- StyledEngineProvider.tsx (from src/StyledEngineProvider/)

Converted _app.js → _app.tsx and _document.js → _document.tsx in both
material-ui and mui-x docs, adding proper TypeScript annotations.

Type fixes in PageContext:
- Added productCategoryId to MuiPageContext interface (was passed at
  runtime but missing from the type).
- Relaxed ProductVersion to { text; current?; href? } to match actual
  usage (versions are either current or have an href link, not both
  required).

Added docs/types/webpack.d.ts declaring require.context() on
NodeJS.Require to support the TypeScript conversion.
@brijeshb42 brijeshb42 added the scope: docs-infra Involves the docs-infra product (https://www.notion.so/mui-org/b9f676062eb94747b6768209f7751305). label Mar 18, 2026
@mui-bot
Copy link

mui-bot commented Mar 18, 2026

Netlify deploy preview

https://deploy-preview-48016--material-ui.netlify.app/

Bundle size report

Bundle Parsed size Gzip size
@mui/material 0B(0.00%) 0B(0.00%)
@mui/lab 0B(0.00%) 0B(0.00%)
@mui/system 0B(0.00%) 0B(0.00%)
@mui/utils 0B(0.00%) 0B(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against 88a593e

@brijeshb42 brijeshb42 force-pushed the docs-apipage-migration branch from 872ef7b to 88a593e Compare March 18, 2026 06:54
@github-actions github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged. label Mar 18, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

PR: out-of-date The pull request has merge conflicts and can't be merged. scope: docs-infra Involves the docs-infra product (https://www.notion.so/mui-org/b9f676062eb94747b6768209f7751305).

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants