@carbon/cli 10.29.0

package/src/commands/contribute/setup.js

@@ -0,0 +1,232 @@
+/**
+ * Copyright IBM Corp. 2019, 2019
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/* eslint-disable no-console */
+
+'use strict';
+
+const chalk = require('chalk');
+const { exec } = require('child-process-promise');
+const { prompt } = require('inquirer');
+const path = require('path');
+const createLogger = require('progress-estimator');
+const getGitHubClient = require('./tools/getGitHubClient');
+
+const logger = createLogger();
+
+chalk.link = chalk.dim.underline.italic;
+chalk.dimmed = chalk.dim.italic;
+
+async function setup() {
+  console.log(chalk`
+{bold Hi there!} 👋
+This tools is built for people looking to contribute to carbon.`);
+
+  if (!process.env.GH_TOKEN) {
+    console.log(chalk`
+To get started, you will need a GitHub account {link (https://github.com/)}
+
+Once you have an account you will need to setup a GitHub access token
+{link (https://help.github.com/en/articles/creating-a-personal-access-token-for-the-command-line)}
+`);
+  }
+
+  const client = await getGitHubClient();
+  const { data: whoami } = await client.users.getAuthenticated();
+
+  console.log(`Thanks for that, ${chalk.underline(
+    whoami.name
+  )}! Now, let's get started...
+
+Our first step is going to be to create a fork for each project you want to work on.
+`);
+
+  const { projects } = await prompt([
+    {
+      type: 'checkbox',
+      name: 'projects',
+      message: 'Select the projects you would like to contribute to',
+      choices: availableProjects,
+    },
+  ]);
+
+  console.log();
+  console.log(`Awesome! Let's get started`);
+  console.log();
+
+  const cwd = process.cwd();
+
+  for (const project of projects) {
+    await fork(client, cwd, project);
+  }
+
+  console.log('Done! 🥳  Thanks so much for contributing to Carbon! 🙏');
+}
+
+async function fork(client, cwd, project) {
+  const { commands, gitCloneEstimate, owner, repo } = project;
+
+  const createForkPromise = client.repos.createFork({
+    owner: project.owner,
+    repo: project.repo,
+  });
+  const { data } = await logger(
+    createForkPromise,
+    `Creating your fork for ${owner}/${repo}...`,
+    {
+      estimate: 1000,
+    }
+  );
+
+  console.log(
+    `Your fork is done! Now let's setup the project on your computer.`
+  );
+  console.log();
+
+  const { folder } = await prompt([
+    {
+      type: 'input',
+      name: 'folder',
+      message: 'Where would you like this project to be on your computer?',
+      default: path.join(cwd, project.repo),
+    },
+  ]);
+  const folderPath = path.isAbsolute(folder)
+    ? folder
+    : path.resolve(cwd, folder);
+
+  const gitCloneCommand = `git clone ${data.git_url} ${path.relative(
+    cwd,
+    folderPath
+  )}`;
+  const gitClonePromise = exec(gitCloneCommand);
+  await logger(gitClonePromise, `Running: ${chalk.dim(gitCloneCommand)}\n`, {
+    estimate: gitCloneEstimate,
+  });
+
+  const gitRemoteCommand = `git remote add upstream git@github.com:${owner}/${repo}.git`;
+  const gitRemotePromise = exec(gitRemoteCommand, {
+    cwd: folderPath,
+  });
+  await logger(gitRemotePromise, `Running: ${chalk.dim(gitRemoteCommand)}\n`, {
+    estimate: 500,
+  });
+
+  for (const { command, estimate, reason } of commands) {
+    await logger(
+      exec(command, {
+        cwd: folderPath,
+      }),
+      `Running: ${chalk.dim(`\`${command}\``)} ${reason}\n`,
+      {
+        estimate,
+      }
+    );
+  }
+
+  console.log(
+    `All done! You can find your project at ${chalk.underline(
+      path.relative(cwd, folderPath)
+    )}`
+  );
+}
+
+function wrap(fn) {
+  return async (...args) => {
+    try {
+      await fn(...args);
+    } catch (error) {
+      console.log(chalk.yellow.bold('Yikes!'));
+      console.log(
+        chalk`Looks like something went wrong 🙈 {dimmed (we're sorry about that)}
+
+Here is the error message:
+{dim ${indent(error.message, 4)}}
+
+If this is not helpful, please reach out! We're happy to help 🙂 You can make
+an issue over at:
+{link https://github.com/carbon-design-system/carbon/issues/new/choose}`
+      );
+    }
+  };
+}
+
+function indent(string, spaces = 2) {
+  return string
+    .split('\n')
+    .map((s) => s.padStart(spaces + s.length, ' '))
+    .join('\n');
+}
+
+const availableProjects = [
+  {
+    name: 'carbon',
+    value: {
+      owner: 'carbon-design-system',
+      repo: 'carbon',
+      gitCloneEstimate: 180 * 1000,
+      commands: [
+        {
+          command: 'yarn install --offline',
+          estimate: 150 * 1000,
+          reason: `to install the project's dependencies`,
+        },
+        {
+          command: 'yarn build',
+          estimate: 60 * 1000 * 5,
+          reason: `to build all the project's packages`,
+        },
+      ],
+    },
+  },
+  {
+    name: 'carbon-website',
+    value: {
+      owner: 'carbon-design-system',
+      repo: 'carbon-website',
+      gitCloneEstimate: 180 * 1000,
+      commands: [
+        {
+          command: 'yarn install --offline',
+          estimate: 45 * 1000,
+          reason: "to install the project's dependencies",
+        },
+        {
+          command: 'cd packages/addons-website && yarn build',
+          estimate: 30 * 1000,
+          reason: "to build all the project's packages",
+        },
+      ],
+    },
+  },
+  {
+    name: 'gatsby-theme-carbon',
+    value: {
+      owner: 'carbon-design-system',
+      repo: 'gatsby-theme-carbon',
+      gitCloneEstimate: 10 * 1000,
+      commands: [
+        {
+          command: 'yarn install',
+          estimate: 60 * 1000,
+          reason: "to install the project's dependencies",
+        },
+        {
+          command: 'yarn build',
+          estimate: 150 * 1000,
+          reason: "to build all the project's packages",
+        },
+      ],
+    },
+  },
+];
+
+module.exports = {
+  command: 'setup',
+  desc: 'setup your environment',
+  handler: wrap(setup),
+};

