🤖 Release PR

.circleci/config.yml

@@ -12,8 +12,6 @@ version: 2.1
 #  Orbs - preconfigured environments for running specific jobs
 ######################################################################################################
 
-# node: circleci/node@4.1.0
-# cypress: cypress-io/cypress@1
 orbs:
   # for use with cimg image, to install web browsers
   browser-tools: circleci/browser-tools@1.1.3
@@ -24,9 +22,21 @@ orbs:
 #  Aliases - code snippets that can be included inline in any other markup
 ######################################################################################################
 aliases:
-  # use a base image running node v16 with chrome/firefox browsers preinstalled
+  # use a base image running node v18 with chrome/firefox browsers preinstalled
+  # This can be applied to any job via `docker: *docker` syntax
   - &docker
-    - image: cimg/node:16.13.1-browsers
+    - image: cimg/node:18.13.0-browsers
+
+  # Use base image with support for node version parameter and matrix
+  # This can be applied to any job via `<<: *docker_matrix` syntax
+  - docker_matrix: &docker_matrix
+      parameters:
+        node-version:
+          type: string
+          default: 18.13.0-browsers
+      docker:
+        - image: cimg/node:<< parameters.node-version >>
+
     # These can also be created as commands, but slighly tidier to just use inline
     # restore/install/save can all be done with a single circle-ci orb, but less flexible and breaks intellisense
   - &restore_yarn_cache
@@ -215,7 +225,7 @@ jobs:
             rm package.json
             npm config set package-lock false
             npm i @types/node @commitlint/types @commitlint/config-conventional --force
-            npx commitlint --from=$(git merge-base remotes/origin/${CIRCLE_BRANCH} master) --verbose
+            npx @commitlint/cli@17.4.2 --from=$(git merge-base remotes/origin/${CIRCLE_BRANCH} master) --verbose
   lint:
     docker: *docker
     steps:
@@ -270,13 +280,16 @@ jobs:
           name: Install dependencies
           command: yarn workspaces focus one-army-community-platform
       - run:
-          command: yarn build:components && yarn run test:unit
+          # NOTE - run-in-band to try reduce memory leaks (https://github.com/facebook/jest/issues/7874)
+          command: yarn build:components && yarn run test:unit:ci
   build:
-    docker: *docker
+    <<: *docker_matrix
     environment:
       GENERATE_SOURCEMAP: 'false'
       SKIP_PREFLIGHT_CHECK: 'true'
-    # `medium` is the max allowed size for free builds (helps with out-of-memory issues) - https://circleci.com/docs/2.0/configuration-reference/#resourceclass
+      NODE_OPTIONS: '--max-old-space-size=5632'
+    # If experiencing out-of-memory issues can increase resource_class below and max space size above
+    # https://circleci.com/docs/2.0/configuration-reference/#resourceclass
     resource_class: medium+
     steps:
       # whilst checkout-install could be persisted from previous step, that is less efficient than just using caching
@@ -291,12 +304,11 @@ jobs:
           name: Set branch environment
           command: |
             echo 'export REACT_APP_BRANCH=${CIRCLE_BRANCH}' >> $BASH_ENV
-            echo 'export NODE_OPTIONS=--max-old-space-size=4096' >> $BASH_ENV
             echo 'export REACT_APP_PROJECT_VERSION=${CIRCLE_SHA1}' >> $BASH_ENV
       - run:
           name: Check environment variables
           command: |
-            echo REACT_APP_BRANCH=$REACT_APP_BRANCH NODE_OPTIONS=$NODE_OPTIONS
+            echo REACT_APP_BRANCH=$REACT_APP_BRANCH
             echo $REACT_APP_PROJECT_VERSION
       - run:
           command: yarn build
@@ -306,7 +318,7 @@ jobs:
             - build
   storybook:
     docker: *docker
-    resource_class: medium+
+    resource_class: medium
     steps:
       - setup_repo
       - attach_workspace:
@@ -428,6 +440,17 @@ workflows:
             - 'Lint code'
           name: Build Application
           context: build-context
+      - build:
+          requires:
+            - 'Lint code'
+          # Main build/deploy runs on LTS node, however still check compatibility for local dev work on other versions
+          name: Build Application (Node << matrix.node-version >>)
+          context: build-context
+          matrix:
+            parameters:
+              node-version:
+                - '16.13.1-browsers'
+                - 'current-browsers' # latest version supported https://circleci.com/developer/images/image/cimg/node
       - test_unit:
           name: 'Unit tests'
           requires:

