Merge branch 'dev_environment' of gitlab.com:brandx/bxt-app into dev_environment

.env

@@ -6,3 +6,18 @@ VITE_APP_API_DEV_URL=https://bxt-dev.api.adaptiveagriculture.ca/v1
 VITE_AUTH0_CLIENT_DOMAIN=brandxtech.auth0.com
 VITE_AUTH0_AUDIENCE=api.brandxtech.ca
 VITE_AUTH0_DEV_CLIENT_ID=dzJTpqIeMA4Rwk4xujtwPbAO3TY32bM1
+VITE_AUTH0_STAGING_CLIENT_ID=3ib460VvLwdeyse5iUSQfxkVdQaUmphP
+
+# VITE_AUTH0_CLIENT_ID=3ib460VvLwdeyse5iUSQfxkVdQaUmphP 
+# VITE_AUTH0_AUDIENCE=stagingapi.brandxtech.ca 
+# VITE_AUTH0_CLIENT_DOMAIN=adaptivestaging.us.auth0.com 
+# VITE_APP_API_URL=https://stagingapi.brandxtech.ca/v1 
+# VITE_APP_WS_URL=ws://stagingapi.brandxtech.ca/v1/live 
+# VITE_APP_AUTH0_CLIENT_DOMAIN=adaptivestaging.us.auth0.com 
+# VITE_APP_AUTH0_AUDIENCE=stagingapi.brandxtech.ca
+
+#Branding (Default theme)
+VITE_APP_WEBSITE_TITLE="Adaptive Dashboard"
+VITE_APP_PRIMARY_COLOUR=blue
+VITE_APP_SECONDARY_COLOUR=blueGrey
+VITE_APP_SIGNATURE_COLOUR="#323232"

.gitlab-ci.yml

@@ -97,7 +97,7 @@ deploy:production:
     - ssh -o StrictHostKeyChecking=no ${DEPLOY_TARGET}
   script:
     - docker login -u ${CI_REGISTRY_USER} -p ${CI_JOB_TOKEN} ${CI_REGISTRY}
-    - docker stack deploy --with-registry-auth -c docker-compose.yml webui
+    - docker stack deploy --with-registry-auth -c docker-compose.prod.yml webui
   when: manual
   allow_failure: false
 
@@ -107,8 +107,8 @@ dependencies:staging:
   only:
     refs:
       - staging_environment
-  before_script:
-    - npm -g config set user root
+  # before_script:
+  #   - npm -g config set user root
   script:
     - npm ci
   cache:
@@ -122,17 +122,17 @@ dependencies:staging:
     paths:
       - node_modules/
 
-test:staging:
-  image: node:$NODE_VERSION
-  stage: setup
-  dependencies:
-    - dependencies:staging
-  only:
-    - staging_environment
-  before_script:
-    - npm run lint
-  script:
-    - CI=true npm run test
+# test:staging:
+#   image: node:$NODE_VERSION
+#   stage: setup
+#   dependencies:
+#     - dependencies:staging
+#   only:
+#     - staging_environment
+#   before_script:
+#     - npm run lint
+#   script:
+#     - CI=true npm run test
 
 setup:staging:
   image: node:$NODE_VERSION
@@ -205,7 +205,7 @@ staging:deploy:
   before_script: &staging_tunnel
     - "apk --update add openssh-client"
     - "eval $(ssh-agent -s)"
-    - "echo \"$STAGING_SSH_PRIV_KEY\" | tr -d '\r' | ssh-add - > /dev/null"
+    - "echo \"$STAGING_SSH_PRIV_KEY\" | tr -d '\r' | ssh-add - "
     # - "ssh -Mo StrictHostKeyChecking=no -S deploy-ctrl-socket -fnNTL /var/run/docker.sock:/var/run/docker.sock ${DEPLOY_TARGET}"
     # - "ssh -S deploy-ctrl-socket -O check ${DEPLOY_TARGET}" 
     - mkdir -p ~/.ssh

docker-compose.prod.yml