package/src/commands/contribute/tools/getGitHubClient.js

@@ -0,0 +1,73 @@
+/**
+ * Copyright IBM Corp. 2019, 2019
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/* eslint-disable no-console */
+
+'use strict';
+
+const Octokit = require('@octokit/rest');
+const { prompt } = require('inquirer');
+
+const CustomOctokit = Octokit.plugin([
+  require('@octokit/plugin-throttling'),
+  require('@octokit/plugin-retry'),
+]);
+
+async function getGitHubClient() {
+  let { GH_TOKEN } = process.env;
+
+  if (!GH_TOKEN) {
+    const question = [
+      {
+        type: 'password',
+        name: 'token',
+        message: 'Provide a GitHub access token',
+        hint:
+          'Help: https://help.github.com/en/articles/creating-a-personal-access-token-for-the-command-line',
+      },
+    ];
+    const answers = await prompt(question);
+    GH_TOKEN = answers.token;
+  }
+
+  const octokit = new CustomOctokit({
+    auth: `token ${GH_TOKEN}`,
+    throttle: {
+      onRateLimit: (retryAfter, options) => {
+        console.log(
+          `Request quota exhausted for request ${options.method} ${options.url}`
+        );
+
+        if (options.request.retryCount === 0) {
+          // only retries once
+          console.log(`Retrying after ${retryAfter} seconds!`);
+          return true;
+        }
+      },
+      onAbuseLimit: (retryAfter, options) => {
+        // does not retry, only logs a warning
+        console.log(
+          `Abuse detected for request ${options.method} ${options.url}`
+        );
+        if (options.request.retryCount === 0) {
+          // only retries once
+          console.log(`Retrying after ${retryAfter} seconds!`);
+          return true;
+        }
+      },
+    },
+  });
+
+  try {
+    await octokit.users.getAuthenticated();
+    return octokit;
+  } catch (error) {
+    throw new Error('Invalid GitHub token');
+  }
+}
+
+module.exports = getGitHubClient;

package/src/commands/contribute.js

