Migrate dockerfile to work with Vite

- also update/move around some dependencies

.dockerignore

@@ -25,3 +25,7 @@ README.md
 !.yarn/releases
 !.yarn/sdks
 !.yarn/versions
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local

Dockerfile

@@ -1,28 +1,40 @@
 # Dockerfile to build and serve OperationsGateway
 
 # Build stage
-FROM node:20.12.0-alpine3.19@sha256:ef3f47741e161900ddd07addcaca7e76534a9205e4cd73b2ed091ba339004a75 as builder
+FROM node:20.17.0-alpine3.20@sha256:2d07db07a2df6830718ae2a47db6fedce6745f5bcd174c398f2acdda90a11c03 as builder
 
 WORKDIR /operationsgateway-build
 
+# Enable dependency caching and share the cache between projects
+ENV YARN_ENABLE_GLOBAL_CACHE=true
+ENV YARN_GLOBAL_FOLDER=/root/.cache/.yarn
+
+COPY package.json tsconfig.json yarn.lock .yarnrc.yml ./
+COPY .yarn .yarn
+COPY public public
+
+RUN --mount=type=cache,target=/root/.cache/.yarn/cache \
+    set -eux; \
+    \
+    yarn workspaces focus --production;
+
 COPY . .
 
 RUN set -eux; \
     \
     # Set the React production variable which holds reference to the path of the plugin build \
-    sed -i "s#REACT_APP_OPERATIONSGATEWAY_BUILD_DIRECTORY=.*#REACT_APP_OPERATIONSGATEWAY_BUILD_DIRECTORY=/operationsgateway/#" .env.production; \
+    sed -i "s#VITE_APP_OPERATIONS_GATEWAY_BUILD_DIRECTORY=.*#VITE_APP_OPERATIONS_GATEWAY_BUILD_DIRECTORY=/operationsgateway/#" .env.production; \
     \
     cp public/operationsgateway-settings.example.json public/operationsgateway-settings.json; \
     \
-    # Note yarn rebuild - this is to let yarn rebuild binaries
-    yarn rebuild && yarn build;
+    yarn build;
 
 # Run stage
-FROM httpd:2.4.58-alpine3.19@sha256:92535cf7f151901ba91b04186292c3bd5bf82aa6ffa6eb7bc405fefbffedd480
+FROM httpd:2.4.62-alpine3.20@sha256:66c49302c02430619abb84240a438bcfc083015661009fcaaeaac931450f62cd
 
 WORKDIR /usr/local/apache2/htdocs
 
-COPY --from=builder /operationsgateway-build/build/. ./operationsgateway/
+COPY --from=builder /operationsgateway-build/dist/. ./operationsgateway/
 
 RUN set -eux; \
     \

package.json

@@ -23,10 +23,13 @@
     "@types/react-dom": "18.3.0",
     "@vitejs/plugin-react": "^4.3.1",
     "axios": "1.7.4",
+    "browserslist": "^4.23.0",
     "browserslist-to-esbuild": "^2.1.1",
-    "cypress-delete-downloads-folder": "^0.0.5",
+    "chart.js": "4.4.1",
+    "chartjs-plugin-zoom": "2.0.0",
     "date-fns": "3.6.0",
     "hacktimer": "1.1.3",
+    "husky": "9.1.1",
     "loglevel": "1.9.1",
     "msw": "2.3.5",
     "react": "18.3.1",
@@ -59,7 +62,7 @@
     "e2e": "start-server-and-test e2e:serve http://localhost:3000 cy:run",
     "cy:open": "cypress open",
     "cy:run": "cypress run",
