merge main into dev

.github/workflows/master-deploy.yml

@@ -12,7 +12,7 @@ jobs:
     permissions: write-all
     strategy:
       matrix:
-        node-version: [10.x]
+        node-version: [16.x]
 
     steps:
       - name: Checkout 🛎️

README.md

@@ -69,7 +69,7 @@ Explain the different ways people can contribute. For example:
 - Join the team 
      on Slack channel and at our biweekly Monday hack night in person or teleconference (start at 6pm).
 - To help with user research, sync with Apurva.
-- To provide design support, sync with Gretchen.
+- To provide design support, sync with Anita or Serena.
 - To contribute to the code, sync with Daniel.
 
 

products/statement-generator/package.json

@@ -3,13 +3,15 @@
   "version": "0.8.0",
   "homepage": "./",
   "private": true,
+  "engines": {
+    "npm": ">=8.0.0",
+    "node": ">=16.0.0"
+  },
   "dependencies": {
     "@material-ui/core": "^4.11.2",
     "@material-ui/icons": "^4.11.2",
-    "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
-    "@types/jest": "^26.0.15",
     "@types/jspdf": "^1.3.3",
     "@types/node": "^12.0.0",
     "@types/react": "^16.9.56",
@@ -18,13 +20,13 @@
     "gh-pages": "^3.1.0",
     "i18next": "^20.1.0",
     "i18next-browser-languagedetector": "^6.1.0",
-    "i18next-http-backend": "^1.2.1",
-    "jspdf": "^2.1.1",
+    "i18next-http-backend": "^1.4.5",
+    "jspdf": "^2.3.1",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-i18next": "^11.8.12",
     "react-router-dom": "^5.2.0",
-    "react-scripts": "4.0.0",
+    "react-scripts": "5.0.1",
     "typescript": "^4.0.3",
     "web-vitals": "^0.2.4"
   },
@@ -39,8 +41,7 @@
   },
   "eslintConfig": {
     "extends": [
-      "react-app",
-      "react-app/jest"
+      "react-app"
     ]
   },
   "browserslist": {

products/statement-generator/src/components-layout/FlowNavigation.tsx

@@ -1,4 +1,4 @@
-import React, { useContext } from 'react';
+import React, { useCallback, useContext } from 'react';
 import { makeStyles, createStyles } from '@material-ui/core';
 
 import FormStateContext from 'contexts/FormStateContext';
@@ -43,21 +43,21 @@ export default function FlowNavigation({
   const backBtnTheme =
     appTheme === 'dark' ? 'transparent-on-dark' : 'transparent-on-light';
 
-  function handleBack() {
+  const handleBack = useCallback(() => {
     if (onBack) {
       onBack();
     } else {
       goBackStep();
     }
-  }
+  }, []);
 
-  function handleNext() {
+  const handleNext = useCallback(() => {
     if (onNext) {
       onNext();
     } else {
       goNextStep();
     }
-  }
+  }, []);
 
   return (
     <div className={utilityClasses.buttonContainer}>

products/statement-generator/src/pages/PreviewPage.tsx

@@ -1,4 +1,4 @@
-import React, { useContext, useEffect } from 'react';
+import React, { useCallback, useContext, useEffect } from 'react';
 
 import TextPreview from 'components/TextPreview';
 import ContentContainer from 'components-layout/ContentContainer';
@@ -16,7 +16,7 @@ function PreviewPage() {
   const previewConfigItem = getPreviewConfig(currentStep);
   const hasPreviewConfig = previewConfigItem !== undefined;
 
-  function updateStatement(newStatement: string) {
+  const updateStatement = useCallback((newStatement: string) => {
     if (hasPreviewConfig) {
       updateStepToForm({
         statements: {
@@ -25,7 +25,7 @@ function PreviewPage() {
         },
       });
     }
-  }
+  }, []);
 
   // hacky implementation to generate the heading & closing statement here
   //  because it does not have a unique page to be generated via a preview