chore(prettier): full repo linting and code reformatting once and for all (#3627)

platform/cli/src/commands/addExtension.js

@@ -44,9 +44,7 @@ export default async function addExtension(packageName, version) {
     .run()
     .then(ctx => {
       console.log(
-        `${chalk.green.bold(
-          `Added ohif-extension ${packageName}@${ctx.yarnInfo.version}`
-        )} `
+        `${chalk.green.bold(`Added ohif-extension ${packageName}@${ctx.yarnInfo.version}`)} `
       );
     })
     .catch(error => {

platform/cli/src/commands/addExtensions.js

@@ -28,9 +28,7 @@ export default async function addExtensions(ohifExtensions) {
         extensonsString += ` ${packageName}@${version}`;
       });
 
-      console.log(
-        `${chalk.green.bold(`Extensions added:${extensonsString}`)} `
-      );
+      console.log(`${chalk.green.bold(`Extensions added:${extensonsString}`)} `);
     })
     .catch(error => {
       console.log(error.message);

platform/cli/src/commands/addMode.js

@@ -39,9 +39,7 @@ export default async function addMode(packageName, version) {
       {
         title: 'Detecting required ohif-extensions...',
         task: async ctx => {
-          ctx.ohifExtensions = await findRequiredOhifExtensionsForMode(
-            ctx.yarnInfo
-          );
+          ctx.ohifExtensions = await findRequiredOhifExtensionsForMode(ctx.yarnInfo);
         },
       },
     ],
@@ -53,11 +51,7 @@ export default async function addMode(packageName, version) {
   await tasks
     .run()
     .then(async ctx => {
-      console.log(
-        `${chalk.green.bold(
-          `Added ohif-mode ${packageName}@${ctx.yarnInfo.version}`
-        )} `
-      );
+      console.log(`${chalk.green.bold(`Added ohif-mode ${packageName}@${ctx.yarnInfo.version}`)} `);
 
       const ohifExtensions = ctx.ohifExtensions;
 

platform/cli/src/commands/createPackage.js

@@ -28,11 +28,7 @@ const createPackage = async options => {
       {
         title: 'Copying template files',
         task: () =>
-          createDirectoryContents(
-            options.templateDir,
-            options.targetDir,
-            options.prettier
-          ),
+          createDirectoryContents(options.templateDir, options.targetDir, options.prettier),
       },
       {
         title: 'Editing Package.json with provided information',
@@ -59,36 +55,20 @@ const createPackage = async options => {
 
   await tasks.run();
   console.log();
-  console.log(
-    chalk.green(`Done: ${packageType} is ready at`, options.targetDir)
-  );
+  console.log(chalk.green(`Done: ${packageType} is ready at`, options.targetDir));
   console.log();
 
-  console.log(
-    chalk.green(`NOTE: In order to use this ${packageType} for development,`)
-  );
-  console.log(
-    chalk.green(
-      `run the following command inside the root of the OHIF monorepo`
-    )
-  );
+  console.log(chalk.green(`NOTE: In order to use this ${packageType} for development,`));
+  console.log(chalk.green(`run the following command inside the root of the OHIF monorepo`));
 
   console.log();
-  console.log(
-    chalk.green.bold(
-      `    yarn run cli link-${packageType} ${options.targetDir}`
-    )
-  );
+  console.log(chalk.green.bold(`    yarn run cli link-${packageType} ${options.targetDir}`));
   console.log();
   console.log(
-    chalk.yellow(
-      "and when you don't need it anymore, run the following command to unlink it"
-    )
+    chalk.yellow("and when you don't need it anymore, run the following command to unlink it")
   );
   console.log();
-  console.log(
-    chalk.yellow(`    yarn run cli unlink-${packageType} ${options.name}`)
-  );
+  console.log(chalk.yellow(`    yarn run cli unlink-${packageType} ${options.name}`));
   console.log();
 
   return true;

platform/cli/src/commands/linkPackage.js

@@ -2,11 +2,7 @@ import fs from 'fs';
 import path from 'path';
 import { execa } from 'execa';
 import { keywords } from './enums/index.js';
-import {
-  validateYarn,
-  addExtensionToConfig,
-  addModeToConfig,
-} from './utils/index.js';
+import { validateYarn, addExtensionToConfig, addModeToConfig } from './utils/index.js';
 
 async function linkPackage(packageDir, options, addToConfig, keyword) {
   const { viewerDirectory } = options;
@@ -43,11 +39,7 @@ async function linkPackage(packageDir, options, addToConfig, keyword) {
 
   // Add the node_modules of the linked package so that webpack
   // can find the linked package externals if there are
-  const webpackPwaPath = path.join(
-    viewerDirectory,
-    '.webpack',
-    'webpack.pwa.js'
-  );
+  const webpackPwaPath = path.join(viewerDirectory, '.webpack', 'webpack.pwa.js');
 
   async function updateWebpackConfig(webpackConfigPath, packageDir) {
     const packageNodeModules = path.join(packageDir, 'node_modules');

platform/cli/src/commands/removeExtension.js

@@ -19,8 +19,7 @@ export default async function removeExtension(packageName) {
       },
       {
         title: `Checking if ${packageName} is in use by an installed mode`,
-        task: async () =>
-          await throwIfExtensionUsedByInstalledMode(packageName),
+        task: async () => await throwIfExtensionUsedByInstalledMode(packageName),
       },
       {
         title: `Uninstalling npm package: ${packageName}`,
@@ -39,9 +38,7 @@ export default async function removeExtension(packageName) {
   await tasks
     .run()
     .then(() => {
-      console.log(
-        `${chalk.green.bold(`Removed ohif-extension ${packageName}`)} `
-      );
+      console.log(`${chalk.green.bold(`Removed ohif-extension ${packageName}`)} `);
     })
     .catch(error => {
       console.log(error.message);

platform/cli/src/commands/removeExtensions.js

@@ -28,9 +28,7 @@ export default async function removeExtensions(ohifExtensionsToRemove) {
         extensonsString += ` ${packageName}`;
       });
 
-      console.log(
-        `${chalk.green.bold(`Extensions removed:${extensonsString}`)} `
-      );
+      console.log(`${chalk.green.bold(`Extensions removed:${extensonsString}`)} `);
     })
     .catch(error => {
       console.log(error.message);

platform/cli/src/commands/unlinkPackage.js

@@ -1,11 +1,7 @@
 import { execa } from 'execa';
 import fs from 'fs';
 import path from 'path';
-import {
-  validateYarn,
-  removeExtensionFromConfig,
-  removeModeFromConfig,
-} from './utils/index.js';
+import { validateYarn, removeExtensionFromConfig, removeModeFromConfig } from './utils/index.js';
 
 const linkPackage = async (packageName, options, removeFromConfig) => {
   const { viewerDirectory } = options;
@@ -19,11 +15,7 @@ const linkPackage = async (packageName, options, removeFromConfig) => {
   const results = await execa(`yarn`, ['unlink', packageName]);
   console.log(results.stdout);
 
-  const webpackPwaPath = path.join(
-    viewerDirectory,
-    '.webpack',
-    'webpack.pwa.js'
-  );
+  const webpackPwaPath = path.join(viewerDirectory, '.webpack', 'webpack.pwa.js');
 
   await removePathFromWebpackConfig(webpackPwaPath, packageName);
 
@@ -58,8 +50,7 @@ async function removePathFromWebpackConfig(webpackConfigPath, packageName) {
     endIndex++;
   }
 
-  const modifiedFileContent =
-    fileContent.slice(0, startIndex) + fileContent.slice(endIndex);
+  const modifiedFileContent = fileContent.slice(0, startIndex) + fileContent.slice(endIndex);
 
   await fs.promises.writeFile(webpackConfigPath, modifiedFileContent);
 }

platform/cli/src/commands/utils/createDirectoryContents.js

@@ -1,11 +1,7 @@
 import fs from 'fs';
 
 // https://github.dev/leoroese/template-cli/blob/628dd24db7df399ebb520edd0bc301bc7b5e8b66/index.js#L19
-const createDirectoryContents = (
-  templatePath,
-  targetDirPath,
-  copyPrettierRules
-) => {
+const createDirectoryContents = (templatePath, targetDirPath, copyPrettierRules) => {
   const filesToCreate = fs.readdirSync(templatePath);
 
   filesToCreate.forEach(file => {

platform/cli/src/commands/utils/findOhifExtensionsToRemoveAfterRemovingMode.js

@@ -1,9 +1,7 @@
 import { readPluginConfigFile } from './private/index.js';
 import getYarnInfo from './getYarnInfo.js';
 
-export default async function findOhifExtensionsToRemoveAfterRemovingMode(
-  removedModeYarnInfo
-) {
+export default async function findOhifExtensionsToRemoveAfterRemovingMode(removedModeYarnInfo) {
   const pluginConfig = readPluginConfigFile();
 
   if (!pluginConfig) {
@@ -13,27 +11,21 @@ export default async function findOhifExtensionsToRemoveAfterRemovingMode(
 
   const { modes, extensions } = pluginConfig;
 
-  const registeredExtensions = extensions.map(
-    extension => extension.packageName
-  );
+  const registeredExtensions = extensions.map(extension => extension.packageName);
   // TODO this is not a function
-  const ohifExtensionsOfMode = Object.keys(
-    removedModeYarnInfo.peerDependencies
-  ).filter(peerDependency => registeredExtensions.includes(peerDependency));
-
-  const ohifExtensionsUsedInOtherModes = ohifExtensionsOfMode.map(
-    packageName => {
-      return {
-        packageName,
-        used: false,
-      };
-    }
+  const ohifExtensionsOfMode = Object.keys(removedModeYarnInfo.peerDependencies).filter(
+    peerDependency => registeredExtensions.includes(peerDependency)
   );
 
+  const ohifExtensionsUsedInOtherModes = ohifExtensionsOfMode.map(packageName => {
+    return {
+      packageName,
+      used: false,
+    };
+  });
+
   // Check if other modes use each extension used by this mode
-  const otherModes = modes.filter(
-    mode => mode.packageName !== removedModeYarnInfo.name
-  );
+  const otherModes = modes.filter(mode => mode.packageName !== removedModeYarnInfo.name);
 
   for (let i = 0; i < otherModes.length; i++) {
     const mode = otherModes[i];

platform/cli/src/commands/utils/index.js

@@ -10,10 +10,7 @@ import {
 import getYarnInfo from './getYarnInfo.js';
 import { addExtensionToConfig, addModeToConfig } from './addToConfig.js';
 import findRequiredOhifExtensionsForMode from './findRequiredOhifExtensionsForMode.js';
-import {
-  removeExtensionFromConfig,
-  removeModeFromConfig,
-} from './removeFromConfig.js';
+import { removeExtensionFromConfig, removeModeFromConfig } from './removeFromConfig.js';
 import throwIfExtensionUsedByInstalledMode from './throwIfExtensionUsedByInstalledMode.js';
 import findOhifExtensionsToRemoveAfterRemovingMode from './findOhifExtensionsToRemoveAfterRemovingMode.js';
 import initGit from './initGit.js';

platform/cli/src/commands/utils/private/manipulatePluginConfigFile.js

@@ -17,9 +17,7 @@ function removeModeFromConfigJson(pluginConfig, { packageName }) {
 function removeFromList(listName, pluginConfig, { packageName }) {
   const list = pluginConfig[listName];
 
-  const indexOfExistingEntry = list.findIndex(
-    entry => entry.packageName === packageName
-  );
+  const indexOfExistingEntry = list.findIndex(entry => entry.packageName === packageName);
 
   if (indexOfExistingEntry !== -1) {
     pluginConfig[listName].splice(indexOfExistingEntry, 1);

platform/cli/src/commands/utils/validate.js

@@ -25,9 +25,7 @@ async function validateExtensionYarnInfo(packageName) {
 function validateYarnInfo(packageName, keyword) {
   return new Promise(async (resolve, reject) => {
     function rejectIfNotFound() {
-      const error = new Error(
-        `${chalk.red.bold('Error')} extension ${packageName} not installed`
-      );
+      const error = new Error(`${chalk.red.bold('Error')} extension ${packageName} not installed`);
       reject(error);
     }
 
@@ -116,16 +114,11 @@ function validate(packageName, version, keyword) {
         Authorization: `Bearer ${process.env.NPM_TOKEN}`,
       };
     }
-    const response = await fetch(
-      `${registryUrlOfPackage}${packageName}`,
-      options
-    );
+    const response = await fetch(`${registryUrlOfPackage}${packageName}`, options);
     const json = await response.json();
 
     if (json.error && json.error === NOT_FOUND) {
-      const error = new Error(
-        `${chalk.red.bold('Error')} package ${packageName} not found`
-      );
+      const error = new Error(`${chalk.red.bold('Error')} package ${packageName} not found`);
       reject(error);
       return;
     }
@@ -142,27 +135,18 @@ function validate(packageName, version, keyword) {
         resolve(true);
       } else {
         const error = new Error(
-          `${chalk.red.bold(
-            'Error'
-          )} package ${packageName} is not an ${keyword}`
+          `${chalk.red.bold('Error')} package ${packageName} is not an ${keyword}`
         );
         reject(error);
       }
     } else {
       // Particular version undefined
       const error = new Error(
-        `${chalk.red.bold(
-          'Error'
-        )} version ${packageVersion} of package ${packageName} not found`
+        `${chalk.red.bold('Error')} version ${packageVersion} of package ${packageName} not found`
       );
       reject(error);
     }
   });
 }
 
-export {
-  validateMode,
-  validateExtension,
-  validateModeYarnInfo,
-  validateExtensionYarnInfo,
-};
+export { validateMode, validateExtension, validateModeYarnInfo, validateExtensionYarnInfo };

platform/cli/src/index.js

@@ -32,15 +32,11 @@ try {
   const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
   if (packageJson.name !== 'ohif-monorepo-root') {
     console.log(packageJson);
-    console.log(
-      chalk.red('ohif-cli must run from the root of the OHIF platform')
-    );
+    console.log(chalk.red('ohif-cli must run from the root of the OHIF platform'));
     process.exit(1);
   }
 } catch (error) {
-  console.log(
-    chalk.red('ohif-cli must run from the root of the OHIF platform')
-  );
+  console.log(chalk.red('ohif-cli must run from the root of the OHIF platform'));
   process.exit(1);
 }
 
@@ -142,15 +138,11 @@ program
 
 program
   .command('link-extension <packageDir>')
-  .description(
-    'Links a local OHIF Extension to the Viewer to be used for development'
-  )
+  .description('Links a local OHIF Extension to the Viewer to be used for development')
   .action(packageDir => {
     if (!fs.existsSync(packageDir)) {
       console.log(
-        chalk.red(
-          'The Extension directory does not exist, please provide a valid directory'
-        )
+        chalk.red('The Extension directory does not exist, please provide a valid directory')
       );
       process.exit(1);
     }
@@ -171,16 +163,10 @@ program
 
 program
   .command('link-mode <packageDir>')
-  .description(
-    'Links a local OHIF Mode to the Viewer to be used for development'
-  )
+  .description('Links a local OHIF Mode to the Viewer to be used for development')
   .action(packageDir => {
     if (!fs.existsSync(packageDir)) {
-      console.log(
-        chalk.red(
-          'The Mode directory does not exist, please provide a valid directory'
-        )
-      );
+      console.log(chalk.red('The Mode directory does not exist, please provide a valid directory'));
       process.exit(1);
     }
     linkMode(packageDir, { viewerDirectory });

platform/cli/templates/extension/.prettierrc

@@ -1,8 +1,10 @@
 {
+  "plugins": ["prettier-plugin-tailwindcss"],
   "trailingComma": "es5",
-  "printWidth": 80,
+  "printWidth": 100,
   "proseWrap": "always",
   "tabWidth": 2,
   "semi": true,
-  "singleQuote": true
+  "singleQuote": true,
+  "arrowParens": "avoid"
 }

platform/cli/templates/extension/src/index.tsx

@@ -16,44 +16,28 @@ export default {
    * (e.g. cornerstone, cornerstoneTools, ...) or registering any services that
    * this extension is providing.
    */
-  preRegistration: ({
-    servicesManager,
-    commandsManager,
-    configuration = {},
-  }) => {},
+  preRegistration: ({ servicesManager, commandsManager, configuration = {} }) => {},
   /**
    * PanelModule should provide a list of panels that will be available in OHIF
    * for Modes to consume and render. Each panel is defined by a {name,
    * iconName, iconLabel, label, component} object. Example of a panel module
    * is the StudyBrowserPanel that is provided by the default extension in OHIF.
    */
-  getPanelModule: ({
-    servicesManager,
-    commandsManager,
-    extensionManager,
-  }) => {},
+  getPanelModule: ({ servicesManager, commandsManager, extensionManager }) => {},
   /**
    * ViewportModule should provide a list of viewports that will be available in OHIF
    * for Modes to consume and use in the viewports. Each viewport is defined by
    * {name, component} object. Example of a viewport module is the CornerstoneViewport
    * that is provided by the Cornerstone extension in OHIF.
    */
-  getViewportModule: ({
-    servicesManager,
-    commandsManager,
-    extensionManager,
-  }) => {},
+  getViewportModule: ({ servicesManager, commandsManager, extensionManager }) => {},
   /**
    * ToolbarModule should provide a list of tool buttons that will be available in OHIF
    * for Modes to consume and use in the toolbar. Each tool button is defined by
    * {name, defaultComponent, clickHandler }. Examples include radioGroupIcons and
    * splitButton toolButton that the default extension is providing.
    */
-  getToolbarModule: ({
-    servicesManager,
-    commandsManager,
-    extensionManager,
-  }) => {},
+  getToolbarModule: ({ servicesManager, commandsManager, extensionManager }) => {},
   /**
    * LayoutTemplateMOdule should provide a list of layout templates that will be
    * available in OHIF for Modes to consume and use to layout the viewer.
@@ -62,22 +46,14 @@ export default {
    * a Header, left and right sidebars, and a viewport section in the middle
    * of the viewer.
    */
-  getLayoutTemplateModule: ({
-    servicesManager,
-    commandsManager,
-    extensionManager,
-  }) => {},
+  getLayoutTemplateModule: ({ servicesManager, commandsManager, extensionManager }) => {},
   /**
    * SopClassHandlerModule should provide a list of sop class handlers that will be
    * available in OHIF for Modes to consume and use to create displaySets from Series.
    * Each sop class handler is defined by a { name, sopClassUids, getDisplaySetsFromSeries}.
    * Examples include the default sop class handler provided by the default extension
    */
-  getSopClassHandlerModule: ({
-    servicesManager,
-    commandsManager,
-    extensionManager,
-  }) => {},
+  getSopClassHandlerModule: ({ servicesManager, commandsManager, extensionManager }) => {},
   /**
    * HangingProtocolModule should provide a list of hanging protocols that will be
    * available in OHIF for Modes to use to decide on the structure of the viewports
@@ -85,11 +61,7 @@ export default {
    * { name, protocols}. Examples include the default hanging protocol provided by
    * the default extension that shows 2x2 viewports.
    */
-  getHangingProtocolModule: ({
-    servicesManager,
-    commandsManager,
-    extensionManager,
-  }) => {},
+  getHangingProtocolModule: ({ servicesManager, commandsManager, extensionManager }) => {},
   /**
    * CommandsModule should provide a list of commands that will be available in OHIF
    * for Modes to consume and use in the viewports. Each command is defined by
@@ -97,30 +69,18 @@ export default {
    * object of functions, definitions is an object of available commands, their
    * options, and defaultContext is the default context for the command to run against.
    */
-  getCommandsModule: ({
-    servicesManager,
-    commandsManager,
-    extensionManager,
-  }) => {},
+  getCommandsModule: ({ servicesManager, commandsManager, extensionManager }) => {},
   /**
    * ContextModule should provide a list of context that will be available in OHIF
    * and will be provided to the Modes. A context is a state that is shared OHIF.
    * Context is defined by an object of { name, context, provider }. Examples include
    * the measurementTracking context provided by the measurementTracking extension.
    */
-  getContextModule: ({
-    servicesManager,
-    commandsManager,
-    extensionManager,
-  }) => {},
+  getContextModule: ({ servicesManager, commandsManager, extensionManager }) => {},
   /**
    * DataSourceModule should provide a list of data sources to be used in OHIF.
    * DataSources can be used to map the external data formats to the OHIF's
    * native format. DataSources are defined by an object of { name, type, createDataSource }.
    */
-  getDataSourcesModule: ({
-    servicesManager,
-    commandsManager,
-    extensionManager,
-  }) => {},
+  getDataSourcesModule: ({ servicesManager, commandsManager, extensionManager }) => {},
 };

platform/cli/templates/mode/.prettierrc

@@ -1,8 +1,10 @@
 {
+  "plugins": ["prettier-plugin-tailwindcss"],
   "trailingComma": "es5",
-  "printWidth": 80,
+  "printWidth": 100,
   "proseWrap": "always",
   "tabWidth": 2,
   "semi": true,
-  "singleQuote": true
+  "singleQuote": true,
+  "arrowParens": "avoid"
 }

platform/cli/templates/mode/babel.config.js

@@ -10,7 +10,7 @@ module.exports = {
             modules: 'commonjs',
             debug: false,
           },
-          "@babel/preset-typescript",
+          '@babel/preset-typescript',
         ],
         '@babel/preset-react',
       ],
@@ -26,7 +26,7 @@ module.exports = {
         // WebPack handles ES6 --> Target Syntax
         ['@babel/preset-env', { modules: false }],
         '@babel/preset-react',
-        "@babel/preset-typescript",
+        '@babel/preset-typescript',
       ],
       ignore: ['**/*.test.jsx', '**/*.test.js', '__snapshots__', '__tests__'],
     },
@@ -35,7 +35,7 @@ module.exports = {
         // WebPack handles ES6 --> Target Syntax
         ['@babel/preset-env', { modules: false }],
         '@babel/preset-react',
-        "@babel/preset-typescript",
+        '@babel/preset-typescript',
       ],
       plugins: ['react-hot-loader/babel'],
       ignore: ['**/*.test.jsx', '**/*.test.js', '__snapshots__', '__tests__'],

platform/cli/templates/mode/src/index.tsx

@@ -41,11 +41,7 @@ function modeFactory({ modeConfiguration }) {
      * Services and other resources.
      */
     onModeEnter: ({ servicesManager, extensionManager, commandsManager }) => {
-      const {
-        measurementService,
-        toolbarService,
-        toolGroupService,
-      } = servicesManager.services;
+      const { measurementService, toolbarService, toolGroupService } = servicesManager.services;
 
       measurementService.clearMeasurements();