[docs] Allow codesandbox deploy for demos in X (mui#23644)

oliviertassinari · oliviertassinari · commit 34be88ec011d · 2020-12-04T16:19:17.000+01:00
diff --git a/docs/src/modules/utils/getDemoConfig.js b/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: 'Material demo',
     description: demoData.githubLocation,
diff --git a/docs/src/modules/utils/helpers.js b/docs/src/modules/utils/helpers.js
@@ -1,6 +1,6 @@
 const upperFirst = require('lodash/upperFirst');
 const camelCase = require('lodash/camelCase');
-const { CODE_VARIANTS, LANGUAGES } = require('../constants');
+const { CODE_VARIANTS, SOURCE_CODE_REPO, LANGUAGES } = require('../constants');
 
 function titleize(string) {
   if (process.env.NODE_ENV !== 'production') {
@@ -75,32 +75,26 @@ function addTypeDeps(deps) {
 }
 
 function includePeerDependencies(deps, versions) {
-  Object.assign(deps, {
+  let newDeps = {
+    ...deps,
     'react-dom': versions['react-dom'],
     react: versions.react,
-  });
+  };
 
-  if (
-    deps['@material-ui/lab'] ||
-    deps['@material-ui/pickers'] ||
-    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 });
   }
 
-  if (deps['@material-ui/pickers']) {
-    deps['date-fns'] = 'latest';
+  if (newDeps['@material-ui/pickers']) {
+    newDeps['date-fns'] = 'latest';
+    newDeps['@material-ui/core'] = versions['@material-ui/core'];
   }
+
+  return newDeps;
 }
 
 /**
@@ -109,7 +103,7 @@ function includePeerDependencies(deps, versions) {
  * @return string - A valid version for a dependency entry in a package.json
  */
 function getMuiPackageVersion(packageName, commitRef) {
-  if (commitRef === undefined) {
+  if (commitRef === undefined || SOURCE_CODE_REPO !== 'https://github.com/mui-org/material-ui') {
     // TODO: change 'next' to 'latest' once next is merged into master.
     return 'latest';
   }
@@ -122,16 +116,15 @@ function getMuiPackageVersion(packageName, commitRef) {
  * @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-dom': reactVersion,
-    react: reactVersion,
+  let deps = {};
+  let versions = {
+    'react-dom': 'latest',
+    react: 'latest',
     '@material-ui/core': getMuiPackageVersion('core', muiCommitRef),
     '@material-ui/icons': getMuiPackageVersion('icons', muiCommitRef),
     '@material-ui/lab': getMuiPackageVersion('lab', muiCommitRef),
@@ -142,6 +135,10 @@ function getDependencies(raw, options = {}) {
     '@date-io/date-fns': 'v1',
   };
 
+  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
@@ -161,7 +158,7 @@ function getDependencies(raw, options = {}) {
     }
   }
 
-  includePeerDependencies(deps, versions);
+  deps = includePeerDependencies(deps, versions);
 
   if (codeLanguage === CODE_VARIANTS.TS) {
     addTypeDeps(deps);
diff --git a/docs/src/modules/utils/helpers.test.js b/docs/src/modules/utils/helpers.test.js
@@ -56,16 +56,6 @@ const suggestions = [
     });
   });
 
-  it('should support next dependencies', () => {
-    expect(getDependencies(s1, { reactVersion: 'next' })).to.deep.equal({
-      '@foo-bar/bip': 'latest',
-      '@material-ui/core': 'latest',
-      'prop-types': 'latest',
-      'react-dom': 'next',
-      react: 'next',
-    });
-  });
-
   it('should support direct import', () => {
     const source = `
 import 'date-fns';
@@ -136,27 +126,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({
-      '@material-ui/core': 'latest',
-      '@material-ui/lab': 'latest',
-      '@material-ui/icons': 'latest',
-      '@material-ui/data-grid': 'latest',
-      '@material-ui/x-grid-data-generator': 'latest',
-      '@types/react': 'latest',
-      '@types/react-dom': 'latest',
-      react: 'latest',
-      'react-dom': 'latest',
-      typescript: 'latest',
-    });
-  });
-
   it('can use codesandbox deploys if a commit is given', () => {
     const source = `
 import * as Core from '@material-ui/core';

Original file line number	Diff line number	Diff line change
`@@ -79,7 +79,7 @@ function getLanguageConfig(demoData) {`
`79`	`79`	`}`
`80`	`80`	`}`
`81`	`81`
`82`		`-export default function getDemo(demoData) {`
	`82`	`+export default function getDemoConfig(demoData) {`
`83`	`83`	`const baseConfig = {`
`84`	`84`	`title: 'Material demo',`
`85`	`85`	`description: demoData.githubLocation,`