-    "postinstall": "husky install"
+    "postinstall": "husky"
   },
   "lint-staged": {
     "src/**/*.{tsx,ts,js,jsx}": [
@@ -79,7 +82,6 @@
   ],
   "packageManager": "[email protected]",
   "devDependencies": {
-    "@babel/eslint-parser": "7.25.1",
     "@eslint/compat": "^1.1.1",
     "@playwright/test": "1.48.0",
     "@tanstack/eslint-plugin-query": "^5.53.0",
@@ -91,10 +93,9 @@
     "@types/eslint-plugin-jsx-a11y": "^6",
     "@typescript-eslint/typescript-estree": "8.10.0",
     "@vitest/coverage-v8": "^2.0.5",
-    "chart.js": "4.4.1",
-    "chartjs-plugin-zoom": "2.0.0",
     "cross-env": "7.0.3",
     "cypress": "13.15.0",
+    "cypress-delete-downloads-folder": "^0.0.5",
     "eslint": "9.13.0",
     "eslint-config-prettier": "9.1.0",
     "eslint-plugin-cypress": "4.0.0",
@@ -106,7 +107,6 @@
     "eslint-plugin-testing-library": "^6.3.0",
     "express": "4.21.0",
     "globals": "^15.9.0",
-    "husky": "9.1.1",
     "jsdom": "^25.0.0",
     "lint-staged": "15.2.0",
     "prettier": "3.3.3",

yarn.lock

@@ -62,20 +62,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/eslint-parser@npm:7.25.1":
-  version: 7.25.1
-  resolution: "@babel/eslint-parser@npm:7.25.1"
-  dependencies:
-    "@nicolo-ribaudo/eslint-scope-5-internals": "npm:5.1.1-v1"
-    eslint-visitor-keys: "npm:^2.1.0"
-    semver: "npm:^6.3.1"
-  peerDependencies:
-    "@babel/core": ^7.11.0
-    eslint: ^7.5.0 || ^8.0.0 || ^9.0.0
-  checksum: 10c0/9f98351b32edfced9e6308a80ad69af1210d9c9780f19339cb286d0c9be0a9afac80d1df3b3793112e720675ce5b927920b19454d0f48ddf8370d08ab62d0dc2
-  languageName: node
-  linkType: hard
-
 "@babel/generator@npm:^7.25.0, @babel/generator@npm:^7.25.6":
   version: 7.25.6
   resolution: "@babel/generator@npm:7.25.6"
@@ -1346,15 +1332,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@nicolo-ribaudo/eslint-scope-5-internals@npm:5.1.1-v1":
-  version: 5.1.1-v1
-  resolution: "@nicolo-ribaudo/eslint-scope-5-internals@npm:5.1.1-v1"
-  dependencies:
-    eslint-scope: "npm:5.1.1"
-  checksum: 10c0/75dda3e623b8ad7369ca22552d6beee337a814b2d0e8a32d23edd13fcb65c8082b32c5d86e436f3860dd7ade30d91d5db55d4ef9a08fb5a976c718ecc0d88a74
-  languageName: node
-  linkType: hard
-
 "@nodelib/fs.scandir@npm:2.1.5":
   version: 2.1.5
   resolution: "@nodelib/fs.scandir@npm:2.1.5"
@@ -2861,6 +2838,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"browserslist@npm:^4.23.0":
+  version: 4.24.2
+  resolution: "browserslist@npm:4.24.2"
+  dependencies:
+    caniuse-lite: "npm:^1.0.30001669"
+    electron-to-chromium: "npm:^1.5.41"
+    node-releases: "npm:^2.0.18"
+    update-browserslist-db: "npm:^1.1.1"
+  bin:
+    browserslist: cli.js
+  checksum: 10c0/d747c9fb65ed7b4f1abcae4959405707ed9a7b835639f8a9ba0da2911995a6ab9b0648fd05baf2a4d4e3cf7f9fdbad56d3753f91881e365992c1d49c8d88ff7a
+  languageName: node
+  linkType: hard
+
 "browserslist@npm:^4.23.1":
   version: 4.23.3
   resolution: "browserslist@npm:4.23.3"
@@ -2974,6 +2965,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"caniuse-lite@npm:^1.0.30001669":
+  version: 1.0.30001677
+  resolution: "caniuse-lite@npm:1.0.30001677"
+  checksum: 10c0/22b4aa738b213b5d0bc820c26ba23fa265ca90a5c59776e1a686b9ab6fff9120d0825fd920c0a601a4b65056ef40d01548405feb95c8dd6083255f50c71a0864
+  languageName: node
+  linkType: hard
+
 "caseless@npm:~0.12.0":
   version: 0.12.0
   resolution: "caseless@npm:0.12.0"
@@ -3802,6 +3800,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"electron-to-chromium@npm:^1.5.41":
+  version: 1.5.51
+  resolution: "electron-to-chromium@npm:1.5.51"
+  checksum: 10c0/1903552a918bfc0568a3af568b14c9ac35bcf1ec8cba33a1c50304d93195c825aaa9b82ae463fcb19805600add4c302e7d2db4d762c36e5ae6547f72ad21afdd
+  languageName: node
+  linkType: hard
+
 "emoji-regex@npm:^10.3.0":
   version: 10.4.0
   resolution: "emoji-regex@npm:10.4.0"
@@ -4131,7 +4136,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"escalade@npm:^3.1.1, escalade@npm:^3.1.2":
+"escalade@npm:^3.1.1, escalade@npm:^3.1.2, escalade@npm:^3.2.0":
   version: 3.2.0
   resolution: "escalade@npm:3.2.0"
   checksum: 10c0/ced4dd3a78e15897ed3be74e635110bbf3b08877b0a41be50dcb325ee0e0b5f65fc2d50e9845194d7c4633f327e2e1c6cce00a71b617c5673df0374201d67f65
@@ -4282,7 +4287,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"eslint-scope@npm:5.1.1, eslint-scope@npm:^5.1.1":
+"eslint-scope@npm:^5.1.1":
   version: 5.1.1
   resolution: "eslint-scope@npm:5.1.1"
   dependencies:
@@ -4302,13 +4307,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"eslint-visitor-keys@npm:^2.1.0":
-  version: 2.1.0
-  resolution: "eslint-visitor-keys@npm:2.1.0"
-  checksum: 10c0/9f0e3a2db751d84067d15977ac4b4472efd6b303e369e6ff241a99feac04da758f46d5add022c33d06b53596038dbae4b4aceb27c7e68b8dfc1055b35e495787
-  languageName: node
-  linkType: hard
-
 "eslint-visitor-keys@npm:^3.3.0, eslint-visitor-keys@npm:^3.4.3":
   version: 3.4.3
   resolution: "eslint-visitor-keys@npm:3.4.3"
@@ -6908,7 +6906,6 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "operationsgateway@workspace:."
   dependencies:
-    "@babel/eslint-parser": "npm:7.25.1"
     "@date-io/date-fns": "npm:3.0.0"
     "@emotion/cache": "npm:11.13.0"
     "@emotion/react": "npm:11.13.0"
@@ -6939,6 +6936,7 @@ __metadata:
     "@vitejs/plugin-react": "npm:^4.3.1"
     "@vitest/coverage-v8": "npm:^2.0.5"
     axios: "npm:1.7.4"
+    browserslist: "npm:^4.23.0"
     browserslist-to-esbuild: "npm:^2.1.1"
     chart.js: "npm:4.4.1"
     chartjs-plugin-zoom: "npm:2.0.0"
@@ -7197,6 +7195,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"picocolors@npm:^1.1.0":
+  version: 1.1.1
+  resolution: "picocolors@npm:1.1.1"
+  checksum: 10c0/e2e3e8170ab9d7c7421969adaa7e1b31434f789afb9b3f115f6b96d91945041ac3ceb02e9ec6fe6510ff036bcc0bf91e69a1772edc0b707e12b19c0f2d6bcf58
+  languageName: node
+  linkType: hard
+
 "picomatch@npm:^2.3.1":
   version: 2.3.1
   resolution: "picomatch@npm:2.3.1"
@@ -8987,6 +8992,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"update-browserslist-db@npm:^1.1.1":
+  version: 1.1.1
+  resolution: "update-browserslist-db@npm:1.1.1"
+  dependencies:
+    escalade: "npm:^3.2.0"
+    picocolors: "npm:^1.1.0"
+  peerDependencies:
+    browserslist: ">= 4.21.0"
+  bin:
+    update-browserslist-db: cli.js
+  checksum: 10c0/536a2979adda2b4be81b07e311bd2f3ad5e978690987956bc5f514130ad50cac87cd22c710b686d79731e00fbee8ef43efe5fcd72baa241045209195d43dcc80
+  languageName: node
+  linkType: hard
+
 "update-check@npm:1.5.4":
   version: 1.5.4
   resolution: "update-check@npm:1.5.4"