Sebastian's review

docs/src/modules/utils/getDemoConfig.js

@@ -79,7 +79,7 @@ function getLanguageConfig(demoData) {
   }
 }
 
-export default function getDemo(demoData) {
+export default function getDemoConfig(demoData) {
   const baseConfig = {
     title: demoData.title,
     description: demoData.githubLocation,

docs/src/modules/utils/helpers.js

@@ -85,29 +85,23 @@ function addTypeDeps(deps) {
 }
 
 function includePeerDependencies(deps, versions) {
-  Object.assign(deps, {
+  let newDeps = {
+    ...deps,
     'react-dom': versions['react-dom'],
     react: versions.react,
     '@emotion/react': versions['@emotion/react'],
     '@emotion/styled': versions['@emotion/styled'],
-  });
+  };
 
-  if (
-    deps['@material-ui/lab'] ||
-    deps['@material-ui/x'] ||
-    deps['@material-ui/x-grid'] ||
-    deps['@material-ui/x-pickers'] ||
-    deps['@material-ui/x-tree-view'] ||
-    deps['@material-ui/data-grid']
-  ) {
-    deps['@material-ui/core'] = versions['@material-ui/core'];
+  if (newDeps['@material-ui/lab']) {
+    newDeps['@material-ui/core'] = versions['@material-ui/core'];
   }
 
-  if (deps['@material-ui/x-grid-data-generator']) {
-    deps['@material-ui/core'] = versions['@material-ui/core'];
-    deps['@material-ui/icons'] = versions['@material-ui/icons'];
-    deps['@material-ui/lab'] = versions['@material-ui/lab'];
+  if (window.muiDocConfig) {
+    newDeps = window.muiDocConfig.csbIncludePeerDependencies(newDeps, { versions });
   }
+
+  return newDeps;
 }
 
 /**
@@ -124,34 +118,20 @@ function getMuiPackageVersion(packageName, commitRef) {
   return `https://pkg.csb.dev/mui-org/material-ui/commit/${shortSha}/@material-ui/${packageName}`;
 }
 
-/**
- * @param {string} packageName - The name of a package living inside this repository.
- * @param {string} [commitRef]
- * @return string - A valid version for a dependency entry in a package.json
- */
-function getMuiXPackageVersion(packageName, commitRef) {
-  if (commitRef === undefined || SOURCE_CODE_REPO !== 'https://github.com/mui-org/material-ui-x') {
-    return 'latest';
-  }
-  const shortSha = commitRef.slice(0, 8);
-  return `https://pkg.csb.dev/mui-org/material-ui-x/commit/${shortSha}/@material-ui/${packageName}`;
-}
-
 /**
  * @param {string} raw - ES6 source with es module imports
  * @param {object} options
  * @param {'JS' | 'TS'} [options.codeLanguage] -
  * @param {string} [options.muiCommitRef] - If specified use `@material-ui/*` packages from a specific commit.
- * @param {'next' | 'latest'} [options.reactVersion]
  * @returns {Record<string, 'latest'>} map of packages with their required version
  */
 function getDependencies(raw, options = {}) {
-  const { codeLanguage = CODE_VARIANTS.JS, muiCommitRef, reactVersion = 'latest' } = options;
+  const { codeLanguage = CODE_VARIANTS.JS, muiCommitRef } = options;
 
-  const deps = {};
-  const versions = {
-    react: reactVersion,
-    'react-dom': reactVersion,
+  let deps = {};
+  let versions = {
+    react: 'latest',
+    'react-dom': 'latest',
     '@emotion/react': 'latest',
     '@emotion/styled': 'latest',
     '@material-ui/core': getMuiPackageVersion('core', muiCommitRef),
@@ -163,15 +143,12 @@ function getDependencies(raw, options = {}) {
     '@material-ui/system': getMuiPackageVersion('system', muiCommitRef),
     '@material-ui/unstyled': getMuiPackageVersion('unstyled', muiCommitRef),
     '@material-ui/utils': getMuiPackageVersion('utils', muiCommitRef),
-    '@material-ui/data-grid': getMuiXPackageVersion('data-grid', muiCommitRef),
-    '@material-ui/x-grid': getMuiXPackageVersion('x-grid', muiCommitRef),
-    '@material-ui/x-license': getMuiXPackageVersion('x-license', muiCommitRef),
-    '@material-ui/x-grid-data-generator': getMuiXPackageVersion(
-      'x-grid-data-generator',
-      muiCommitRef,
-    ),
   };
 
+  if (window.muiDocConfig) {
+    versions = window.muiDocConfig.csbGetVersions(versions, { muiCommitRef });
+  }
+
   const re = /^import\s'([^']+)'|import\s[\s\S]*?\sfrom\s+'([^']+)/gm;
   let m;
   // eslint-disable-next-line no-cond-assign
@@ -203,7 +180,7 @@ function getDependencies(raw, options = {}) {
     }
   }
 
-  includePeerDependencies(deps, versions);
+  deps = includePeerDependencies(deps, versions);
 
   if (codeLanguage === CODE_VARIANTS.TS) {
     addTypeDeps(deps);

docs/src/modules/utils/helpers.test.js

@@ -62,19 +62,6 @@ const suggestions = [
     });
   });
 
-  it('should support next dependencies', () => {
-    expect(getDependencies(s1, { reactVersion: 'next' })).to.deep.equal({
-      react: 'next',
-      'react-dom': 'next',
-      '@emotion/react': 'latest',
-      '@emotion/styled': 'latest',
-      '@foo-bar/bip': 'latest',
-      '@material-ui/core': 'next',
-      '@material-ui/unstyled': 'next',
-      'prop-types': 'latest',
-    });
-  });
-
   it('should support direct import', () => {
     const source = `
 import * as React from 'react';
@@ -152,29 +139,6 @@ import lab from '@material-ui/lab';
     });
   });
 
-  it('should support the data-grid component', () => {
-    const source = `
-import * as React from 'react';
-import { DataGrid } from '@material-ui/data-grid';
-import { useDemoData } from '@material-ui/x-grid-data-generator';
-    `;
-
-    expect(getDependencies(source, { codeLanguage: 'TS' })).to.deep.equal({
-      react: 'latest',
-      'react-dom': 'latest',
-      '@emotion/react': 'latest',
-      '@emotion/styled': 'latest',
-      '@material-ui/core': 'next',
-      '@material-ui/lab': 'next',
-      '@material-ui/icons': 'next',
-      '@material-ui/data-grid': 'latest',
-      '@material-ui/x-grid-data-generator': 'latest',
-      '@types/react': 'latest',
-      '@types/react-dom': 'latest',
-      typescript: 'latest',
-    });
-  });
-
   it('can use codesandbox deploys if a commit is given', () => {
     const source = `
 import * as Core from '@material-ui/core';