@@ -0,0 +1,33 @@
+version: "3.6"
+
+services:
+  webui:
+    image: ${DEPLOY_IMAGE}
+    networks:
+      - backend
+    stop_signal: SIGQUIT
+    deploy:
+      update_config:
+        order: start-first
+    healthcheck:
+      test: ["CMD", "curl", "localhost:8080/health"]
+      interval: 1m
+      timeout: 10s
+      retries: 3
+      start_period: 30s
+    labels:
+      com.datadoghq.ad.logs: '[{"source": "nginx", "service": "webui"}]'
+      traefik.docker.network: "backend"
+      traefik.enable: "true"
+      traefik.http.routers.webui.rule: "Host(`dashboard.adaptiveagriculture.ca`)"
+      traefik.frontend.redirect.regex: "^https?://dashboard.adaptiveagriculture.ca/(.*)"
+      traefik.frontend.redirect.replacement: "https://dashboard.adaptiveagriculture.ca/$${1}"
+      traefik.backend: "www"
+      traefik.http.services.webui.loadbalancer.server.port: "80"
+      traefik.protocol: "http"
+    dns:
+      - 69.27.101.6
+
+networks:
+  backend:
+    external: true

docker-compose.staging.yml

@@ -0,0 +1,33 @@
+version: "3.6"
+
+services:
+  webui:
+    image: ${DEPLOY_IMAGE}
+    networks:
+      - backend
+    stop_signal: SIGQUIT
+    deploy:
+      update_config:
+        order: start-first
+    healthcheck:
+      test: ["CMD", "curl", "localhost:8080/health"]
+      interval: 1m
+      timeout: 10s
+      retries: 3
+      start_period: 30s
+    labels:
+      com.datadoghq.ad.logs: '[{"source": "nginx", "service": "webui"}]'
+      traefik.docker.network: "backend"
+      traefik.enable: "true"
+      traefik.http.routers.webui.rule: "Host(`staging.brandxtech.ca`)"
+      traefik.frontend.redirect.regex: "^https?://staging.brandxtech.ca/(.*)"
+      traefik.frontend.redirect.replacement: "https://staging.brandxtech.ca/$${1}"
+      traefik.backend: "www"
+      traefik.http.services.webui.loadbalancer.server.port: "80"
+      traefik.protocol: "http"
+    dns:
+      - 69.27.101.6
+
+networks:
+  backend:
+    external: true

package.json

