No storybook nx old storybook

.circleci/config.yml

@@ -5,7 +5,7 @@ orbs:
 references:
   default_env: &default_env
     docker:
-      - image: cimg/node:16.17.0
+      - image: cimg/node:20.15.0
     working_directory: ~/repo
     environment:
       IGNORE_COMMIT_MESSAGE: 'chore(release): publish'

.github/workflows/push.yml

@@ -6,15 +6,15 @@ jobs:
     steps:
       - uses: Codecademy/[email protected]
         with:
-          node-version: 16
+          node-version: 20
       - run: yarn format:verify
 
   lint:
     runs-on: ubuntu-latest
     steps:
       - uses: Codecademy/[email protected]
         with:
-          node-version: 16
+          node-version: 20
       - run: yarn build
       - run: yarn ${{ matrix.command }}
 

.lintstagedrc.mjs

@@ -9,9 +9,9 @@ export default {
       commands.push(`yarn syncpack format`);
     }
 
-    // if (micromatch.some(allChanges, 'yarn.lock')) {
-    //   commands.push(`npx yarn-deduplicate`);
-    // }
+    if (micromatch.some(allChanges, 'yarn.lock')) {
+      commands.push(`npx yarn-deduplicate`);
+    }
 
     const eslintExtensions = `{mdx,ts,tsx,js,jsx,json}`;
     const eslintFiles = micromatch(
@@ -22,9 +22,9 @@ export default {
 
     if (eslintFiles.length) {
       commands.push(
-        `node_modules/@codecademy/eslint-config/bin/eslint-fix.js ${eslintFiles.join(
-          ' '
-        )}`
+        `node_modules/@codecademy/eslint-config/bin/eslint-fix.js "${eslintFiles.join(
+          '" "'
+        )}"`
       );
     }
 

.nvmrc

@@ -1 +1 @@
-v16.17.0
+18.18.2

.prettierignore

@@ -5,3 +5,6 @@ node_modules
 packages/gamut-icons/src/icons
 packages/gamut-styles/**/*.d.ts
 packages/styleguide/stories/Core/Atoms/Markdown/*.md
+
+/.nx/cache
+/.nx/workspace-data

nx.json

@@ -1,25 +1,5 @@
 {
-  "tasksRunnerOptions": {
-    "default": {
-      "runner": "nx-cloud",
-      "options": {
-        "cacheableOperations": [
-          "lint",
-          "build",
-          "test",
-          "verify",
-          "build-storybook"
-        ],
-        "parallel": 3,
-        "useDaemonProcess": false,
-        "accessToken": "ZmVjZWYxNzctYTdmZC00ODYzLTg4MzEtZTE1YTVmZDdkZmY1fHJlYWQ="
-      }
-    }
-  },
   "extends": "nx/presets/npm.json",
-  "affected": {
-    "defaultBase": "main"
-  },
   "workspaceLayout": {
     "appsDir": "packages",
     "libsDir": "packages"
@@ -37,16 +17,30 @@
   "targetDefaults": {
     "build": {
       "dependsOn": ["^build"],
-      "inputs": ["production", "^production", "babelConfig"]
+      "inputs": ["production", "^production", "babelConfig"],
+      "cache": true
+    },
+    "verify": {
+      "cache": true
     },
-    "test": {
+    "@nx/jest:jest": {
       "dependsOn": ["^build"],
       "inputs": [
         "default",
         "^production",
         "{workspaceRoot}/jest.preset.js",
         "babelConfig"
-      ]
+      ],
+      "cache": true,
+      "options": {
+        "passWithNoTests": true
+      },
+      "configurations": {
+        "ci": {
+          "ci": true,
+          "codeCoverage": true
+        }
+      }
     }
   },
   "generators": {
@@ -60,5 +54,10 @@
       "linter": "eslint"
     }
   },
-  "$schema": "./node_modules/nx/schemas/nx-schema.json"
+  "$schema": "./node_modules/nx/schemas/nx-schema.json",
+  "useDaemonProcess": false,
+  "nxCloudAccessToken": "ZmVjZWYxNzctYTdmZC00ODYzLTg4MzEtZTE1YTVmZDdkZmY1fHJlYWQ=",
+  "parallel": 3,
+  "useInferencePlugins": false,
+  "defaultBase": "main"
 }

package.json

@@ -4,37 +4,38 @@
   "version": "1.2.0",
   "author": "Codecademy Engineers <[email protected]>",
   "dependencies": {
-    "@babel/cli": "7.20.7",
-    "@babel/core": "7.20.12",
-    "@babel/preset-typescript": "^7.18.6",
+    "@babel/cli": "7.24.7",
+    "@babel/core": "7.24.7",
+    "@babel/preset-env": "^7.24.7",
+    "@babel/preset-react": "^7.24.7",
+    "@babel/preset-typescript": "^7.24.7",
     "@codecademy/eslint-config": "8.0.0",
     "@codecademy/prettier-config": "^0.2.0",
     "@codecademy/tsconfig": "^0.2.0",
     "@emotion/babel-plugin": "11.11.0",
     "@emotion/jest": "^11.11.0",
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
-    "@nx/jest": "16.8.1",
-    "@nx/react": "16.8.1",
+    "@nx/jest": "19.3.2",
+    "@nx/react": "19.3.2",
     "@svgr/cli": "5.5.0",
     "@testing-library/dom": "^8.11.1",
     "@testing-library/jest-dom": "^5.16.1",
-    "@testing-library/react": "^12.1.2",
+    "@testing-library/react": "15.0.6",
     "@testing-library/react-hooks": "^7.0.2",
-    "@testing-library/user-event": "^13.5.0",
+    "@testing-library/user-event": "^14.5.2",
     "@types/classnames": "2.2.10",
     "@types/invariant": "2.2.29",
     "@types/konami-code-js": "^0.8.0",
     "@types/lodash": "4.17.0",
-    "@types/react": "^17",
-    "@types/react-dom": "^17",
+    "@types/react": "18.3.1",
+    "@types/react-dom": "18.3.0",
     "@types/react-test-renderer": "^17.0.1",
     "@types/stylis": "^4.2.0",
     "@typescript-eslint/eslint-plugin": "^5.15.0",
     "@typescript-eslint/parser": "^5.15.0",
     "babel-jest": "29.6.4",
     "babel-plugin-macros": "3.0.1",
-    "babel-preset-codecademy": "7.0.0",
     "component-test-setup": "^0.3.1",
     "conventional-changelog-cli": "^2.0.34",
     "conventional-changelog-conventionalcommits": "^4.3.0",
@@ -55,13 +56,12 @@
     "lodash": "^4.17.5",
     "micromatch": "^4.0.5",
     "mutationobserver-shim": "^0.3.3",
-    "nx": "16.8.1",
-    "nx-cloud": "16.4.0",
+    "nx": "19.3.2",
     "prettier": "2.2.1",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
     "react-helmet": "6.1.0",
-    "react-test-renderer": "^17.0.2",
+    "react-test-renderer": "18.3.1",
     "svgo": "^1.3.2",
     "syncpack": "^10.9.3",
     "ts-jest": "29.1.1",
@@ -75,7 +75,7 @@
     "webpack": "4.46.0"
   },
   "engines": {
-    "node": "^16.17",
+    "node": "^18.18",
     "yarn": "^1.21.1"
   },
   "license": "MIT",

packages/eslint-plugin-gamut/project.json

@@ -3,6 +3,7 @@
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
   "sourceRoot": "packages/eslint-plugin-gamut/src",
   "projectType": "library",
+  "tags": [],
   "targets": {
     "build": {
       "executor": "nx:run-commands",
@@ -16,10 +17,8 @@
       "executor": "@nx/jest:jest",
       "outputs": ["{workspaceRoot}/coverage/packages/eslint-plugin-gamut"],
       "options": {
-        "jestConfig": "packages/eslint-plugin-gamut/jest.config.ts",
-        "passWithNoTests": true
+        "jestConfig": "packages/eslint-plugin-gamut/jest.config.ts"
       }
     }
-  },
-  "tags": []
+  }
 }

packages/gamut-icons/babel.config.js

@@ -1,4 +1,19 @@
 module.exports = {
   extends: '../../babel.defaults.js',
-  presets: ['codecademy', '@babel/preset-typescript'],
+  presets: [
+    [
+      '@babel/env',
+      {
+        modules: process.env.NODE_ENV === 'test' ? 'commonjs' : false,
+        targets: 'defaults',
+      },
+    ],
+    [
+      '@babel/react',
+      {
+        runtime: 'automatic',
+      },
+    ],
+    '@babel/preset-typescript',
+  ],
 };

packages/gamut-icons/project.json

@@ -3,6 +3,7 @@
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
   "sourceRoot": "packages/gamut-icons/src",
   "projectType": "library",
+  "tags": [],
   "targets": {
     "build": {
       "outputs": [
@@ -30,10 +31,8 @@
       "executor": "@nx/jest:jest",
       "outputs": ["{workspaceRoot}/coverage/packages/gamut-icons"],
       "options": {
-        "jestConfig": "packages/gamut-icons/jest.config.ts",
-        "passWithNoTests": true
+        "jestConfig": "packages/gamut-icons/jest.config.ts"
       }
     }
-  },
-  "tags": []
+  }
 }

packages/gamut-illustrations/babel.config.js

@@ -1,6 +1,21 @@
 module.exports = {
   extends: '../../babel.defaults.js',
-  presets: ['codecademy', '@babel/preset-typescript'],
+  presets: [
+    [
+      '@babel/env',
+      {
+        modules: process.env.NODE_ENV === 'test' ? 'commonjs' : false,
+        targets: 'defaults',
+      },
+    ],
+    [
+      '@babel/react',
+      {
+        runtime: 'automatic',
+      },
+    ],
+    '@babel/preset-typescript',
+  ],
   plugins: [
     [
       '@emotion/babel-plugin',

packages/gamut-illustrations/project.json

@@ -3,6 +3,7 @@
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
   "sourceRoot": "packages/gamut-illustrations/src",
   "projectType": "library",
+  "tags": [],
   "targets": {
     "build": {
       "outputs": ["{projectRoot}/dist"],
@@ -21,10 +22,8 @@
       "executor": "@nx/jest:jest",
       "outputs": ["{workspaceRoot}/coverage/packages/gamut-illustrations"],
       "options": {
-        "jestConfig": "packages/gamut-illustrations/jest.config.ts",
-        "passWithNoTests": true
+        "jestConfig": "packages/gamut-illustrations/jest.config.ts"
       }
     }
-  },
-  "tags": []
+  }
 }

packages/gamut-patterns/babel.config.js

@@ -1,4 +1,19 @@
 module.exports = {
   extends: '../../babel.defaults.js',
-  presets: ['codecademy', '@babel/preset-typescript'],
+  presets: [
+    [
+      '@babel/env',
+      {
+        modules: process.env.NODE_ENV === 'test' ? 'commonjs' : false,
+        targets: 'defaults',
+      },
+    ],
+    [
+      '@babel/react',
+      {
+        runtime: 'automatic',
+      },
+    ],
+    '@babel/preset-typescript',
+  ],
 };

packages/gamut-patterns/project.json

@@ -3,6 +3,7 @@
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
   "sourceRoot": "packages/gamut-patterns/src",
   "projectType": "library",
+  "tags": [],
   "targets": {
     "build": {
       "outputs": [
@@ -30,10 +31,8 @@
       "outputs": ["{workspaceRoot}/coverage/packages/gamut-patterns"],
       "dependsOn": ["build"],
       "options": {
-        "jestConfig": "packages/gamut-patterns/jest.config.ts",
-        "passWithNoTests": true
+        "jestConfig": "packages/gamut-patterns/jest.config.ts"
       }
     }
-  },
-  "tags": []
+  }
 }

packages/gamut-styles/project.json

@@ -3,6 +3,7 @@
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
   "sourceRoot": "packages/gamut-styles/src",
   "projectType": "library",
+  "tags": [],
   "targets": {
     "build": {
       "outputs": ["{projectRoot}/dist"],
@@ -26,6 +27,5 @@
         "passWithNoTests": false
       }
     }
-  },
-  "tags": []
+  }
 }

packages/gamut-tests/babel.config.js

@@ -1,6 +1,21 @@
 module.exports = {
   extends: '../../babel.defaults.js',
-  presets: ['codecademy', '@babel/preset-typescript'],
+  presets: [
+    [
+      '@babel/env',
+      {
+        modules: process.env.NODE_ENV === 'test' ? 'commonjs' : false,
+        targets: 'defaults',
+      },
+    ],
+    [
+      '@babel/react',
+      {
+        runtime: 'automatic',
+      },
+    ],
+    '@babel/preset-typescript',
+  ],
   plugins: [
     [
       '@emotion/babel-plugin',