.cspell.json

@@ -31,6 +31,7 @@
     "microservices",
     "mockup",
     "mockups",
+    "nodenv",
     "onearmy",
     "onearmyworld",
     "phonebloks",

.env-cmdrc.js

@@ -0,0 +1,46 @@
+// Run a pre-flight check that developer environment setup in compatible way
+const { envCheck } = require('./scripts/envCheck')
+if (!process.env.CI) {
+  envCheck()
+}
+
+// Specific settings to use when running anything that requires a webpack compiler
+// Enabled when npm command specifies `env-cmd -e webpack`
+let webpack = {
+  NODE_OPTIONS: getNodeOptions(),
+}
+
+// Specific env to use with react-scripts / create-react-app
+// Enabled when npm command specifies `env-cmd -e cra`
+let cra = {
+  ...webpack,
+  FAST_REFRESH: false,
+}
+
+exports.cra = cra
+exports.webpack = webpack
+
+/** Determine what node_options to provide depending on context */
+function getNodeOptions() {
+  // Depending on node version use different environment variables to fix
+  // specific build or run issues
+  const NODE_VERSION = process.versions.node.split('.')[0]
+
+  let NODE_OPTIONS = process.env.NODE_OPTIONS || ''
+
+  // fix out-of-memory issues - default to 4GB but allow override from CI
+  // NOTE - would like to auto-calculate but does not support CI (https://github.com/nodejs/node/issues/27170)
+  if (!NODE_OPTIONS.includes('--max-old-space-size')) {
+    NODE_OPTIONS += ` --max-old-space-size=4096`
+  }
+  if (NODE_VERSION > '17') {
+    // fix https://github.com/facebook/create-react-app/issues/11708
+    // https://github.com/facebook/create-react-app/issues/12431
+    NODE_OPTIONS += ' --openssl-legacy-provider --no-experimental-fetch'
+  }
+
+  if (process.env.CI) {
+    console.log('NODE_OPTIONS', NODE_OPTIONS, '\n')
+  }
+  return NODE_OPTIONS.trim()
+}

.eslintrc.json

@@ -5,7 +5,8 @@
     "@typescript-eslint",
     "prettier",
     "unicorn",
-    "sort-class-members"
+    "sort-class-members",
+    "jest"
   ],
   "extends": [
     "plugin:react/recommended", // Uses the recommended rules from @eslint-plugin-react
@@ -55,6 +56,7 @@
         "prefer": "type-imports"
       }
     ],
+    "jest/no-focused-tests": "error",
     "@typescript-eslint/explicit-function-return-type": "off",
     "@typescript-eslint/explicit-module-boundary-types": "off",
     "@typescript-eslint/interface-name-prefix": "off",

.github/workflows/pr-preview.yml

@@ -27,9 +27,9 @@ jobs:
         with:
           # pull the repo from the pull request source, not the default local repo
           ref: ${{ github.event.pull_request.head.sha }}
-      - uses: actions/setup-node@v2
+      - uses: actions/setup-node@v3
         with:
-          node-version: '16'
+          node-version: '18'
       - name: Get yarn cache directory path
         id: yarn-cache-dir-path
         run: echo "::set-output name=dir::$(yarn config get cacheFolder)"

.github/workflows/reset-staging-site.yml

@@ -4,7 +4,7 @@ name: Reset Staging Site
 on:
   # Run weekly on a Sunday at 02:00
   schedule:
-    - cron: "0 0 * * SUN"
+    - cron: '0 0 * * SUN'
   # Allow the script to be triggered directly from GitHub
   workflow_dispatch:
 jobs:
@@ -16,7 +16,7 @@ jobs:
       - uses: actions/checkout@v1
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 18
       - name: Set up Cloud SDK
         uses:
           google-github-actions/setup-gcloud@master

.gitignore

@@ -32,7 +32,6 @@ yarn-error.log*
 # IntelliJ
 /.idea
 functions/firebase-debug.log