@@ -6,13 +6,13 @@
   "scripts": {
     "start": "vite",
     "start-local": "VITE_AUTH0_AUDIENCE=bxt-dev.api.adaptiveagriculture.ca VITE_APP_API_URL=http://localhost:50052/v1 VITE_APP_WS_URL=ws://localhost:50052/v1/live VITE_APP_BILLING_URL=http://localhost:50053/v1 VITE_APP_RECLUSE_URL=http://localhost:50054/v1 VITE_APP_GITLAB_URL=http://localhost:50055/v1 vite",
-    "start-dev": "VITE_APP_API_URL=https://bxt-dev.api.adaptiveagriculture.ca/v1 VITE_AUTH0_CLIENT_DOMAIN=brandxtech.auth0.com VITE_AUTH0_AUDIENCE=bxt-dev.api.adaptiveagriculture.ca VITE_AUTH0_DEV_CLIENT_ID=dzJTpqIeMA4Rwk4xujtwPbAO3TY32bM1 vite",
-    "start-staging": "VITE_APP_API_URL=https://stagingapi.brandxtech.ca/v1 VITE_APP_WS_URL=ws://stagingapi.brandxtech.ca/v1/live VITE_APP_AUTH0_CLIENT_DOMAIN=adaptivestaging.us.auth0.com VITE_APP_AUTH0_AUDIENCE=stagingapi.brandxtech.ca vite",
+    "start-dev": "VITE_AUTH0_CLIENT_ID=dzJTpqIeMA4Rwk4xujtwPbAO3TY32bM1 VITE_APP_API_URL=https://bxt-dev.api.adaptiveagriculture.ca/v1 VITE_AUTH0_CLIENT_DOMAIN=brandxtech.auth0.com VITE_AUTH0_AUDIENCE=bxt-dev.api.adaptiveagriculture.ca VITE_AUTH0_DEV_CLIENT_ID=dzJTpqIeMA4Rwk4xujtwPbAO3TY32bM1 vite",
+    "start-staging": "VITE_AUTH0_CLIENT_ID=3ib460VvLwdeyse5iUSQfxkVdQaUmphP VITE_AUTH0_AUDIENCE=stagingapi.brandxtech.ca VITE_AUTH0_CLIENT_DOMAIN=adaptivestaging.us.auth0.com VITE_APP_API_URL=https://stagingapi.brandxtech.ca/v1 VITE_APP_WS_URL=ws://stagingapi.brandxtech.ca/v1/live VITE_APP_AUTH0_CLIENT_DOMAIN=adaptivestaging.us.auth0.com VITE_APP_AUTH0_AUDIENCE=stagingapi.brandxtech.ca vite",
     "build": "tsc -b && vite build",
     "lint": "eslint .",
     "preview": "vite preview",
-    "build:staging": "NODE_OPTIONS=--max_old_space_size=4096 VITE_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} VITE_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_STAGING} VITE_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} VITE_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} VITE_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} VITE_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} VITE_APP_CNHI_SCOPES=${CNHI_SCOPES} VITE_APP_CNHI_CONNECTION=${CNHI_CONNECTION} VITE_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} VITE_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} VITE_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} VITE_APP_JD_CLIENT_ID=${JD_CLIENT_ID} VITE_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} VITE_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} VITE_APP_JD_SCOPES=${JD_SCOPES} VITE_APP_JD_STATE=${JD_STATE} vite build",
-    "build:development": "VITE_AUTH0_AUDIENCE=bxt-dev.api.adaptiveagriculture.ca VITE_APP_API_URL=https://bxt-dev.api.adaptiveagriculture.ca/v1 NODE_OPTIONS=--max_old_space_size=4096 VITE_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} VITE_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_DEVELOPMENT} VITE_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} VITE_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} VITE_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} VITE_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} VITE_APP_CNHI_SCOPES=${CNHI_SCOPES} VITE_APP_CNHI_CONNECTION=${CNHI_CONNECTION} VITE_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} VITE_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} VITE_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} VITE_APP_JD_CLIENT_ID=${JD_CLIENT_ID} VITE_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} VITE_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} VITE_APP_JD_SCOPES=${JD_SCOPES} VITE_APP_JD_STATE=${JD_STATE} vite build",
+    "build:staging": "VITE_AUTH0_CLIENT_DOMAIN=adaptivestaging.us.auth0.com VITE_AUTH0_AUDIENCE=stagingapi.brandxtech.ca VITE_AUTH0_CLIENT_ID=3ib460VvLwdeyse5iUSQfxkVdQaUmphP VITE_APP_API_URL=https://stagingapi.brandxtech.ca/v1 VITE_APP_WS_URL=wss://stagingapi.brandxtech.ca/v1/live NODE_OPTIONS=--max_old_space_size=4096 VITE_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} VITE_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_STAGING} VITE_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} VITE_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} VITE_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} VITE_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} VITE_APP_CNHI_SCOPES=${CNHI_SCOPES} VITE_APP_CNHI_CONNECTION=${CNHI_CONNECTION} VITE_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} VITE_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} VITE_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} VITE_APP_JD_CLIENT_ID=${JD_CLIENT_ID} VITE_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} VITE_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} VITE_APP_JD_SCOPES=${JD_SCOPES} VITE_APP_JD_STATE=${JD_STATE} vite build",
+    "build:development": "VITE_AUTH0_CLIENT_ID=dzJTpqIeMA4Rwk4xujtwPbAO3TY32bM1 VITE_AUTH0_AUDIENCE=bxt-dev.api.adaptiveagriculture.ca VITE_APP_API_URL=https://bxt-dev.api.adaptiveagriculture.ca/v1 NODE_OPTIONS=--max_old_space_size=4096 VITE_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} VITE_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_DEVELOPMENT} VITE_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} VITE_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} VITE_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} VITE_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} VITE_APP_CNHI_SCOPES=${CNHI_SCOPES} VITE_APP_CNHI_CONNECTION=${CNHI_CONNECTION} VITE_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} VITE_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} VITE_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} VITE_APP_JD_CLIENT_ID=${JD_CLIENT_ID} VITE_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} VITE_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} VITE_APP_JD_SCOPES=${JD_SCOPES} VITE_APP_JD_STATE=${JD_STATE} vite build",
     "build:production": "NODE_OPTIONS=--max_old_space_size=4096 VITE_APP_GOOGLE_API_KEY=${GOOGLE_API_KEY} VITE_APP_STRIPE_PUBLIC_KEY=${STRIPE_PUBLIC_KEY_PRODUCTION} VITE_APP_MAPBOX_ACCESS_TOKEN=${MAPBOX_ACCESS_TOKEN} VITE_APP_CNHI_CLIENT_ID=${CNHI_CLIENT_ID} VITE_APP_CNHI_AUTHORIZE_URL=${CNHI_AUTHORIZE_URL} VITE_APP_CNHI_REDIRECT_URI=${CNHI_REDIRECT_URI} VITE_APP_CNHI_SCOPES=${CNHI_SCOPES} VITE_APP_CNHI_CONNECTION=${CNHI_CONNECTION} VITE_APP_CNHI_AUDIENCE=${CNHI_AUDIENCE} VITE_APP_IMAGE4IO_USERNAME=${IMAGE4IO_USERNAME} VITE_APP_IMAGE4IO_PASSWORD=${IMAGE4IO_PASSWORD} VITE_APP_JD_CLIENT_ID=${JD_CLIENT_ID} VITE_APP_JD_AUTHORIZE_URL=${JD_AUTHORIZE_URL} VITE_APP_JD_REDIRECT_URI=${JD_REDIRECT_URI} VITE_APP_JD_SCOPES=${JD_SCOPES} VITE_APP_JD_STATE=${JD_STATE} vite build",
     "build:offline": "npx env-cmd offline,whitelabel npm run build",
     "test": "vitest"

public/AdaptiveDashboard/browserconfig.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <TileColor>#ffffff</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

public/AdaptiveDashboard/manifest.json

@@ -0,0 +1,26 @@
+{
+  "name": "Brand X Technologies",
+  "short_name": "BXT",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "48x48",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "start_url": "/",
+  "theme_color": "#272727",
+  "background_color": "#424242",
+  "display": "standalone",
+  "orientation": "any"
+}

src/app/App.tsx

@@ -5,13 +5,11 @@ import HTTPProvider from 'providers/http'
 import { useState } from 'react'
 import LoadingScreen from './LoadingScreen'
 import UserWrapper from './UserWrapper'
-import { CssBaseline } from '@mui/material'
 import { getWhitelabel } from 'services/whiteLabel'
 import { AppThemeProvider } from 'theme/AppThemeProvider'
 
 function App() {
   const [token, setToken] = useState<string | undefined>(undefined)
-  // const [palette, setPalette] = useState<Theme>(CreateTheme(getThemeType()));
 
   const whiteLabel = getWhitelabel()
   const manifestPath = "/" + whiteLabel.name.replace(/\s/g, "") + "/manifest.json"
@@ -42,12 +40,9 @@ function App() {
   let domain: string | undefined = import.meta.env.VITE_AUTH0_CLIENT_DOMAIN;
   let audience: string | undefined = import.meta.env.VITE_AUTH0_AUDIENCE;
 
-  let client_id = import.meta.env.VITE_AUTH0_DEV_CLIENT_ID;
-
-  console.log("Domain: " + domain)
-  console.log("Audience: " + audience)
-  console.log("Client ID: " + client_id)
-  console.log("API URL: " + import.meta.env.VITE_APP_API_URL)
+  // let client_id = whiteLabel.auth0ClientId
+  let client_id = import.meta.env.VITE_AUTH0_CLIENT_ID;
+  // if (!client_id) client_id = import.meta.env.VITE_AUTH0_CLIENT_ID;
 
   return (
     <AppThemeProvider>

src/app/Header.tsx

@@ -11,11 +11,12 @@ import SideNavigator from "navigation/SideNavigator";
 import { useState } from "react";
 import BottomNavigator from "navigation/BottomNavigator";
 
-const useStyles = makeStyles((theme: Theme) => ({
+const useStyles = makeStyles((theme: Theme) => {
+  return ({
     appBar: {
 			zIndex: theme.zIndex.drawer + 1,
 			backgroundImage: "none", // This prevents de-saturation of header in dark mode
-        backgroundColor: "#272727"
+			backgroundColor: theme.palette.mode === "light" ? "#3b3b3b" : "#272727"
 		},
 		toolbar: {
 			marginLeft: theme.spacing(0.5),
@@ -74,8 +75,9 @@ const useStyles = makeStyles((theme: Theme) => ({
 				marginLeft: theme.spacing(3),
 				marginRight: theme.spacing(2)
 			}
-    },
-}));
+		}
+  })
+});
 
 export default function Header() {
 

src/app/UserWrapper.tsx

@@ -22,16 +22,16 @@ const reducer = (state: GlobalState, action: GlobalStateAction): GlobalState =>
 
 const useStyles = makeStyles((theme: Theme) => ({
   appContent: {
-    marginTop: 56,
-    marginBottom: 56,
-    marginLeft: "0px",
+    paddingTop: 56,
+    paddingBottom: 56,
+    paddingLeft: "0px",
     [theme.breakpoints.up("sm")]: {
-      marginTop: 64,
-      marginBottom: 0
+      paddingTop: 64,
+      paddingBottom: 0,
     },
     [theme.breakpoints.up("md")]: {
-      marginLeft: theme.spacing(9)
-    }
+      paddingLeft: theme.spacing(9)
+    },
   },
   container: {
     backgroundColor: theme.palette.background.default,

src/navigation/Router.tsx

@@ -329,10 +329,6 @@ export default function Router() {
 
           <Route path="/logout" element={<Logout />} />
           <Route path="grainbags/:bagID" element={<GrainBag />} />
-  {/* 
-          <ErrorBoundary FallbackComponent={ErrorFallback}>
-            <Route path="*" element={<RelativeRoutes/>} />
-          </ErrorBoundary> */}
 
           <Route path="*" element={<RelativeRoutes/>} />
           

src/services/whiteLabel.ts

@@ -70,12 +70,12 @@ interface WhiteLabel {
 // };
 
 const STAGING_WHITELABEL: WhiteLabel = {
-  name: import.meta.env.REACT_APP_WEBSITE_TITLE,
-  primaryColour: import.meta.env.REACT_APP_PRIMARY_COLOUR,
-  secondaryColour: import.meta.env.REACT_APP_SECONDARY_COLOUR,
-  signatureColour: import.meta.env.REACT_APP_SIGNATURE_COLOUR,
+  name: import.meta.env.VITE_APP_WEBSITE_TITLE,
+  primaryColour: import.meta.env.VITE_APP_PRIMARY_COLOUR,
+  secondaryColour: import.meta.env.VITE_APP_SECONDARY_COLOUR,
+  signatureColour: import.meta.env.VITE_APP_SIGNATURE_COLOUR,
   signatureAccentColour: "#fff",
-  auth0ClientId: import.meta.env.REACT_APP_AUTH0_STAGING_CLIENT_ID,
+  auth0ClientId: import.meta.env.VITE_AUTH0_STAGING_CLIENT_ID,
   redirectOnLogout: false,
   logoutRedirectTarget: "",
   darkLogo: DefaultDarkLogo,
@@ -259,7 +259,7 @@ const whitelabels = new Map<string, WhiteLabel>([
   ["brandxducks", BXT_WHITE_LABEL],
   ["brandxtech", BXT_WHITE_LABEL],
   ["aerogrowmanufacturing", AEROGROW_WHITE_LABEL],
-  ["localhost", BXT_WHITE_LABEL],
+  ["localhost", STAGING_WHITELABEL],
   ["staging", STAGING_WHITELABEL],
   ["10.0", ADAPTIVE_CONSTRUCTION_WHITE_LABEL],
   ["mivent", MIVENT_WHITE_LABEL],
@@ -276,6 +276,9 @@ export function getWhitelabel(): WhiteLabel {
   if (window.location.origin.includes("bxt-dev")) {
     return BXT_WHITE_LABEL;
   }
+  if (window.location.origin.includes("staging")) {
+    return STAGING_WHITELABEL;
+  }
   const whiteLabelKeys = Array.from(whitelabels.keys());
   for (var i = 0; i < whiteLabelKeys.length; i++) {
     let key = whiteLabelKeys[i];