Merge pull request #127 from aroskanalen/develop

Upgrade to node 20 for building assets. Change to using Vite from CRA.
os2display · Aug 15, 2024 · 3ff6532 · 3ff6532
2 parents 157997d + 724d15b
commit 3ff6532
Show file tree

Hide file tree

Showing 25 changed files with 2,827 additions and 10,346 deletions.
diff --git a/.docker/vhost.conf b/.docker/vhost.conf
@@ -10,4 +10,11 @@ server {
         add_header         Cache-Control "public, max-age=604800";
         expires            7d;
     }
+
+    location /client/ws {
+        proxy_pass http://node:3000;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "upgrade";
+    }
 }
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -14,6 +14,7 @@
     "allowImportExportEverywhere": true
   },
   "rules": {
+    "react/require-default-props": "off",
     "react/jsx-filename-extension": [
       "warn",
       {

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,6 +4,13 @@ All notable changes to this project will be documented in this file.
 
 ## Unreleased
 
+- [#127](https://github.com/os2display/display-client/pull/127)
+  - Migrate from CRA to Vite
+  - Upgrade node from 14 -> 20
+  - Winston logging to Pino logging
+  - Set infrastructure node version to 20.
+  - Fixed base path to /client.
+
 ## [2.0.4] - 2024-08-14
 
 - [#128](https://github.com/os2display/display-client/pull/128)

diff --git a/docker-compose.yml b/docker-compose.yml
@@ -29,7 +29,7 @@ services:
       - "traefik.http.middlewares.redirect-to-https.redirectscheme.scheme=https"
 
   node:
-    image: node:14
+    image: node:20
     command: yarn start
     networks:
       - app

diff --git a/public/index.html → index.html b/public/index.html → index.html
@@ -2,28 +2,15 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta name="google" content="notranslate" />
     <meta
       name="description"
       content="OS2Display client"
     />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
+    <link rel="manifest" href="/manifest.json" />
     <title>OS2Display</title>
   </head>
   <body>
@@ -39,5 +26,6 @@
       To begin the development, run `npm start` or `yarn start`.
       To create a production bundle, use `npm run build` or `yarn build`.
     -->
+    <script type="module" src="/src/index.jsx"></script>
   </body>
 </html>
diff --git a/infrastructure/itkdev/Dockerfile b/infrastructure/itkdev/Dockerfile
@@ -1,4 +1,4 @@
-FROM node:16 AS APP_BUILDER
+FROM node:20 AS APP_BUILDER
 LABEL maintainer="ITK Dev <[email protected]>"
 
 ARG APP_VERSION="develop"

diff --git a/infrastructure/os2display/Dockerfile b/infrastructure/os2display/Dockerfile
@@ -1,4 +1,4 @@
-FROM node:16 AS APP_BUILDER
+FROM node:20 AS APP_BUILDER
 LABEL maintainer="ITK Dev <[email protected]>"
 
 ARG APP_VERSION="develop"

diff --git a/package.json b/package.json
@@ -1,6 +1,7 @@
 {
   "name": "display-client",
-  "version": "0.1.0",
+  "type": "module",
+  "version": "2.0.0",
   "homepage": "/client/",
   "private": true,
   "dependencies": {
@@ -12,20 +13,18 @@
     "jwt-decode": "^3.1.2",
     "lodash.clonedeep": "^4.5.0",
     "lodash.last": "^3.0.0",
-    "os2display-grid-generator": "^1.0.8",
+    "os2display-grid-generator": "^1.0.10",
+    "pino": "^9.1.0",
     "prop-types": "^15.7.2",
     "react": "^18.2.0",
-    "react-app-rewired": "^2.1.8",
     "react-dom": "^18.2.0",
     "react-intl": "^5.20.2",
     "react-transition-group": "^4.4.2",
     "rrule": "^2.7.2",
     "sass": "^1.37.5",
     "styled-components": "^5.3.1",
     "suncalc": "^1.9.0",
-    "ulid": "^2.3.0",
-    "web-vitals": "^1.0.1",
-    "winston": "^3.3.3"
+    "ulid": "^2.3.0"
   },
   "scripts": {
     "lint:js": "eslint --ext .js --ext .jsx ./src",
@@ -34,9 +33,9 @@
     "lint:scss:fix": "stylelint --fix \"./src/**/*.scss\"",
     "check-coding-standards": "npm run lint:js && npm run lint:scss",
     "apply-coding-standards": "npm run lint:js:fix && npm run lint:scss:fix",
-    "start": "react-app-rewired start",
-    "build": "react-app-rewired build",
-    "eject": "react-app-rewired eject"
+    "start": "vite --host 0.0.0.0",
+    "build": "vite build",
+    "serve": "vite preview"
   },
   "eslintConfig": {
     "extends": [
@@ -57,17 +56,20 @@
     ]
   },
   "devDependencies": {
-    "react-scripts": "4.0.3",
+    "@esbuild-plugins/node-globals-polyfill": "^0.2.3",
+    "@esbuild-plugins/node-modules-polyfill": "^0.2.2",
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
+    "@vitejs/plugin-react": "^4.3.0",
+    "@vitejs/plugin-react-swc": "^3.7.0",
     "babel-eslint": "^10.1.0",
     "eslint": "^7.32.0",
     "eslint-config-airbnb": "^18.2.1",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-cypress": "^2.11.3",
     "eslint-plugin-import": "^2.24.0",
-    "eslint-plugin-jsdoc": "^36.0.7",
+    "eslint-plugin-jsdoc": "^35.4.3",
     "eslint-plugin-jsx-a11y": "^6.4.1",
     "eslint-plugin-only-warn": "^1.0.3",
     "eslint-plugin-prettier": "^3.4.0",
@@ -77,6 +79,8 @@
     "stylelint-config-prettier": "^8.0.2",
     "stylelint-config-recommended-scss": "^4.3.0",
     "stylelint-prettier": "^1.2.0",
-    "stylelint-scss": "^3.19.0"
+    "stylelint-scss": "^3.19.0",
+    "vite": "^5.2.12",
+    "vite-plugin-svgr": "^4.2.0"
   }
 }