refactor: migrate mc-scripts package to TypeScript

.changeset/little-wasps-hug.md

@@ -0,0 +1,28 @@
+---
+'@commercetools-frontend/mc-scripts': minor
+---
+
+Migrate CLI to TypeScript.
+
+Internally, the CLI now uses [cac](https://github.com/cacjs/cac) to handle CLI commands and options.
+
+# Deprecated entry points
+
+Importing the function `createPostcssConfig` from the main entry point `@commercetools-frontend/mc-scripts` is now deprecated. Use the entry point `@commercetools-frontend/mc-scripts/postcss` instead.
+
+```diff
+const {
+  createPostcssConfig,
+-} = require('@commercetools-frontend/mc-scripts');
++} = require('@commercetools-frontend/mc-scripts/postcss');
+```
+
+Importing the functions `createWebpackConfigForDevelopment` and `createWebpackConfigForProduction` from the main entry point `@commercetools-frontend/mc-scripts` is now deprecated. Use the entry point `@commercetools-frontend/mc-scripts/webpack` instead.
+
+```diff
+const {
+  createWebpackConfigForDevelopment,
+  createWebpackConfigForProduction,
+-} = require('@commercetools-frontend/mc-scripts');
++} = require('@commercetools-frontend/mc-scripts/webpack');
+```

.changeset/quick-rocks-rhyme.md

@@ -0,0 +1,5 @@
+---
+'@commercetools-frontend/assets': patch
+---
+
+Convert entry point to typescript

.eslintrc.js

@@ -31,6 +31,18 @@ module.exports = {
         ],
       },
     },