-.env-*
 
 # https://yarnpkg.com/getting-started/qa#which-files-should-be-gitignored
 .yarn/*

.gitpod.yml

@@ -1,4 +1,4 @@
-image: node:16
+image: node:18
 tasks:
   - init: yarn install && yarn run build
     command: yarn run start
@@ -10,4 +10,4 @@ ports:
 
 github:
   prebuilds:
-    branches: true  
+    branches: true

.node-version

@@ -1 +1 @@
-16.13.1
+18.13.0

.nvmrc

@@ -0,0 +1 @@
+18

CONTRIBUTING.md

@@ -45,7 +45,7 @@ You can find useful links to learn more about these technologies [in the resourc
 
 **Prerequisites**
 
-- [Node.js v16](https://nodejs.org/en/download/)
+- [Node.js v18](https://nodejs.org/en/download/)
 - [Yarn v3](https://yarnpkg.com/getting-started/install)
 
 With the above tools available, you are ready:

commitlint.config.ts

@@ -1,7 +1,7 @@
 import type { UserConfig } from '@commitlint/types'
 import path from 'path'
 
-const Configuration: UserConfig = {
+export const Configuration: UserConfig = {
   extends: ['@commitlint/config-conventional'],
   /** Add optional custom formatter */
   formatter: path.resolve(__dirname, 'commitlint.format.ts'),

commitlint.format.ts

@@ -1,7 +1,7 @@
 import type { Formatter, FormattableReport } from '@commitlint/types'
 
 // Custom formatter for commitlint message
-const formatter: Formatter = function (report, options) {
+export const formatter: Formatter = function (report, options) {
   const { results, valid } = report as IFormatReport
   if (results && !valid) {
     console.log('\nCommit needs to be formatted as conventional commit')

craco.config.ts

@@ -0,0 +1,68 @@
+import type { WebpackConfigOverride } from '@craco/types'
+import { DefinePlugin, ProvidePlugin } from 'webpack'
+import type { RuleSetRule } from 'webpack'
+
+/**
+ * Craco is used to provide config overrides to the default webpack config that is called
+ * from react-scripts.
+ */
+module.exports = {
+  webpack: {
+    configure: (webpackConfig: WebpackConfigOverride['webpackConfig']) => {
+      // Add polyfills for node (mostly imports for pino-logflare)
+      // https://github.com/facebook/create-react-app/issues/11756
+      // https://stackoverflow.com/questions/68707553/uncaught-referenceerror-buffer-is-not-defined
+      webpackConfig.resolve!.fallback = {
+        stream: require.resolve('stream-browserify'),
+        buffer: require.resolve('buffer'),
+      }
+      webpackConfig.module!.rules = hackUpdateRulesToSupportCJS(
+        webpackConfig.module!.rules as RuleSetRule[],
+      )
+      webpackConfig.plugins = [
+        ...(webpackConfig.plugins as any[]),
+        // Fix calls to process (pino-logflare and cypress calling db.ts outside of cra)
+        // NOTE - react creates 'process.env' variable but does not assign anything to 'process'
+        // https://github.com/facebook/create-react-app/issues/11951
+        new DefinePlugin({
+          process: {},
+        }),
+        new ProvidePlugin({
+          Buffer: ['buffer', 'Buffer'],
+        }),
+      ]
+      // Fix sourcemap warning
+      // https://github.com/facebook/create-react-app/discussions/11767
+      webpackConfig.ignoreWarnings = [
+        function ignoreSourcemapsloaderWarnings(warning) {
+          return (
+            warning.module &&
+            (warning.module as any).resource.includes('node_modules') &&
+            warning.details &&
+            warning.details.includes('source-map-loader')
+          )
+        },
+      ]
+      return webpackConfig
+    },
+  },
+}
+
+/**
+ * Prepend a custom rule to support CJS files
+ *
+ * NOTE - should be resolved in future CRA release pending merge of
+ * https://github.com/facebook/create-react-app/pull/12021
+ */
+const hackUpdateRulesToSupportCJS = (rules: RuleSetRule[]) => {
+  return rules.map((rule) => {
+    if (rule.oneOf instanceof Array) {
+      rule.oneOf[rule.oneOf.length - 1].exclude = [
+        /\.(js|mjs|jsx|cjs|ts|tsx)$/,
+        /\.html$/,
+        /\.json$/,
+      ]
+    }
+    return rule
+  })
+}