Deploy test

.babelrc

@@ -0,0 +1,5 @@
+{
+  "plugins": [
+    "relay"
+  ]
+}

.env.example

@@ -1,62 +1,62 @@
-REACT_APP_DISCLAIMER_VERSION=MadMess-V3
-REACT_APP_GRAPHQL_ENDPOINT=..../graphql
-REACT_APP_GRAPHQL_API_KEY=$##@!
-REACT_APP_RESOLUTION=0.2
-REACT_APP_GRID_ID=NZ_0_2_NB_1_1
-REACT_APP_HAZARD_MODEL=SLT_v7_gmm_v1
-
-REACT_APP_MAP_IMTS=PGA,SA(0.1),SA(0.5),SA(1.0)
-REACT_APP_MAP_VS30S=250,300,350,400,450,750
-REACT_APP_MAP_STATISTICS=mean
-REACT_APP_MAP_POES=0.1, 0.02
-REACT_APP_MAP_COLOR_SCALE=jet,inferno
-REACT_APP_MAP_ZOOM_MIN=4
-REACT_APP_MAP_ZOOM_MAX=8
-REACT_APP_MAP_ZOOM_SNAP=0.5
-REACT_APP_MAP_ZOOM_DELTA=0.5
-REACT_APP_MAP_STROKE_WIDTH=0.1
-REACT_APP_MAP_VMAX=auto
+VITE_DISCLAIMER_VERSION=MadMess-V3
+VITE_GRAPHQL_ENDPOINT=..../graphql
+VITE_GRAPHQL_API_KEY=$##@!
+VITE_RESOLUTION=0.2
+VITE_GRID_ID=NZ_0_2_NB_1_1
+VITE_HAZARD_MODEL=SLT_v7_gmm_v1
+
+VITE_MAP_IMTS=PGA,SA(0.1),SA(0.5),SA(1.0)
+VITE_MAP_VS30S=250,300,350,400,450,750
+VITE_MAP_STATISTICS=mean
+VITE_MAP_POES=0.1, 0.02
+VITE_MAP_COLOR_SCALE=jet,inferno
+VITE_MAP_ZOOM_MIN=4
+VITE_MAP_ZOOM_MAX=8
+VITE_MAP_ZOOM_SNAP=0.5
+VITE_MAP_ZOOM_DELTA=0.5
+VITE_MAP_STROKE_WIDTH=0.1
+VITE_MAP_VMAX=auto
 
 #Hazard chart
-REACT_APP_HAZARD_GMAX=10
-REACT_APP_HAZARD_GMIN=0.01
-REACT_APP_HAZARD_GMAX_LOG=10
-REACT_APP_HAZARD_GMIN_LOG=0.01
-REACT_APP_HAZARD_POEMAX=6
-REACT_APP_HAZARD_POEMIN=0.000001
-REACT_APP_HAZARD_COLOR_MAP=jet
-REACT_APP_HAZARD_COLOR_LIMIT=10
-REACT_APP_HAZARD_COLOR_UNCERTAINTY_OPACITY=0.5
+VITE_HAZARD_GMAX=10
+VITE_HAZARD_GMIN=0.01
+VITE_HAZARD_GMAX_LOG=10
+VITE_HAZARD_GMIN_LOG=0.01
+VITE_HAZARD_POEMAX=6
+VITE_HAZARD_POEMIN=0.000001
+VITE_HAZARD_COLOR_MAP=jet
+VITE_HAZARD_COLOR_LIMIT=10
+VITE_HAZARD_COLOR_UNCERTAINTY_OPACITY=0.5
 
 #Spectral chart
-REACT_APP_SA_PERIODMAX=10
-REACT_APP_SA_PERIODMIN=0.1
-REACT_APP_SA_PERIODMAX_LOG=10
-REACT_APP_SA_PERIODMIN_LOG=0.1
-REACT_APP_SA_GMAX=auto
-REACT_APP_SA_GMIN=0.1
-REACT_APP_SA_LOG_PGA_SUBSTITUTE=0.001
+VITE_SA_PERIODMAX=10
+VITE_SA_PERIODMIN=0.1
+VITE_SA_PERIODMAX_LOG=10
+VITE_SA_PERIODMIN_LOG=0.1
+VITE_SA_GMAX=auto
+VITE_SA_GMIN=0.1
+VITE_SA_LOG_PGA_SUBSTITUTE=0.001
 
 #Hazard & Spectral chart disagg config
-REACT_APP_MEAN=mean
-REACT_APP_UPPER1=0.9
-REACT_APP_UPPER2=0.95
-REACT_APP_LOWER1=0.1
-REACT_APP_LOWER2=0.05
+VITE_MEAN=mean
+VITE_UPPER1=0.9
+VITE_UPPER2=0.95
+VITE_LOWER1=0.1
+VITE_LOWER2=0.05
 
 //Only set this to test when running cypress locally, activates mock service worker. If you want API to run leave it unset.
-REACT_APP_MSW=test
+VITE_MSW=test
 
 #package html-to-image has a bug with source map generation, disabling allows CI to run
 GENERATE_SOURCEMAP=false
 
-REACT_APP_GA_ID=G-XXXXXXXX
-REACT_APP_GA_DEBUG_MODE=false
+VITE_GA_ID=G-XXXXXXXX
+VITE_GA_DEBUG_MODE=false
 
-REACT_APP_SOLVIS_ENDPOINT=https://api.com/
-REACT_APP_SOLVIS_API_KEY=#@$%^
-REACT_APP_ANALYSIS_LOC_LIST_ID=NZ
-REACT_APP_RADII_ID=6
+VITE_SOLVIS_ENDPOINT=https://api.com/
+VITE_SOLVIS_API_KEY=#@$%^
+VITE_ANALYSIS_LOC_LIST_ID=NZ
+VITE_RADII_ID=6
 
-REACT_APP_IFM_FAULT_COLOUR=red
-REACT_APP_IFM_LOCATION_COLOUR=grey
+VITE_IFM_FAULT_COLOUR=red
+VITE_IFM_LOCATION_COLOUR=grey

.eslintrc.cjs

@@ -0,0 +1,20 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:react-hooks/recommended",
+    "plugin:react/recommended",
+    "plugin:prettier/recommended",
+  ],
+  ignorePatterns: ["dist", ".eslintrc.cjs"],
+  parser: "@typescript-eslint/parser",
+  plugins: ["react-refresh"],
+  rules: {
+    "react/jsx-uses-react": "off",
+    "react/react-in-jsx-scope": "off",
+    "react-hooks/rules-of-hooks": "error",
+    "react-hooks/exhaustive-deps": "warn",
+  },
+};

.github/workflows/browser_tests.yml

@@ -15,25 +15,24 @@ jobs:
       - name: create env file
         run: |
           touch .env
-          echo REACT_APP_MSW=test >> .env
-          echo REACT_APP_DISCLAIMER_VERSION=versionOne >> .env
-          echo REACT_APP_GRAPHQL_ENDPOINT=..../graphql >> .env
-          echo REACT_APP_GRAPHQL_API_KEY=$##@! >> .env
+          echo VITE_MSW=test >> .env
+          echo VITE_DISCLAIMER_VERSION=versionOne >> .env
+          echo VITE_GRAPHQL_ENDPOINT=..../graphql >> .env
+          echo VITE_GRAPHQL_API_KEY=$##@! >> .env
           echo GENERATE_SOURCEMAP=false >> .env
           cat .env
       - name: Node Setup
         uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 18
           registry-url: https://npm.pkg.github.com/
           scope: '@gns-science'
       - name: Cypress run
-        uses: cypress-io/github-action@v4
+        uses: cypress-io/github-action@v5
         with:
-          wait-on: 'http://localhost:3000'
+          wait-on: http://localhost:5173
           record: true
-          build: yarn build
-          start: yarn start
+          start: yarn run vite --host
         env:
           NODE_AUTH_TOKEN: ${{ secrets.TOSHI_NEST_PACKAGE_TOKEN }}
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/deploy_prod_to_s3.yml

@@ -12,7 +12,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [16]
+        node-version: [18]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     steps:
@@ -42,50 +42,52 @@ jobs:
           echo "Configure build environment"
           touch .env
           echo "The following settings can be exposed, and are common to PROD and TEST.."
-          echo "REACT_APP_HAZARD_COLOR_LIMIT=12" >> .env
-          echo "REACT_APP_HAZARD_COLOR_MAP=portland" >> .env
-          echo "REACT_APP_HAZARD_COLOR_UNCERTAINTY_OPACITY=0.8" >> .env
-          echo "REACT_APP_MAP_IMTS=PGA,SA(0.1),SA(0.2),SA(0.3),SA(0.4),SA(0.5),SA(0.7),SA(1.0),SA(1.5),SA(2.0),SA(3.0),SA(4.0),SA(5.0),SA(6.0),SA(7.5),SA(10.0)" >> .env
-          echo "REACT_APP_MAP_VS30S=150,175,200,225,250,275,300,350,375,400,450,500,600,750,900,1000,1500" >> .env
-          echo "REACT_APP_MAP_STATISTICS=mean,cov,0.05,0.1,0.2,0.5,0.8,0.9,0.95" >> .env
-          echo "REACT_APP_MAP_POES=0.02,0.025,0.05,0.1,0.18,0.22,0.39,0.40,0.63" >> .env
-          echo "REACT_APP_MAP_COLOR_SCALE=jet,inferno,viridis,plasma,magma,cividis" >> .env
-          echo "REACT_APP_MAP_ZOOM_MIN=2" >> .env
-          echo "REACT_APP_MAP_ZOOM_MAX=12" >> .env
-          echo "REACT_APP_MAP_ZOOM_SNAP=0.5" >> .env
-          echo "REACT_APP_MAP_ZOOM_DELTA=0.5" >> .env
+          echo "VITE_HAZARD_COLOR_LIMIT=12" >> .env
+          echo "VITE_HAZARD_COLOR_MAP=portland" >> .env
+          echo "VITE_HAZARD_COLOR_UNCERTAINTY_OPACITY=0.8" >> .env
+          echo "VITE_MAP_IMTS=PGA,SA(0.1),SA(0.2),SA(0.3),SA(0.4),SA(0.5),SA(0.7),SA(1.0),SA(1.5),SA(2.0),SA(3.0),SA(4.0),SA(5.0),SA(6.0),SA(7.5),SA(10.0)" >> .env
+          echo "VITE_MAP_VS30S=150,175,200,225,250,275,300,350,375,400,450,500,600,750,900,1000,1500" >> .env
+          echo "VITE_MAP_STATISTICS=mean,cov,0.05,0.1,0.2,0.5,0.8,0.9,0.95" >> .env
+          echo "VITE_MAP_POES=0.02,0.025,0.05,0.1,0.18,0.22,0.39,0.40,0.63" >> .env
+          echo "VITE_MAP_COLOR_SCALE=jet,inferno,viridis,plasma,magma,cividis" >> .env
+          echo "VITE_MAP_ZOOM_MIN=2" >> .env
+          echo "VITE_MAP_ZOOM_MAX=12" >> .env
+          echo "VITE_MAP_ZOOM_SNAP=0.5" >> .env
+          echo "VITE_MAP_ZOOM_DELTA=0.5" >> .env
           echo
-          echo "REACT_APP_HAZARD_GMAX=5" >> .env
-          echo "REACT_APP_HAZARD_GMIN=0" >> .env
-          echo "REACT_APP_HAZARD_GMAX_LOG=5" >> .env
-          echo "REACT_APP_HAZARD_GMIN_LOG=0.01" >> .env
-          echo "REACT_APP_HAZARD_POEMAX=1" >> .env
-          echo "REACT_APP_HAZARD_POEMIN=0.000001" >> .env
+          echo "VITE_HAZARD_GMAX=5" >> .env
+          echo "VITE_HAZARD_GMIN=0" >> .env
+          echo "VITE_HAZARD_GMAX_LOG=5" >> .env
+          echo "VITE_HAZARD_GMIN_LOG=0.01" >> .env
+          echo "VITE_HAZARD_POEMAX=1" >> .env
+          echo "VITE_HAZARD_POEMIN=0.000001" >> .env
           echo
-          echo "REACT_APP_SA_PERIODMAX=10" >> .env
-          echo "REACT_APP_SA_PERIODMIN=0" >> .env
-          echo "REACT_APP_SA_PERIODMAX_LOG=10" >> .env
-          echo "REACT_APP_SA_PERIODMIN_LOG=0.03" >> .env
-          echo "REACT_APP_SA_GMAX=auto" >> .env
-          echo "REACT_APP_SA_GMIN=0" >> .env
-          echo "REACT_APP_SA_LOG_PGA_SUBSTITUTE=0.04" >> .env
+          echo "VITE_SA_PERIODMAX=10" >> .env
+          echo "VITE_SA_PERIODMIN=0" >> .env
+          echo "VITE_SA_PERIODMAX_LOG=10" >> .env
+          echo "VITE_SA_PERIODMIN_LOG=0.03" >> .env
+          echo "VITE_SA_GMAX=auto" >> .env
+          echo "VITE_SA_GMIN=0" >> .env
+          echo "VITE_SA_LOG_PGA_SUBSTITUTE=0.04" >> .env
           echo
-          echo "REACT_APP_MEAN=mean" >> .env
-          echo "REACT_APP_UPPER1=0.9" >> .env
-          echo "REACT_APP_UPPER2=0.95" >> .env
-          echo "REACT_APP_LOWER1=0.1" >> .env
-          echo "REACT_APP_LOWER2=0.05" >> .env
+          echo "VITE_MEAN=mean" >> .env
+          echo "VITE_UPPER1=0.9" >> .env
+          echo "VITE_UPPER2=0.95" >> .env
+          echo "VITE_LOWER1=0.1" >> .env
+          echo "VITE_LOWER2=0.05" >> .env
           echo
-          echo "REACT_APP_GA_ID=G-JRRN2P89FB" >> .env
-          echo "REACT_APP_GA_DEBUG_MODE=false" >> .env
+          echo "VITE_GA_ID=G-JRRN2P89FB" >> .env
+          echo "VITE_GA_DEBUG_MODE=false" >> .env
           cat .env
           echo "Now add the secrets.."
-          echo "REACT_APP_DISCLAIMER_VERSION=${{secrets.REACT_APP_DISCLAIMER_VERSION}}" >> .env
-          echo "REACT_APP_GRAPHQL_ENDPOINT=${{secrets.REACT_APP_GRAPHQL_ENDPOINT}}" >> .env
-          echo "REACT_APP_GRAPHQL_API_KEY=${{secrets.REACT_APP_GRAPHQL_API_KEY}}" >> .env
-          echo "REACT_APP_RESOLUTION=${{secrets.REACT_APP_RESOLUTION}}" >> .env
-          echo "REACT_APP_HAZARD_MODEL=${{secrets.REACT_APP_HAZARD_MODEL}}" >> .env
-          echo "REACT_APP_GRID_ID=${{secrets.REACT_APP_GRID_ID}}" >> .env
+          echo "VITE_GRAPHQL_API_KEY=${{secrets.VITE_GRAPHQL_API_KEY}}" >> .env
+          echo "Now add the vars.."
+          echo "VITE_DISCLAIMER_VERSION=${{vars.VITE_DISCLAIMER_VERSION}}" >> .env
+          echo "VITE_GRAPHQL_ENDPOINT=${{vars.VITE_GRAPHQL_ENDPOINT}}" >> .env
+          echo "VITE_RESOLUTION=${{vars.VITE_RESOLUTION}}" >> .env
+          echo "VITE_HAZARD_MODEL=${{vars.VITE_HAZARD_MODEL}}" >> .env
+          echo "VITE_GRID_ID=${{vars.VITE_GRID_ID}}" >> .env
+          echo "VITE_RADII_ID=${{vars.VITE_RADII_ID}}" >> .env
           echo
           yarn build
 
@@ -100,4 +102,4 @@ jobs:
           AWS_REGION: ${{ secrets.AWS_REGION }}
           #The following are set up in AWS_TEST deployment environ
           AWS_S3_BUCKET: ${{ secrets.AWS_S3_BUCKET }}
-          SOURCE_DIR: "build"
+          SOURCE_DIR: "dist"