+    {
+      files: ['**/*.core.graphql'],
+      rules: {
+        'graphql/template-strings': [
+          'error',
+          {
+            env: 'literal',
+            schemaJson: require('./schemas/core.json'),
+          },
+        ],
+      },
+    },
     {
       files: ['**/*.settings.graphql'],
       rules: {

.github/workflows/docs.yml

@@ -124,7 +124,7 @@ jobs:
 
     runs-on: ubuntu-latest
 
-    timeout-minutes: 5
+    timeout-minutes: 8
 
     steps:
       - name: Checkout

@types-extensions/graphql-core/index.d.ts

@@ -0,0 +1,9 @@
+/* THIS IS A GENERATED FILE */
+
+declare module '*/fetch-user-organizations.core.graphql' {
+  import { DocumentNode } from 'graphql';
+  const defaultDocument: DocumentNode;
+  export const FetchMyOrganizationsFromCli: DocumentNode;
+
+  export default defaultDocument;
+}

@types-extensions/graphql-ctp/index.d.ts

@@ -1,30 +1,6 @@
 /* THIS IS A GENERATED FILE */
 /* eslint-disable import/no-duplicates */
 
-declare module '*/fetch-channel-details.ctp.graphql' {
-  import { DocumentNode } from 'graphql';
-  const defaultDocument: DocumentNode;
-  export const FetchChannelDetails: DocumentNode;
-
-  export default defaultDocument;
-}
-
-declare module '*/fetch-channels.ctp.graphql' {
-  import { DocumentNode } from 'graphql';
-  const defaultDocument: DocumentNode;
-  export const FetchChannels: DocumentNode;
-
-  export default defaultDocument;
-}
-
-declare module '*/update-channel-details.ctp.graphql' {
-  import { DocumentNode } from 'graphql';
-  const defaultDocument: DocumentNode;
-  export const UpdateChannelDetails: DocumentNode;
-
-  export default defaultDocument;
-}
-
 declare module '*/quick-access-product.ctp.graphql' {
   import { DocumentNode } from 'graphql';
   const defaultDocument: DocumentNode;
@@ -40,19 +16,3 @@ declare module '*/quick-access.ctp.graphql' {
 
   export default defaultDocument;
 }
-
-declare module '*/fetch-state.ctp.graphql' {
-  import { DocumentNode } from 'graphql';
-  const defaultDocument: DocumentNode;
-  export const FetchState: DocumentNode;
-
-  export default defaultDocument;
-}
-
-declare module '*/fetch-states.ctp.graphql' {
-  import { DocumentNode } from 'graphql';
-  const defaultDocument: DocumentNode;
-  export const FetchStates: DocumentNode;
-
-  export default defaultDocument;
-}

@types/react-dev-utils/index.d.ts

@@ -0,0 +1,92 @@
+declare module 'react-dev-utils/checkRequiredFiles' {
+  function checkRequiredFiles(files: string[]): boolean;
+  export default checkRequiredFiles;
+}
+
+declare module 'react-dev-utils/clearConsole' {
+  function clearConsole(): void;
+  export default clearConsole;
+}
+
+declare module 'react-dev-utils/formatWebpackMessages' {
+  import type { StatsCompilation } from 'webpack';
+  function formatWebpackMessages(json: StatsCompilation): {
+    errors: string[];
+    warnings: string[];
+  };
+  export default formatWebpackMessages;
+}
+
+declare module 'react-dev-utils/FileSizeReporter' {
+  import type { Stats } from 'webpack';
+  type OpaqueFileSizes = {
+    root: string;
+    sizes: Record<string, number>;
+  };
+  export function measureFileSizesBeforeBuild(
+    buildFolder: string
+  ): Promise<OpaqueFileSizes>;
+  export function printFileSizesAfterBuild(
+    stats: Stats,
+    previousFileSizes: OpaqueFileSizes,
+    buildFolder: string,
+    maxBundleGzipSize?: number,
+    maxChunkGzipSize?: number
+  ): Promise<{
+    root: string;
+    sizes: Record<string, number>;
+  }>;
+}
+
+declare module 'react-dev-utils/printBuildError' {
+  function printBuildError(error: Error): void;
+  export default printBuildError;
+}
+
+declare module 'react-dev-utils/openBrowser' {
+  function openBrowser(url: string): boolean | number;
+  export default openBrowser;
+}
+
+declare module 'react-dev-utils/WebpackDevServerUtils' {
+  import type { Compiler, Configuration } from 'webpack';
+  import webpack from 'webpack';
+  export type Urls = {
+    lanUrlForConfig?: string;
+    lanUrlForTerminal?: string;
+    localUrlForTerminal: string;
+    localUrlForBrowser: string;
+  };
+  export type CreateCompilerOptions = {
+    /**
+     * The name that will be printed to the terminal.
+     */
+    appName: string;
+    /**
+     * The webpack configuration options to be provided to the webpack constructor.
+     */
+    config: Configuration;
+    /**
+     * To provide the `urls` argument, use `prepareUrls()` described below.
+     */
+    urls: Urls;
+    /**
+     * If `true`; yarn instructions will be emitted in the terminal instead of npm.
+     */
+    useYarn?: boolean | undefined;
+    /**
+     * Takes the `require('webpack')` entry point.
+     */
+    webpack: typeof webpack;
+  };
+  export function choosePort(
+    host: string,
+    defaultPort: number
+  ): Promise<number | null>;
+  export function createCompiler(options: CreateCompilerOptions): Compiler;
+  export function prepareUrls(
+    protocol: string,
+    host: string,
+    port: number
+  ): Urls;
+}

codegen.core.yml

@@ -0,0 +1,27 @@
+schema:
+  - '${MC_API_URL}':
+      headers:
+        Cookie: mcAccessToken=${MC_ACCESS_TOKEN}
+        X-Graphql-Target: administration
+documents: 'packages/**/*.core.graphql'
+extensions:
+  codegen:
+    generates:
+      schemas/core.json:
+        plugins:
+          - introspection
+      '@types-extensions/graphql-core/index.d.ts':
+        plugins:
+          - add:
+              content: /* THIS IS A GENERATED FILE */
+          - typescript-graphql-files-modules
+      packages/mc-scripts/src/generated/core.ts:
+        plugins:
+          - typescript
+          - typescript-operations
+        config:
+          typesPrefix: T
+          addUnderscoreToArgsType: true
+    hooks:
+      afterAllFileWrite:
+        - prettier --write

codegen.ctp.yml

@@ -4,7 +4,7 @@ schema:
         Cookie: mcAccessToken=${MC_ACCESS_TOKEN}
         X-Graphql-Target: ctp
         X-Project-Key: ${CTP_PROJECT_KEY}
-documents: '**/*.ctp.graphql'
+documents: 'packages/**/*.ctp.graphql'
 extensions:
   codegen:
     generates:

codegen.mc.yml

@@ -2,7 +2,7 @@ schema:
   - '${MC_API_URL}':
       headers:
         X-Graphql-Target: mc
-documents: '**/*.mc.graphql'
+documents: 'packages/**/*.mc.graphql'
 extensions:
   codegen:
     generates:

codegen.proxy.yml

@@ -1,5 +1,5 @@
 schema: '${MC_PROXY_URL}'
-documents: '**/*.proxy.graphql'
+documents: 'packages/**/*.proxy.graphql'
 extensions:
   codegen:
     generates:
@@ -20,3 +20,6 @@ extensions:
         config:
           typesPrefix: T
           addUnderscoreToArgsType: true
+    hooks:
+      afterAllFileWrite:
+        - prettier --write

codegen.settings.yml

@@ -3,7 +3,7 @@ schema:
       headers:
         Cookie: mcAccessToken=${MC_ACCESS_TOKEN}
         X-Graphql-Target: settings
-documents: '**/*.settings.graphql'
+documents: 'packages/**/*.settings.graphql'
 extensions:
   codegen:
     generates:
@@ -36,4 +36,17 @@ extensions:
           addUnderscoreToArgsType: true
           scalars:
             DateTime: string
-            Json: '{ [key: string]: unknown }'
+            Json: '{ [key: string]: unknown }'
+      packages/mc-scripts/src/generated/settings.ts:
+        plugins:
+          - typescript
+          - typescript-operations
+        config:
+          typesPrefix: T
+          addUnderscoreToArgsType: true
+          scalars:
+            DateTime: string
+            Json: '{ [key: string]: unknown }'
+    hooks:
+      afterAllFileWrite:
+        - prettier --write

package.json

@@ -48,9 +48,10 @@
     "labels:sync": "github-labels sync",
     "generate-types:mc": "graphql-codegen -r dotenv/config --config codegen.mc.yml",
     "generate-types:ctp": "graphql-codegen -r dotenv/config --config codegen.ctp.yml",
+    "generate-types:core": "graphql-codegen -r dotenv/config --config codegen.core.yml",
     "generate-types:settings": "graphql-codegen -r dotenv/config --config codegen.settings.yml",
     "generate-types:proxy": "graphql-codegen -r dotenv/config --config codegen.proxy.yml",
-    "generate-types": "yarn generate-types:mc && yarn generate-types:ctp && yarn generate-types:settings && yarn generate-types:proxy",
+    "generate-types": "yarn generate-types:mc && yarn generate-types:ctp && yarn generate-types:core && yarn generate-types:settings && yarn generate-types:proxy",
     "versions:uikit": "manypkg upgrade @commercetools-uikit",
     "versions:docskit": "manypkg upgrade @commercetools-docs"
   },
@@ -76,7 +77,6 @@
       "!packages/eslint-config-mc-app",
       "!packages/jest-preset-mc-app",
       "!packages/jest-stylelint-runner",
-      "!packages/mc-scripts",
       "!packages-backend/eslint-config-node"
     ]
   },

packages-backend/eslint-config-node/package.json

@@ -33,6 +33,7 @@
     "eslint": "8.x"
   },
   "devDependencies": {
+    "@tsconfig/node16": "^1.0.2",
     "eslint": "8.15.0"
   },
   "engines": {

packages-backend/eslint-config-node/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "@tsconfig/node16/tsconfig.json"
+}

packages-backend/express/package.json

@@ -26,6 +26,7 @@
     "jwks-rsa": "2.1.1"
   },
   "devDependencies": {
+    "@tsconfig/node16": "^1.0.2",
     "@types/express-unless": "^0.5.3",
     "@types/jsonwebtoken": "^8.5.8",
     "jose": "2.0.5",

packages-backend/express/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "@tsconfig/node16/tsconfig.json"
+}

packages-backend/loggers/package.json

@@ -37,6 +37,7 @@
     "winston": "3.7.2"
   },
   "devDependencies": {
+    "@tsconfig/node16": "^1.0.2",
     "express": "4.18.1"
   }
 }

packages-backend/loggers/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "@tsconfig/node16/tsconfig.json"
+}