Getting yarn better. Working on the nox stuff for frontend.

Signed-off-by: Cliff Hill <xlorep@darkhelm.org>

.pre-commit-config.yaml

@@ -3,7 +3,7 @@ repos:
     hooks:
       - id: eslint-frontend
         name: ESLint
-        entry: yarn --cwd frontend node lint-staged.js
+        entry: corepack yarn --cwd frontend node lint-staged.js
         language: system
       - id: black
         name: black
@@ -15,6 +15,7 @@ repos:
         name: Check for added large files
         entry: check-added-large-files
         language: system
+        exclude: ^frontend/\.yarn/releases/yarn-.*\.cjs$
       - id: check-toml
         name: Check Toml
         entry: check-toml

README.md

@@ -95,7 +95,9 @@ This is a full-stack application simulating an online booking system for confere
 
 I used AI to stub out a couple of files:
 
-- The backend/Dockerfile and frontend/Dockerfile - to speed up the process of getting docker loaded efficiently for the project.
+- I use primarily copilot inside my VSCode. This was done through conversations I had with the AI about the state of the code, and ways to improve things, or for setting up documentation, etc as I explain below.
+- Any use is extremely caveated by me needing to adjust and correct what was conceieved by the AI, as it is a helpful tool, but often gets little details incorrect.
+- The Dockerfile.backend and Dockerfile.frontend - to speed up the process of getting docker loaded efficiently for the project.
 - The compose.yml file - getting the different images gathered together quickly.
 - The compose.dev.yml file - used to get a further understanding of how to hook up an extension to the previous file.
 - The mermaid diagrams used in this file.

frontend/.gitignore

@@ -1,3 +1,10 @@
+# Yarn Berry (v2+)
+.yarn/cache/
+.yarn/unplugged/
+.yarn/build/
+.yarn/install-state.gz
+.yarn/releases/
+.pnp.*
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
 # dependencies

frontend/.storybook/main.js

@@ -1,4 +1,4 @@
-export default {
+module.exports = {
   stories: ["../src/**/*.stories.@(js|jsx|ts|tsx)"],
   addons: [
     "@storybook/addon-links",
@@ -9,7 +9,23 @@ export default {
     name: "@storybook/react-webpack5",
     options: {},
   },
-  docs: {
-    autodocs: true,
+  webpackFinal: async (config) => {
+    config.module.rules.push({
+      test: /\.(ts|tsx)$/,
+      use: [
+        {
+          loader: require.resolve("babel-loader"),
+          options: {
+            presets: [
+              require.resolve("@babel/preset-env"),
+              require.resolve("@babel/preset-react"),
+              require.resolve("@babel/preset-typescript"),
+            ],
+          },
+        },
+      ],
+    });
+    config.resolve.extensions.push(".ts", ".tsx");
+    return config;
   },
 };

frontend/.yarnrc.yml

@@ -0,0 +1,3 @@
+nodeLinker: node-modules
+
+yarnPath: .yarn/releases/yarn-4.10.3.cjs

frontend/noxfile.py

@@ -61,7 +61,7 @@ def audit(session: nox.Session) -> None:
     """
     frontend_dir = Path(__file__).parent
     os.chdir(frontend_dir)
-    session.run("yarn", "audit", external=True)
+    session.run("yarn", "npm", "audit", external=True)
 
 
 @nox.session(name="storybook-build")

frontend/package.json

@@ -64,6 +64,7 @@
     ]
   },
   "devDependencies": {
+    "@babel/core": "^7.28.4",
     "@babel/preset-env": "7.28.3",
     "@babel/preset-react": "7.27.1",
     "@babel/preset-typescript": "7.27.1",
@@ -71,10 +72,9 @@
     "@storybook/addon-essentials": "7.6.15",
     "@storybook/addon-interactions": "7.6.15",
     "@storybook/addon-links": "7.6.15",
-    "@storybook/preset-create-react-app": "7.6.15",
     "@storybook/react": "7.6.15",
     "@storybook/react-webpack5": "7.6.15",
-    "@types/testing-library__user-event": "4.2.0",
+    "@types/babel__core": "^7",
     "@typescript-eslint/eslint-plugin": "8.45.0",
     "@typescript-eslint/parser": "8.45.0",
     "babel-jest": "30.1.2",
@@ -94,5 +94,6 @@
   "resolutions": {
     "postcss": "^8.4.31",
     "nth-check": "^2.0.1"
-  }
+  },
+  "packageManager": "yarn@4.10.3"
 }