.github/workflows/web-deploy-nonprod.yml

@@ -71,7 +71,7 @@ jobs:
           username: ${{ secrets.DOCKERHUB_USER }}
           password: ${{ secrets.DOCKERHUB_TOKEN }}
       - name: Docker Build Backend
-        run: docker build -f web/Dockerfile -t john4064/shiftsync:latest_web ./web --build-arg TEST=${{ secrets.TEST }}
+        run: docker build -f web/Dockerfile -t john4064/shiftsync:latest_web ./web --build-arg ENVIRONMENT=dev
       - name: Docker Push Backend
         run: docker push john4064/shiftsync:latest_web
   deploy:

.github/workflows/web-deploy-prod.yml

@@ -71,9 +71,9 @@ jobs:
           username: ${{ secrets.DOCKERHUB_USER }}
           password: ${{ secrets.DOCKERHUB_TOKEN }}
       - name: Docker Build Backend
-        run: docker build -f web/Dockerfile -t john4064/shiftsync:latest_web ./web --build-arg TEST=${{ secrets.TEST }}
+        run: docker build -f web/Dockerfile -t john4064/shiftsync:prod_web ./web --build-arg ENVIRONMENT=prod
       - name: Docker Push Backend
-        run: docker push john4064/shiftsync:latest_web
+        run: docker push john4064/shiftsync:prod_web
   deploy:
     needs: build
     if: needs.build.result == 'success' && inputs.workflow_type == 'release'

package.json

@@ -1,11 +1,11 @@
 {
   "name": "shiftsync-website",
   "private": true,
-  "version": "1.0.1",
+  "version": "0.0.0",
   "main": "index.js",
   "scripts": {
     "api": "npm run dev --prefix api",
-    "web": "npm run dev --prefix web",
+    "web": "npm run local --prefix web",
     "dev": "concurrently \"npm run api\" \"npm run web\"",
     "test": "echo \"Error: no test specified\" && exit 1"
   },

web/Dockerfile

@@ -2,9 +2,6 @@ FROM node:20-alpine
 
 WORKDIR /app
 
-RUN echo ":tools: Listing context:" && ls -R . && echo "************************" 
-
-
 COPY ./package*.json ./
 
 RUN npm ci
@@ -14,5 +11,8 @@ COPY . ./
 EXPOSE 5173
 EXPOSE 5171
 
+ARG ENVIRONMENT
+ENV ENVIRONMENT ${ENVIRONMENT}
+RUN echo ${ENVIRONMENT}
 
-CMD ["npm", "run", "dev"]
+CMD npm run ${ENVIRONMENT}

web/docker-compose.yaml

@@ -1,6 +1,6 @@
 services:
   shiftsync-web:
-    image: 'docker.io/john4064/shiftsync:latest_web'
+    image: 'docker.io/john4064/shiftsync:prod_web'
     environment:
       - 'TESTVAR=${COOLIFY_VAR}'
     volumes:

web/package-lock.json

@@ -1748,9 +1748,9 @@
       }
     },
     "node_modules/@types/estree": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
-      "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.7.tgz",
+      "integrity": "sha512-w28IoSUCJpidD/TGviZwwMJckNESJZXFu7NBZ5YJ4mEUnNraUn9Pm8HSZm/jDF1pDWYKspWE7oVphigUPRakIQ==",
       "dev": true,
       "license": "MIT"
     },
@@ -3488,13 +3488,6 @@
         "fsevents": "~2.3.2"
       }
     },
-    "node_modules/rollup/node_modules/@types/estree": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.7.tgz",
-      "integrity": "sha512-w28IoSUCJpidD/TGviZwwMJckNESJZXFu7NBZ5YJ4mEUnNraUn9Pm8HSZm/jDF1pDWYKspWE7oVphigUPRakIQ==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/scheduler": {
       "version": "0.26.0",
       "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.26.0.tgz",

web/package.json

@@ -1,10 +1,12 @@
 {
   "name": "shiftsync-website-web",
   "private": true,
-  "version": "1.0.0",
+  "version": "1.0.1",
   "type": "module",
   "scripts": {
-    "dev": "vite --host",
+    "local": "vite",
+    "dev": "vite --host --mode dev",
+    "prod": "vite --host --mode prod",
     "build": "vite build",
     "lint": "eslint .",
     "preview": "vite preview"

web/src/pages/Home/Home.jsx

@@ -1,6 +1,7 @@
 import React, { useEffect } from 'react';
 import { Link } from 'react-router-dom';
 import { useLocalStore } from '@components';
+import pkg from '../../../package.json';
 
 export const Home = () => {
 
@@ -16,6 +17,7 @@ export const Home = () => {
     <div>
       <h1>Home Page</h1>
       <Link to="/settings">Go to Settings</Link>
+      <p>Version: {pkg.version}</p>
     </div>
   );
 };

web/vite.config.js

@@ -3,16 +3,39 @@ import react from '@vitejs/plugin-react';
 import path from 'path';
 
 // https://vite.dev/config/
-export default defineConfig({
-  plugins: [react()],
-  server:{
-    host: true,
-    allowedHosts: ['shift.code-catalyst.com']
-  },
-  resolve: {
-    alias: {
-      '@src': path.resolve(__dirname, 'src'),
-      '@components': path.resolve(__dirname, 'components')
+export default defineConfig(({ mode = 'local' }) => {
+  const isDev = mode === 'dev';
+  const isProd = mode === 'prod';
+
+  return {
+    plugins: [react()],
+    server:{
+      host: true,
+      allowedHosts: ['.code-catalyst.com'],
+      cors: true,
+      hmr: isDev
+        ? {
+            protocol: 'wss',
+            host: 'shift-dev.code-catalyst.com',
+            clientPort: 443,
+          }
+        : isProd ? 
+          {
+            protocol: 'wss',
+            host: 'shift.code-catalyst.com',
+            clientPort: 443,
+          }
+        : {
+            protocol: 'wss',
+            host: 'localhost',
+            clientPort: 443,
+        },
     },
-  },
+    resolve: {
+      alias: {
+        '@src': path.resolve(__dirname, 'src'),
+        '@components': path.resolve(__dirname, 'components')
+      },
+    },
+  }
 });