From a0fe99b25e37b92dff5e1b36e41e3aaf2ee44124 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Tue, 17 Jul 2018 18:09:37 +0200 Subject: [PATCH] [icons] New iteration --- .babelrc | 13 +- .eslintignore | 2 +- .gitignore | 2 +- docs/src/modules/components/Notifications.js | 9 +- .../pages/style/icons/SvgMaterialIconsAll.js | 35 +++++ docs/src/pages/style/icons/icons.md | 4 + modules/waterfall/Batcher.js | 47 ++++++ modules/waterfall/Queue.js | 59 ++++++++ modules/waterfall/README.md | 3 + modules/waterfall/forEach.js | 8 + modules/waterfall/metric.js | 126 ++++++++++++++++ modules/waterfall/retry.js | 34 +++++ modules/waterfall/sleep.js | 7 + modules/waterfall/waitUntil.js | 17 +++ packages/material-ui-icons/builder.js | 137 +++++++++--------- packages/material-ui-icons/builder.test.js | 39 +---- .../{test => }/fixtures/game-icons/README.md | 0 .../transparent/dice-six-faces-five.svg | 0 .../transparent/dice-six-faces-four.svg | 0 .../perspective-dice-six-faces-random.svg | 0 .../perspective-dice-six-faces-six.svg | 0 .../svg/000000/transparent/pistol-gun.svg | 0 .../originals/svg/000000/transparent/ace.svg | 0 .../svg/000000/transparent/acid-blob.svg | 0 .../svg/000000/transparent/acorn.svg | 0 .../svg/000000/transparent/alien-skull.svg | 0 .../expected/Accessibility.js | 6 + .../svg/production/ic_3d_rotation_24px.svg | 0 .../svg/production/ic_3d_rotation_48px.svg | 0 .../svg/production/ic_accessibility_24px.svg | 0 .../svg/production/ic_accessibility_48px.svg | 0 .../production/ic_account_balance_24px.svg | 0 .../production/ic_account_balance_48px.svg | 0 .../ic_account_balance_wallet_24px.svg | 0 .../ic_account_balance_wallet_48px.svg | 0 .../svg/production/ic_account_box_18px.svg | 0 .../svg/production/ic_account_box_24px.svg | 0 .../svg/production/ic_account_box_48px.svg | 0 .../svg/production/ic_account_circle_18px.svg | 0 .../svg/production/ic_account_circle_24px.svg | 0 .../svg/production/ic_account_circle_48px.svg | 0 .../production/ic_add_shopping_cart_24px.svg | 0 .../production/ic_add_shopping_cart_48px.svg | 0 .../action/svg/production/ic_alarm_24px.svg | 0 .../action/svg/production/ic_alarm_48px.svg | 0 .../svg/social/svg/design/ic_cake_24px.svg | 0 .../svg/social/svg/design/ic_cake_48px.svg | 0 .../svg/social/svg/design/ic_domain_18px.svg | 0 .../svg/social/svg/design/ic_domain_24px.svg | 0 .../svg/social/svg/design/ic_domain_48px.svg | 0 .../social/svg/production/ic_cake_24px.svg | 0 .../social/svg/production/ic_cake_48px.svg | 0 .../social/svg/production/ic_domain_18px.svg | 0 .../social/svg/production/ic_domain_24px.svg | 0 .../social/svg/production/ic_domain_48px.svg | 0 .../social/svg/production/ic_group_18px.svg | 0 .../social/svg/production/ic_group_24px.svg | 0 .../social/svg/production/ic_group_48px.svg | 0 .../svg/production/ic_group_add_18px.svg | 0 packages/material-ui-icons/package.json | 10 +- .../rename => renameFilters}/default.js | 0 .../material-design-icons.js | 1 + .../material-ui-icons/scripts/download.js | 42 ++++-- .../expected/Accessibility.js | 6 - pages/style/icons.js | 7 + yarn.lock | 2 +- 66 files changed, 477 insertions(+), 139 deletions(-) create mode 100644 docs/src/pages/style/icons/SvgMaterialIconsAll.js create mode 100644 modules/waterfall/Batcher.js create mode 100644 modules/waterfall/Queue.js create mode 100644 modules/waterfall/README.md create mode 100644 modules/waterfall/forEach.js create mode 100644 modules/waterfall/metric.js create mode 100644 modules/waterfall/retry.js create mode 100644 modules/waterfall/sleep.js create mode 100644 modules/waterfall/waitUntil.js rename packages/material-ui-icons/{test => }/fixtures/game-icons/README.md (100%) rename packages/material-ui-icons/{test => }/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/dice-six-faces-five.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/dice-six-faces-four.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/perspective-dice-six-faces-random.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/perspective-dice-six-faces-six.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/game-icons/svg/icons/john-colburn/originals/svg/000000/transparent/pistol-gun.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/ace.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/acid-blob.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/acorn.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/alien-skull.svg (100%) create mode 100644 packages/material-ui-icons/fixtures/material-design-icons/expected/Accessibility.js rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_3d_rotation_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_3d_rotation_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_accessibility_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_accessibility_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_wallet_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_wallet_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_18px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_18px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_add_shopping_cart_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_add_shopping_cart_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_alarm_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/action/svg/production/ic_alarm_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/design/ic_cake_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/design/ic_cake_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/design/ic_domain_18px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/design/ic_domain_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/design/ic_domain_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/production/ic_cake_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/production/ic_cake_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/production/ic_domain_18px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/production/ic_domain_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/production/ic_domain_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/production/ic_group_18px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/production/ic_group_24px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/production/ic_group_48px.svg (100%) rename packages/material-ui-icons/{test => }/fixtures/material-design-icons/svg/social/svg/production/ic_group_add_18px.svg (100%) rename packages/material-ui-icons/{filters/rename => renameFilters}/default.js (100%) rename packages/material-ui-icons/{filters/rename => renameFilters}/material-design-icons.js (97%) delete mode 100644 packages/material-ui-icons/test/fixtures/material-design-icons/expected/Accessibility.js diff --git a/.babelrc b/.babelrc index 1889fd4c7f5dfa..9fe7b15219d541 100644 --- a/.babelrc +++ b/.babelrc @@ -26,7 +26,16 @@ ] }, "development": { - "sourceMaps": "both" + "plugins": [ + [ + "module-resolver", + { + "alias": { + "modules": "./modules", + } + } + ] + ] }, "docs-development": { "plugins": [ @@ -40,6 +49,7 @@ "@material-ui/icons": "./packages/material-ui-icons/src", "@material-ui/lab": "./packages/material-ui-lab/src", "docs": "./docs", + "modules": "./modules", "pages": "./pages" } } @@ -58,6 +68,7 @@ "@material-ui/icons": "./packages/material-ui-icons/src", "@material-ui/lab": "./packages/material-ui-lab/src", "docs": "./docs", + "modules": "./modules", "pages": "./pages" } } diff --git a/.eslintignore b/.eslintignore index fd1ac9f8804043..d5c4613895683e 100644 --- a/.eslintignore +++ b/.eslintignore @@ -11,7 +11,7 @@ /packages/material-ui-codemod/src/*/*.test /packages/material-ui-codemod/src/*/*.test.js /packages/material-ui-icons/src -/packages/material-ui-icons/test/fixtures +/packages/material-ui-icons/fixtures /packages/material-ui-icons/templateSvgIcon.js /tmp build diff --git a/.gitignore b/.gitignore index 9df1bb8a651ee6..b84658ad29064a 100644 --- a/.gitignore +++ b/.gitignore @@ -12,7 +12,7 @@ /coverage /docs/export /packages/material-ui-codemod/lib -/packages/material-ui-icons/material-design-icons +/packages/material-ui-icons/material-io-tools-icons /test/regressions/screenshots /test/selenium-output /tmp diff --git a/docs/src/modules/components/Notifications.js b/docs/src/modules/components/Notifications.js index 01eb9ffedde123..22bf276ca1ce48 100644 --- a/docs/src/modules/components/Notifications.js +++ b/docs/src/modules/components/Notifications.js @@ -4,6 +4,7 @@ import 'isomorphic-fetch'; import React from 'react'; import Button from '@material-ui/core/Button'; import Snackbar from '@material-ui/core/Snackbar'; +import sleep from 'modules/waterfall/sleep'; function getLastSeenNotification() { const seen = document.cookie.replace( @@ -13,18 +14,12 @@ function getLastSeenNotification() { return seen === '' ? 0 : parseInt(seen, 10); } -function pause(timeout) { - return new Promise(accept => { - setTimeout(accept, timeout); - }); -} - let messages = null; async function getMessages() { try { if (!messages) { - await pause(1e3); // Soften the pressure on the main thread. + await sleep(1e3); // Soften the pressure on the main thread. const result = await fetch( 'https://raw.githubusercontent.com/mui-org/material-ui/master/docs/notifications.json', ); diff --git a/docs/src/pages/style/icons/SvgMaterialIconsAll.js b/docs/src/pages/style/icons/SvgMaterialIconsAll.js new file mode 100644 index 00000000000000..198d1bbba0ad26 --- /dev/null +++ b/docs/src/pages/style/icons/SvgMaterialIconsAll.js @@ -0,0 +1,35 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { withStyles } from '@material-ui/core/styles'; + +const requireIcons = require.context('../../../../../packages/material-ui-icons/src', true, /js$/); + +const styles = theme => ({ + root: { + color: theme.palette.text.primary, + maxHeight: 300, + overflow: 'auto', + }, +}); + +function SvgMaterialIconsAll(props) { + const { classes } = props; + return ( +
+ {requireIcons.keys().map(key => { + if (key === './index.js' || key === './utils/createSvgIcon.js') { + return null; + } + + const Icon = requireIcons(key).default; + return ; + })} +
+ ); +} + +SvgMaterialIconsAll.propTypes = { + classes: PropTypes.object.isRequired, +}; + +export default withStyles(styles)(SvgMaterialIconsAll); diff --git a/docs/src/pages/style/icons/icons.md b/docs/src/pages/style/icons/icons.md index 87ee22a58ae50a..e19497487d4bd1 100644 --- a/docs/src/pages/style/icons/icons.md +++ b/docs/src/pages/style/icons/icons.md @@ -57,6 +57,10 @@ There are three exceptions to this rule: {{"demo": "pages/style/icons/SvgMaterialIcons.js"}} +The full list: + +{{"demo": "pages/style/icons/SvgMaterialIconsAll.js", "hideEditButton": true}} + #### More SVG icons Looking for even more SVG icons? There are a lot of projects out there, diff --git a/modules/waterfall/Batcher.js b/modules/waterfall/Batcher.js new file mode 100644 index 00000000000000..d3fd0ee52028c9 --- /dev/null +++ b/modules/waterfall/Batcher.js @@ -0,0 +1,47 @@ +// Inspired by http://caolan.github.io/async/docs.html#cargo +// The main difference is that we have a timeout. +class Batcher { + pendingEntries = []; + + timeout = null; + + context = {}; + + constructor(worker, options = {}) { + // max waiting time before flushing the pending entries (process them) + this.maxWait = options.maxWait || 1000; + // max number of entries in the queue before flushing them (process them) + this.maxItems = options.maxItems || 100; + this.worker = worker; + } + + // public method + push(entries, contextItem) { + this.context = contextItem; + this.pendingEntries = this.pendingEntries.concat(entries); + + if (this.pendingEntries.length >= this.maxItems) { + return this.sendItems(); + } + + clearTimeout(this.timeout); + this.timeout = setTimeout(() => { + this.sendItems(); + }, this.maxWait); + + return null; + } + + sendItems() { + const pendingEntries = this.pendingEntries.splice(0); // Transfer the item to the job. + clearTimeout(this.timeout); + return this.worker(pendingEntries, this.context); + } + + clear() { + clearTimeout(this.timeout); + this.pendingEntries = []; + } +} + +export default Batcher; diff --git a/modules/waterfall/Queue.js b/modules/waterfall/Queue.js new file mode 100644 index 00000000000000..23b858b7626a60 --- /dev/null +++ b/modules/waterfall/Queue.js @@ -0,0 +1,59 @@ +import waitUntil from './waitUntil'; + +class Queue { + pendingEntries = []; + + inFlight = 0; + + err = null; + + constructor(worker, options = {}) { + this.worker = worker; + this.concurrency = options.concurrency || 1; + } + + push = entries => { + this.pendingEntries = this.pendingEntries.concat(entries); + this.process(); + }; + + process = () => { + const scheduled = this.pendingEntries.splice(0, this.concurrency - this.inFlight); + this.inFlight += scheduled.length; + scheduled.forEach(async task => { + try { + await this.worker(task); + } catch (err) { + this.err = err; + } finally { + this.inFlight -= 1; + } + + if (this.pendingEntries.length > 0) { + this.process(); + } + }); + }; + + wait = (options = {}) => { + return waitUntil( + () => { + if (this.err) { + this.pendingEntries = []; + throw this.err; + } + + return { + predicate: options.empty + ? this.inFlight === 0 && this.pendingEntries.length === 0 + : this.concurrency > this.pendingEntries.length, + }; + }, + { + delay: 50, + }, + ); + }; +} + +export default Queue; diff --git a/modules/waterfall/README.md b/modules/waterfall/README.md new file mode 100644 index 00000000000000..374e3c31bd9707 --- /dev/null +++ b/modules/waterfall/README.md @@ -0,0 +1,3 @@ +# Waterfall + +A set of utility functions for handling async/await at scale. diff --git a/modules/waterfall/forEach.js b/modules/waterfall/forEach.js new file mode 100644 index 00000000000000..ad11eed70dcd27 --- /dev/null +++ b/modules/waterfall/forEach.js @@ -0,0 +1,8 @@ +async function forEach(array, iteratee) { + for (let i = 0; i < array.length; i += 1) { + // eslint-disable-next-line no-await-in-loop + await iteratee(array[i], i); + } +} + +export default forEach; diff --git a/modules/waterfall/metric.js b/modules/waterfall/metric.js new file mode 100644 index 00000000000000..c01482242b98e9 --- /dev/null +++ b/modules/waterfall/metric.js @@ -0,0 +1,126 @@ +// The API is inspired by console.time +// The implementation is isomorphic. +import warning from 'warning'; + +const times = new Map(); + +const implementations = { + mark: { + start: name => { + times.set(name, performance.now()); + performance.mark(`metric_${name}_start`); + }, + end: name => { + const endMark = `metric_${name}_end`; + performance.mark(endMark); + const startMark = `metric_${name}_start`; + performance.measure(name, startMark, endMark); + const duration = performance.getEntriesByName(name)[0].duration; + return duration; + }, + }, + now: { + start: name => { + times.set(name, performance.now()); + }, + end: name => { + const time = times.get(name); + const duration = performance.now() - time; + return duration; + }, + }, + hrtime: { + start: name => { + // https://nodejs.org/api/process.html#process_process_hrtime_time + times.set(name, process.hrtime()); + }, + end: name => { + const time = times.get(name); + const durations = process.hrtime(time); + const duration = durations[0] / 1e3 + durations[1] / 1e6; + return duration; + }, + }, +}; + +let getImplementationCache; + +function getImplementation() { + if (getImplementationCache) { + return getImplementationCache; + } + + if (typeof performance !== 'undefined' && performance.mark) { + getImplementationCache = implementations.mark; + } else if (typeof performance !== 'undefined' && performance.now) { + getImplementationCache = implementations.now; + } else if (process.hrtime) { + getImplementationCache = implementations.hrtime; + } else { + throw new Error('No performance API available'); + } + + return getImplementationCache; +} + +class Metric { + /** + * Call to begin a measurement. + */ + static start(name) { + warning(!times.get(name), 'Recording already started'); + getImplementation().start(name); + } + + /** + * Returns the duration of the timing metric. The unit is milliseconds. + * @type {number} + */ + static end(name) { + if (!times.get(name)) { + throw new Error(`No such name '${name}' for metric`); + } + + const duration = getImplementation().end(name); + times.delete(name); + return duration; + } + + name = ''; + + /** + * @param {string} name A name for the metric. + */ + constructor(name) { + if (!name) { + throw new Error('Please provide a metric name'); + } + + this.name = name; + } + + /** + * Call to begin a measurement. + */ + start(name) { + if (name) { + throw new Error('The name argument is not supported'); + } + + Metric.start(this.name); + } + + /** + * Returns the duration of the timing metric. The unit is milliseconds. + * @type {number} + */ + end(name) { + if (name) { + throw new Error('The name argument is not supported'); + } + + return Metric.end(this.name); + } +} + +export default Metric; diff --git a/modules/waterfall/retry.js b/modules/waterfall/retry.js new file mode 100644 index 00000000000000..5bda24bf9ecaad --- /dev/null +++ b/modules/waterfall/retry.js @@ -0,0 +1,34 @@ +// Inspired by https://github.com/zeit/async-retry +// Without the retry dependency (1 kB gzipped +) +async function retry(tryFunction, options = {}) { + const { retries = 3 } = options; + + let tries = 0; + let output = null; + let exitErr = null; + + const bail = err => { + exitErr = err; + }; + + while (tries < retries) { + tries += 1; + try { + // eslint-disable-next-line no-await-in-loop + output = await tryFunction({ tries, bail }); + break; + } catch (err) { + if (tries >= retries) { + throw err; + } + } + } + + if (exitErr) { + throw exitErr; + } + + return output; +} + +export default retry; diff --git a/modules/waterfall/sleep.js b/modules/waterfall/sleep.js new file mode 100644 index 00000000000000..8c8a12bb7d5a68 --- /dev/null +++ b/modules/waterfall/sleep.js @@ -0,0 +1,7 @@ +function sleep(delay = 0) { + return new Promise(resolve => { + setTimeout(resolve, delay); + }); +} + +export default sleep; diff --git a/modules/waterfall/waitUntil.js b/modules/waterfall/waitUntil.js new file mode 100644 index 00000000000000..42bc466d19c5c2 --- /dev/null +++ b/modules/waterfall/waitUntil.js @@ -0,0 +1,17 @@ +import sleep from './sleep'; + +export default async function waitUntil(test, options = {}) { + const { delay = 5e3, tries = -1 } = options; + const { predicate, result } = await test(); + + if (predicate) { + return result; + } + + if (tries - 1 === 0) { + throw new Error('tries limit reached'); + } + + await sleep(delay); + return waitUntil(test, { ...options, tries: tries > 0 ? tries - 1 : tries }); +} diff --git a/packages/material-ui-icons/builder.js b/packages/material-ui-icons/builder.js index d74b8fbb16ede5..6eb6c1ff698e55 100755 --- a/packages/material-ui-icons/builder.js +++ b/packages/material-ui-icons/builder.js @@ -1,16 +1,19 @@ /* eslint-disable no-console */ -import fs from 'fs'; +import fse from 'fs-extra'; import yargs from 'yargs'; import path from 'path'; import rimraf from 'rimraf'; import Mustache from 'mustache'; +import Queue from 'modules/waterfall/Queue'; +import util from 'util'; import glob from 'glob'; import mkdirp from 'mkdirp'; import SVGO from 'svgo'; -const RENAME_FILTER_DEFAULT = './filters/rename/default'; -const RENAME_FILTER_MUI = './filters/rename/material-design-icons'; +const globAsync = util.promisify(glob); +const RENAME_FILTER_DEFAULT = './renameFilters/default'; +const RENAME_FILTER_MUI = './renameFilters/material-design-icons'; const svgo = new SVGO({ plugins: [ @@ -76,16 +79,39 @@ function getComponentName(destPath) { return parts.join(''); } -async function getJsxString(svgPath, destPath, absDestPath) { - const componentName = getComponentName(destPath); - console.log(` ${componentName}`); +async function generateIndex(options) { + const files = await globAsync(path.join(options.outputDir, '*.js')); + const index = files + .map(file => { + const typename = path.basename(file).replace('.js', ''); + return `export { default as ${typename} } from './${typename}';\n`; + }) + .join(''); - const data = fs.readFileSync(svgPath, { encoding: 'utf8' }); - const template = fs.readFileSync(path.join(__dirname, 'templateSvgIcon.js'), { - encoding: 'utf8', - }); + await fse.writeFile(path.join(options.outputDir, 'index.js'), index); +} + +async function worker({ svgPath, options, renameFilter, template }) { + process.stdout.write('.'); + + const svgPathObj = path.parse(svgPath); + const innerPath = path + .dirname(svgPath) + .replace(options.svgDir, '') + .replace(path.relative(process.cwd(), options.svgDir), ''); // for relative dirs + const destPath = renameFilter(svgPathObj, innerPath, options); + + const outputFileDir = path.dirname(path.join(options.outputDir, destPath)); + const exists2 = await fse.exists(outputFileDir); + if (!exists2) { + console.log(`Making dir: ${outputFileDir}`); + mkdirp.sync(outputFileDir); + } + + const data = await fse.readFile(svgPath, { encoding: 'utf8' }); const result = await svgo.optimize(data); + // Extract the paths from the svg string // Clean xml paths const paths = result.data @@ -104,53 +130,11 @@ async function getJsxString(svgPath, destPath, absDestPath) { const fileString = Mustache.render(template, { paths, - componentName, + componentName: getComponentName(destPath), }); - fs.writeFileSync(absDestPath, fileString); -} - -/** - * @param {string} svgPath - * Absolute path to svg file to process. - * - * @param {string} destPath - * Path to jsx file relative to {options.outputDir} - * - * @param {object} options - */ -async function processFile(svgPath, destPath, options) { - const outputFileDir = path.dirname(path.join(options.outputDir, destPath)); - - if (!fs.existsSync(outputFileDir)) { - console.log(`Making dir: ${outputFileDir}`); - mkdirp.sync(outputFileDir); - } const absDestPath = path.join(options.outputDir, destPath); - await getJsxString(svgPath, destPath, absDestPath); -} - -/** - * make index.js, it exports all of SVGIcon classes. - * @param {object} options - */ -function processIndex(options) { - const index = glob - .sync(path.join(options.outputDir, '*.js')) - .map(file => { - const typename = path.basename(file).replace('.js', ''); - return `export { default as ${typename} } from './${typename}';\n`; - }) - .join(''); - - fs.writeFileSync(path.join(options.outputDir, 'index.js'), index); -} - -async function asyncForEach(array, callback) { - for (let index = 0; index < array.length; index += 1) { - // eslint-disable-next-line no-await-in-loop - await callback(array[index]); - } + await fse.writeFile(absDestPath, fileString); } async function main(options) { @@ -159,6 +143,7 @@ async function main(options) { options.glob = options.glob || '/**/*.svg'; options.innerPath = options.innerPath || ''; options.renameFilter = options.renameFilter || RENAME_FILTER_DEFAULT; + options.disableLog = options.disableLog || false; // Disable console.log opt, used for tests if (options.disableLog) { @@ -176,23 +161,34 @@ async function main(options) { if (typeof renameFilter !== 'function') { throw Error('renameFilter must be a function'); } - if (!fs.existsSync(options.outputDir)) { - fs.mkdirSync(options.outputDir); + const exists1 = await fse.exists(options.outputDir); + if (!exists1) { + await fse.mkdir(options.outputDir); } - const files = glob.sync(path.join(options.svgDir, options.glob)); - - await asyncForEach(files, async svgPath => { - const svgPathObj = path.parse(svgPath); - const innerPath = path - .dirname(svgPath) - .replace(options.svgDir, '') - .replace(path.relative(process.cwd(), options.svgDir), ''); // for relative dirs - const destPath = renameFilter(svgPathObj, innerPath, options); - - await processFile(svgPath, destPath, options); - }); - processIndex(options); + const [svgPaths, template] = await Promise.all([ + globAsync(path.join(options.svgDir, options.glob)), + fse.readFile(path.join(__dirname, 'templateSvgIcon.js'), { + encoding: 'utf8', + }), + ]); + + const queue = new Queue( + svgPath => { + return worker({ + svgPath, + options, + renameFilter, + template, + }); + }, + { concurrency: 4 }, + ); + + queue.push(svgPaths); + await queue.wait({ empty: true }); + + await generateIndex(options); if (options.disableLog) { // bring back stdout @@ -228,9 +224,6 @@ if (require.main === module) { export default { getComponentName, - getJsxString, - processFile, - processIndex, main, RENAME_FILTER_DEFAULT, RENAME_FILTER_MUI, diff --git a/packages/material-ui-icons/builder.test.js b/packages/material-ui-icons/builder.test.js index eb554ed97d567c..4b0c454d536a42 100644 --- a/packages/material-ui-icons/builder.test.js +++ b/packages/material-ui-icons/builder.test.js @@ -11,19 +11,13 @@ const DISABLE_LOG = true; // To cut down on test time, use fixtures instead of node_modules // const MUI_ICONS_ROOT = path.join(__dirname, '../node_modules/material-design-icons/'); -const MUI_ICONS_ROOT = path.join(__dirname, './test/fixtures/material-design-icons/'); +const MUI_ICONS_ROOT = path.join(__dirname, './fixtures/material-design-icons/'); const MUI_ICONS_SVG_DIR = path.join(MUI_ICONS_ROOT, 'svg'); -const GAME_ICONS_ROOT = path.join(__dirname, './test/fixtures/game-icons/'); +const GAME_ICONS_ROOT = path.join(__dirname, './fixtures/game-icons/'); const GAME_ICONS_SVG_DIR = path.join(GAME_ICONS_ROOT, 'svg/icons/'); describe('builder', () => { - describe('material-design-icons', () => { - it('should have icons to test with', () => { - assert.strictEqual(fs.lstatSync(MUI_ICONS_SVG_DIR).isDirectory(), true); - }); - }); - describe('#getComponentName', () => { it('should be a function', () => { assert.strictEqual(builder.hasOwnProperty('getComponentName'), true); @@ -39,32 +33,13 @@ describe('builder', () => { }); }); - describe('#main', () => { - it('should have main', () => { - assert.strictEqual(builder.hasOwnProperty('main'), true); - assert.isFunction(builder.main); - }); - }); - - describe('#getJsxString', () => { - it('should have getJsxString', () => { - assert.strictEqual(builder.hasOwnProperty('getJsxString'), true); - assert.strictEqual(typeof builder.getJsxString === 'function', true); - }); + it('should have icons to test with', () => { + assert.strictEqual(fs.lstatSync(MUI_ICONS_SVG_DIR).isDirectory(), true); }); - describe('#processFile', () => { - it('should be a function', () => { - assert.strictEqual(builder.hasOwnProperty('processFile'), true); - assert.isFunction(builder.processFile); - }); - }); - - describe('#processIndex', () => { - it('should be a function', () => { - assert.strictEqual(builder.hasOwnProperty('processIndex'), true); - assert.isFunction(builder.processIndex); - }); + it('should have main', () => { + assert.strictEqual(builder.hasOwnProperty('main'), true); + assert.isFunction(builder.main); }); describe('--output-dir', () => { diff --git a/packages/material-ui-icons/test/fixtures/game-icons/README.md b/packages/material-ui-icons/fixtures/game-icons/README.md similarity index 100% rename from packages/material-ui-icons/test/fixtures/game-icons/README.md rename to packages/material-ui-icons/fixtures/game-icons/README.md diff --git a/packages/material-ui-icons/test/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/dice-six-faces-five.svg b/packages/material-ui-icons/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/dice-six-faces-five.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/dice-six-faces-five.svg rename to packages/material-ui-icons/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/dice-six-faces-five.svg diff --git a/packages/material-ui-icons/test/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/dice-six-faces-four.svg b/packages/material-ui-icons/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/dice-six-faces-four.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/dice-six-faces-four.svg rename to packages/material-ui-icons/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/dice-six-faces-four.svg diff --git a/packages/material-ui-icons/test/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/perspective-dice-six-faces-random.svg b/packages/material-ui-icons/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/perspective-dice-six-faces-random.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/perspective-dice-six-faces-random.svg rename to packages/material-ui-icons/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/perspective-dice-six-faces-random.svg diff --git a/packages/material-ui-icons/test/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/perspective-dice-six-faces-six.svg b/packages/material-ui-icons/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/perspective-dice-six-faces-six.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/perspective-dice-six-faces-six.svg rename to packages/material-ui-icons/fixtures/game-icons/svg/icons/delapouite/dice/svg/000000/transparent/perspective-dice-six-faces-six.svg diff --git a/packages/material-ui-icons/test/fixtures/game-icons/svg/icons/john-colburn/originals/svg/000000/transparent/pistol-gun.svg b/packages/material-ui-icons/fixtures/game-icons/svg/icons/john-colburn/originals/svg/000000/transparent/pistol-gun.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/game-icons/svg/icons/john-colburn/originals/svg/000000/transparent/pistol-gun.svg rename to packages/material-ui-icons/fixtures/game-icons/svg/icons/john-colburn/originals/svg/000000/transparent/pistol-gun.svg diff --git a/packages/material-ui-icons/test/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/ace.svg b/packages/material-ui-icons/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/ace.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/ace.svg rename to packages/material-ui-icons/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/ace.svg diff --git a/packages/material-ui-icons/test/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/acid-blob.svg b/packages/material-ui-icons/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/acid-blob.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/acid-blob.svg rename to packages/material-ui-icons/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/acid-blob.svg diff --git a/packages/material-ui-icons/test/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/acorn.svg b/packages/material-ui-icons/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/acorn.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/acorn.svg rename to packages/material-ui-icons/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/acorn.svg diff --git a/packages/material-ui-icons/test/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/alien-skull.svg b/packages/material-ui-icons/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/alien-skull.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/alien-skull.svg rename to packages/material-ui-icons/fixtures/game-icons/svg/icons/lorc/originals/svg/000000/transparent/alien-skull.svg diff --git a/packages/material-ui-icons/fixtures/material-design-icons/expected/Accessibility.js b/packages/material-ui-icons/fixtures/material-design-icons/expected/Accessibility.js new file mode 100644 index 00000000000000..6bdc1b1539b0d0 --- /dev/null +++ b/packages/material-ui-icons/fixtures/material-design-icons/expected/Accessibility.js @@ -0,0 +1,6 @@ +import React from 'react'; +import createSvgIcon from './utils/createSvgIcon'; + +export default createSvgIcon( + +, 'Accessibility'); diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_3d_rotation_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_3d_rotation_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_3d_rotation_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_3d_rotation_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_3d_rotation_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_3d_rotation_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_3d_rotation_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_3d_rotation_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_accessibility_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_accessibility_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_accessibility_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_accessibility_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_accessibility_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_accessibility_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_accessibility_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_accessibility_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_wallet_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_wallet_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_wallet_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_wallet_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_wallet_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_wallet_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_wallet_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_balance_wallet_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_18px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_18px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_18px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_18px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_box_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_18px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_18px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_18px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_18px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_account_circle_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_add_shopping_cart_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_add_shopping_cart_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_add_shopping_cart_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_add_shopping_cart_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_add_shopping_cart_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_add_shopping_cart_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_add_shopping_cart_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_add_shopping_cart_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_alarm_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_alarm_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_alarm_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_alarm_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_alarm_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_alarm_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/action/svg/production/ic_alarm_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/action/svg/production/ic_alarm_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/design/ic_cake_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/design/ic_cake_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/design/ic_cake_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/design/ic_cake_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/design/ic_cake_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/design/ic_cake_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/design/ic_cake_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/design/ic_cake_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/design/ic_domain_18px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/design/ic_domain_18px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/design/ic_domain_18px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/design/ic_domain_18px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/design/ic_domain_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/design/ic_domain_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/design/ic_domain_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/design/ic_domain_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/design/ic_domain_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/design/ic_domain_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/design/ic_domain_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/design/ic_domain_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_cake_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_cake_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_cake_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_cake_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_cake_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_cake_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_cake_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_cake_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_domain_18px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_domain_18px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_domain_18px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_domain_18px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_domain_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_domain_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_domain_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_domain_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_domain_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_domain_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_domain_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_domain_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_group_18px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_group_18px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_group_18px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_group_18px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_group_24px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_group_24px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_group_24px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_group_24px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_group_48px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_group_48px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_group_48px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_group_48px.svg diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_group_add_18px.svg b/packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_group_add_18px.svg similarity index 100% rename from packages/material-ui-icons/test/fixtures/material-design-icons/svg/social/svg/production/ic_group_add_18px.svg rename to packages/material-ui-icons/fixtures/material-design-icons/svg/social/svg/production/ic_group_add_18px.svg diff --git a/packages/material-ui-icons/package.json b/packages/material-ui-icons/package.json index 931474081d41cd..1badda87225f34 100644 --- a/packages/material-ui-icons/package.json +++ b/packages/material-ui-icons/package.json @@ -25,16 +25,15 @@ "test": "yarn test:unit", "test:unit": "cd ../../ && ./node_modules/.bin/cross-env NODE_ENV=test ./node_modules/.bin/mocha packages/material-ui-icons/{,**/}*.test.js", "test:watch": "yarn test:unit --watch", - "download": "../../node_modules/.bin/babel-node ./scripts/download.js", - "src:icons": "../../node_modules/.bin/babel-node ./builder.js --output-dir ./src --svg-dir ./material-design-icons --glob '/**/*_24px.svg' --renameFilter ./filters/rename/material-design-icons.js", + "src:download": "cd ../../ && ./node_modules/.bin/babel-node packages/material-ui-icons/scripts/download.js", + "src:icons": "cd ../../ && node_modules/.bin/babel-node packages/material-ui-icons/builder.js --output-dir packages/material-ui-icons/src --svg-dir packages/material-ui-icons/material-io-tools-icons --glob '/**/*_24px.svg' --renameFilter ./renameFilters/material-design-icons.js", "prebuild": "../../node_modules/.bin/rimraf material-design-icons && ../../node_modules/.bin/rimraf build", "build:es2015": "../../node_modules/.bin/cross-env NODE_ENV=production ../../node_modules/.bin/babel ./src --out-dir ./build", "build:es2015modules": "../../node_modules/.bin/cross-env NODE_ENV=production BABEL_ENV=modules ../../node_modules/.bin/babel ./src/index.js --out-file ./build/index.es.js", "build:es": "../../node_modules/.bin/cross-env NODE_ENV=production BABEL_ENV=es ../../node_modules/.bin/babel ./src --out-dir ./build/es", "build:copy-files": "../../node_modules/.bin/babel-node ./scripts/copy-files.js", "build:typings": "../../node_modules/.bin/babel-node ./scripts/create-typings.js", - "build:all": "yarn src:icons && yarn build:es2015 && yarn build:es2015modules && yarn build:es && yarn build:typings && yarn build:copy-files", - "build": "yarn download && yarn build:all", + "build": "yarn build:es2015 && yarn build:es2015modules && yarn build:es && yarn build:typings && yarn build:copy-files", "release": "yarn build && npm publish build" }, "peerDependencies": { @@ -43,7 +42,8 @@ "react-dom": "^16.3.0" }, "dependencies": { - "recompose": "^0.26.0 || ^0.27.0" + "@babel/runtime": "^7.0.0-beta.42", + "recompose": "^0.27.0" }, "devDependencies": { "fs-extra": "^6.0.1", diff --git a/packages/material-ui-icons/filters/rename/default.js b/packages/material-ui-icons/renameFilters/default.js similarity index 100% rename from packages/material-ui-icons/filters/rename/default.js rename to packages/material-ui-icons/renameFilters/default.js diff --git a/packages/material-ui-icons/filters/rename/material-design-icons.js b/packages/material-ui-icons/renameFilters/material-design-icons.js similarity index 97% rename from packages/material-ui-icons/filters/rename/material-design-icons.js rename to packages/material-ui-icons/renameFilters/material-design-icons.js index 5a90699d9e24b3..c2ed9048cddf1b 100644 --- a/packages/material-ui-icons/filters/rename/material-design-icons.js +++ b/packages/material-ui-icons/renameFilters/material-design-icons.js @@ -4,6 +4,7 @@ function myDestRewriter(svgPathObj: Object) { let fileName = svgPathObj.base; fileName = fileName + .slice(3) .replace('_24px.svg', '.js') .replace(/(^.)|(_)(.)/g, (match, p1, p2, p3) => (p1 || p3).toUpperCase()); diff --git a/packages/material-ui-icons/scripts/download.js b/packages/material-ui-icons/scripts/download.js index 17d47b6ad9d6c6..158ed32d9ccb59 100644 --- a/packages/material-ui-icons/scripts/download.js +++ b/packages/material-ui-icons/scripts/download.js @@ -1,7 +1,11 @@ /* eslint-disable no-console */ import fse from 'fs-extra'; +import path from 'path'; import yargs from 'yargs'; +import Queue from 'modules/waterfall/Queue'; +import sleep from 'modules/waterfall/sleep'; +import retry from 'modules/waterfall/retry'; import 'isomorphic-fetch'; const themeMap = { @@ -38,15 +42,8 @@ const sizes = { }, }; -async function asyncForEach(array, callback, startAfter = 0) { - for (let index = startAfter; index < array.length; index += 1) { - // eslint-disable-next-line no-await-in-loop - await callback(array[index], index); - } -} - -function downloadIcon(icon, index) { - console.log(`downloadIcon ${index}: ${icon.id}`); +function downloadIcon(icon) { + console.log(`downloadIcon ${icon.index}: ${icon.id}`); return Promise.all( Object.keys(themeMap).map(async theme => { @@ -54,9 +51,15 @@ function downloadIcon(icon, index) { const response = await fetch( `https://material.io/tools/icons/static/icons/${theme}-${icon.id}-${size}px.svg`, ); + if (response.status !== 200) { + throw new Error(`status ${response.status}`); + } const SVG = await response.text(); await fse.writeFile( - `./material-design-icons/${icon.id}${themeMap[theme]}_${size}px.svg`, + path.join( + __dirname, + `../material-io-tools-icons/ic_${icon.id}${themeMap[theme]}_${size}px.svg`, + ), SVG, ); }), @@ -69,14 +72,27 @@ async function run() { .usage('Download the SVG from material.io/tools/icons') .describe('start-after', 'Resume at the following index').argv; console.log('run', argv); - await fse.ensureDir('material-design-icons'); + await fse.ensureDir(path.join(__dirname, '../material-io-tools-icons')); const response = await fetch('https://material.io/tools/icons/static/data.json'); const data = await response.json(); - const icons = data.categories.reduce((acc, item) => { + let icons = data.categories.reduce((acc, item) => { return acc.concat(item.icons); }, []); + icons = icons.map((icon, index) => ({ index, ...icon })); + icons = icons.splice(argv.startAfter || 0); console.log(`${icons.length} icons to download`); - await asyncForEach(icons, downloadIcon, argv.startAfter); + + const queue = new Queue( + async icon => { + await retry(async ({ tries }) => { + await sleep((tries - 1) * 100); + await downloadIcon(icon); + }); + }, + { concurrency: 5 }, + ); + queue.push(icons); + await queue.wait({ empty: true }); } catch (err) { console.log('err', err); throw err; diff --git a/packages/material-ui-icons/test/fixtures/material-design-icons/expected/Accessibility.js b/packages/material-ui-icons/test/fixtures/material-design-icons/expected/Accessibility.js deleted file mode 100644 index 5925ec5dcf8e75..00000000000000 --- a/packages/material-ui-icons/test/fixtures/material-design-icons/expected/Accessibility.js +++ /dev/null @@ -1,6 +0,0 @@ -import React from 'react'; -import createSvgIcon from './utils/createSvgIcon'; - -export default createSvgIcon( - -, 'Accessibility'); diff --git a/pages/style/icons.js b/pages/style/icons.js index 0ac9c9d83a8ed3..1323be575cc3ff 100644 --- a/pages/style/icons.js +++ b/pages/style/icons.js @@ -20,6 +20,13 @@ module.exports = require('fs') raw: preval` module.exports = require('fs') .readFileSync(require.resolve('docs/src/pages/style/icons/SvgMaterialIcons'), 'utf8') +`, + }, + 'pages/style/icons/SvgMaterialIconsAll.js': { + js: require('docs/src/pages/style/icons/SvgMaterialIconsAll').default, + raw: preval` +module.exports = require('fs') + .readFileSync(require.resolve('docs/src/pages/style/icons/SvgMaterialIconsAll'), 'utf8') `, }, 'pages/style/icons/Icons.js': { diff --git a/yarn.lock b/yarn.lock index 0573b1eff4bd71..2245bee2cf6fc2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8639,7 +8639,7 @@ recast@^0.15.0: private "~0.1.5" source-map "~0.6.1" -"recompose@^0.26.0 || ^0.27.0", recompose@^0.27.0: +recompose@^0.27.0: version "0.27.1" resolved "https://registry.yarnpkg.com/recompose/-/recompose-0.27.1.tgz#1a49e931f183634516633bbb4f4edbfd3f38a7ba" dependencies: