Merge pull request #242 from CivicActions/gatsby-5-upgrade

Upgrade Application to Gatsby 5

.eslintrc

@@ -0,0 +1 @@
+{}

.github/workflows/firebase-deploy-live.yml

@@ -17,32 +17,27 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v2
-      - name: Yarn cache directory
-        id: yarn-cache-dir
-        run: echo "::set-output name=dir::$(yarn cache dir)"
-      - name: Gatsby Cache Folder
-        uses: actions/cache@v1
+      - uses: actions/setup-node@v3
         with:
-          key: gatsby-cache-folder
-          path: .cache
-      - name: Gatsby Public Folder
-        uses: actions/cache@v1
+          node-version: 18
+          cache: 'yarn'
+      - name: Caching Gatsby
+        id: gatsby-cache-build
+        uses: actions/cache@v2
         with:
-          key: gatsby-public-folder
-          path: public
-      - name: Yarn cache
-        uses: actions/cache@v1
-        with:
-          path: ${{ steps.yarn-cache-dir.outputs.dir }}
-          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          path: |
+            public
+            .cache
+          key: ${{ runner.os }}-gatsby-build-${{ github.run_id }}
           restore-keys: |
-            ${{ runner.os }}-yarn-
+            ${{ runner.os }}-gatsby-build-
       - name: Yarn install
         run: 'yarn install --frozen-lockfile'
       - name: Build
         run: yarn build
         env:
-          NODE_OPTIONS: '--max-old-space-size=4096 --openssl-legacy-provider'
+          STRAPI_API_URL: '${{ secrets.STRAPI_API_URL }}'
+          STRAPI_TOKEN: '${{ secrets.STRAPI_TOKEN }}'
       - uses: FirebaseExtended/action-hosting-deploy@v0
         with:
           repoToken: '${{ secrets.GITHUB_TOKEN }}'

.github/workflows/firebase-hosting-pull-request.yml

@@ -9,32 +9,27 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v2
-      - name: Yarn cache directory
-        id: yarn-cache-dir
-        run: echo "::set-output name=dir::$(yarn cache dir)"
-      - name: Gatsby Cache Folder
-        uses: actions/cache@v1
+      - uses: actions/setup-node@v3
         with:
-          key: gatsby-cache-folder
-          path: .cache
-      - name: Gatsby Public Folder
-        uses: actions/cache@v1
+          node-version: 18
+          cache: 'yarn'
+      - name: Caching Gatsby
+        id: gatsby-cache-build
+        uses: actions/cache@v2
         with:
-          key: gatsby-public-folder
-          path: public
-      - name: Yarn cache
-        uses: actions/cache@v1
-        with:
-          path: ${{ steps.yarn-cache-dir.outputs.dir }}
-          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          path: |
+            public
+            .cache
+          key: ${{ runner.os }}-gatsby-build-${{ github.run_id }}
           restore-keys: |
-            ${{ runner.os }}-yarn-
+            ${{ runner.os }}-gatsby-build-
       - name: Yarn install
         run: 'yarn install --frozen-lockfile'
       - name: Build
         run: yarn build
         env:
-          NODE_OPTIONS: '--max-old-space-size=4096 --openssl-legacy-provider'
+          STRAPI_API_URL: '${{ secrets.STRAPI_API_URL }}'
+          STRAPI_TOKEN: '${{ secrets.STRAPI_TOKEN }}'
       - uses: FirebaseExtended/action-hosting-deploy@v0
         with:
           repoToken: '${{ secrets.GITHUB_TOKEN }}'

.prettierignore

@@ -0,0 +1,4 @@
+.cache
+package.json
+package-lock.json
+public

.stylelintrc.json → .stylelintrc

@@ -5,7 +5,6 @@
     "stylelint-declaration-use-variable"
   ],
   "rules": {
-    "order/properties-alphabetical-order": null,
     "max-nesting-depth": 2,
     "selector-class-pattern": null,
     "scss/percent-placeholder-pattern": null,

gatsby-browser.js

@@ -1,5 +1,21 @@
+/**
+ * Implement Gatsby's Browser APIs in this file.
+ *
+ * See: https://www.gatsbyjs.com/docs/reference/config-files/gatsby-browser/
+ */
+import React from 'react'
+import { HubspotProvider } from '@aaronhayes/react-use-hubspot-form'
+
 export const onClientEntry = async () => {
   if (typeof IntersectionObserver === "undefined") {
-    await import("intersection-observer");
+    await import("intersection-observer")
   }
-};
+}
+
+// Gatsby's method of wrapping the root react element (app.js)
+// HubspotProvider context is required for @aaronhayes/react-use-hubspot-form to work on the /contact page
+export const wrapRootElement = ({ element }) => (
+  <HubspotProvider>
+    {element}
+  </HubspotProvider>
+)