@@ -0,0 +1,16 @@
+/**
+ * Copyright IBM Corp. 2019, 2019
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+module.exports = {
+  command: 'contribute <command>',
+  desc: 'get started contributing with Carbon',
+  builder(yargs) {
+    yargs.commandDir('contribute');
+  },
+};

package/src/commands/inline.js

@@ -0,0 +1,170 @@
+/**
+ * Copyright IBM Corp. 2019, 2019
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+const fs = require('fs-extra');
+const klaw = require('klaw-sync');
+const os = require('os');
+const path = require('path');
+const replace = require('replace-in-file');
+const { createLogger } = require('../logger');
+
+const logger = createLogger('inline');
+const isWin = process.platform === 'win32';
+const tmpDir = os.tmpdir();
+
+async function inline({ output }) {
+  logger.start('inline');
+
+  const cwd = process.cwd();
+  const packageJsonPath = path.join(cwd, 'package.json');
+  const sourceFolder = path.join(cwd, output);
+  const inlineFolder = path.join(cwd, output, '_inlined');
+  const vendorFolder = path.join(cwd, output, 'vendor');
+
+  await Promise.all([fs.remove(inlineFolder), fs.remove(vendorFolder)]);
+
+  logger.info('Inlining sass dependencies');
+
+  await inlineSassDependencies(
+    packageJsonPath,
+    sourceFolder,
+    vendorFolder,
+    cwd
+  );
+
+  logger.stop();
+}
+
+async function inlineSassDependencies(
+  packageJsonPath,
+  sourceFolder,
+  vendorFolder,
+  cwd
+) {
+  if (!fs.existsSync(packageJsonPath)) {
+    throw new Error(`Expected a package.json file at ${packageJsonPath}`);
+  }
+
+  const packageJson = await fs.readJson(packageJsonPath);
+  const { dependencies = {}, devDependencies = {} } = packageJson;
+  const allPossibleDependencies = [
+    ...Object.keys(dependencies),
+    ...Object.keys(devDependencies),
+  ];
+  const inlinedDependencies = (
+    await Promise.all(
+      allPossibleDependencies.map(async (dependency) => {
+        const modules = findSassModule(dependency, cwd);
+        if (modules) {
+          const [scssFolder] = modules;
+          const dependencyOutputFolder = path.join(vendorFolder, dependency);
+
+          await fs.copy(scssFolder, dependencyOutputFolder);
+
+          return [dependency, dependencyOutputFolder];
+        }
+      })
+    )
+  ).filter(Boolean);
+
+  if (inlinedDependencies.length === 0) {
+    return;
+  }
+
+  const tmpFolder = await fs.mkdtemp(
+    path.join(tmpDir, 'carbon-bundler-inline-')
+  );
+  const inlineFolder = path.join(sourceFolder, '_inlined');
+  const inlineFilename = path.join(
+    sourceFolder,
+    `${path.basename(path.dirname(sourceFolder))}.scss`
+  );
+
+  await fs.copy(sourceFolder, tmpFolder, {
+    filter(src) {
+      if (src === vendorFolder) {
+        return false;
+      }
+
+      if (src === inlineFilename) {
+        return false;
+      }
+
+      if (path.relative(sourceFolder, src).includes('modules')) {
+        return false;
+      }
+
+      return path.basename(src) !== 'index.scss';
+    },
+  });
+  await fs.copy(tmpFolder, inlineFolder);
+  await fs.remove(tmpFolder);
+
+  const paths = klaw(inlineFolder, {
+    nodir: true,
+  });
+
+  const REPLACE_REGEX = new RegExp(
+    `^@import '(${inlinedDependencies.map(([name]) => name).join('|')})/scss`,
+    'gm'
+  );
+  await Promise.all(
+    paths.map(async (file) => {
+      const relativeImportPath = path.relative(
+        path.dirname(file.path),
+        vendorFolder
+      );
+
+      await replace({
+        files: file.path,
+        from: REPLACE_REGEX,
+        to(_, match) {
+          return `@import '${
+            isWin ? relativeImportPath.replace('\\', '/') : relativeImportPath
+          }/${match}`;
+        },
+      });
+    })
+  );
+}
+
+function findSassModule(packageName, cwd) {
+  let currentDirectory = cwd;
+
+  while (currentDirectory !== path.dirname(currentDirectory)) {
+    const nodeModulesFolder = path.join(currentDirectory, 'node_modules');
+    const packageFolder = path.join(nodeModulesFolder, packageName);
+    const scssFolder = path.join(packageFolder, 'scss');
+    const packageJsonPath = path.join(packageFolder, 'package.json');
+
+    if (fs.existsSync(scssFolder)) {
+      return [scssFolder, packageFolder, packageJsonPath];
+    }
+
+    currentDirectory = path.dirname(currentDirectory);
+  }
+
+  return false;
+}
+
+module.exports = {
+  command: 'inline',
+  desc: 'inline sass dependencies from package.json in a target folder',
+  builder(yargs) {
+    yargs.options({
+      o: {
+        alias: 'output',
+        describe: 'the directory to output inlined sass dependencies',
+        type: 'string',
+        default: 'scss',
+      },
+    });
+  },
+  handler: inline,
+};