Add a debug tool to help clear local storage when it is incompatible …

…with the current version.

apps/cli/tsconfig.json

@@ -1,6 +1,7 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
+    "module": "CommonJS",
     "outDir": "./dist",
     "emitDeclarationOnly": true
   },

apps/spotlight/package.json

@@ -19,7 +19,8 @@
     "astro": "^3.5.4",
     "cheerio": "1.0.0-rc.12",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-dom": "^18.2.0",
+    "react-error-boundary": "^4.0.12"
   },
   "devDependencies": {
     "@astrojs/check": "^0.3.1",

apps/spotlight/src/components/AppAvailableFormList.tsx

@@ -1,11 +1,26 @@
 import React from 'react';
+import { ErrorBoundary } from 'react-error-boundary';
+
 import { AvailableFormList } from '@atj/design';
 import { getAppContext } from '../context';
 import { getFormUrl } from '../routes';
+import DebugTools from './DebugTools';
 
 export default () => {
   const ctx = getAppContext();
   return (
-    <AvailableFormList formService={ctx.formService} urlForForm={getFormUrl} />
+    <ErrorBoundary
+      fallback={
+        <div>
+          There was an unexpected error rendering the form list.
+          <DebugTools />
+        </div>
+      }
+    >
+      <AvailableFormList
+        formService={ctx.formService}
+        urlForForm={getFormUrl}
+      />
+    </ErrorBoundary>
   );
 };

apps/spotlight/src/components/DebugTools.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+
+export default function DebugTools() {
+  return (
+    <section>
+      <button
+        className="usa-button"
+        onClick={() => {
+          console.log('clearing');
+          window.localStorage.clear();
+          window.location.reload();
+        }}
+      >
+        Delete all demo data (clear browser local storage)
+      </button>
+    </section>
+  );
+}

apps/spotlight/src/pages/index.astro

@@ -1,9 +1,11 @@
 ---
 import ContentLayout from '../layouts/ContentLayout.astro';
 import AppAvailableFormList from '../components/AppAvailableFormList';
+import DebugTools from '../components/DebugTools';
 ---
 
 <ContentLayout title="10x Access to Justice Spotlight">
   <h1>10x Access to Justice Spotlight</h1>
   <AppAvailableFormList client:only />
+  <DebugTools client:only />
 </ContentLayout>