feat: improve error page

packages/app/src/Pages/ErrorPage.tsx

@@ -1,3 +1,5 @@
+import { db } from "Db";
+import AsyncButton from "Element/AsyncButton";
 import { FormattedMessage } from "react-intl";
 import { useRouteError } from "react-router-dom";
 
@@ -6,12 +8,28 @@ const ErrorPage = () => {
 
   console.error(error);
   return (
-    <>
+    <div className="main-content page">
       <h4>
         <FormattedMessage defaultMessage="An error has occured!" />
       </h4>
-      <pre>{JSON.stringify(error, undefined, "  ")}</pre>
-    </>
+      <AsyncButton
+        onClick={async () => {
+          await db.delete();
+          globalThis.localStorage.clear();
+          globalThis.location.href = "/";
+        }}>
+        <FormattedMessage defaultMessage="Clear cache and reload" />
+      </AsyncButton>
+      {
+        <pre>
+          {JSON.stringify(
+            error instanceof Error ? { name: error.name, message: error.message, stack: error.stack } : error,
+            undefined,
+            "  "
+          )}
+        </pre>
+      }
+    </div>
   );
 };
 

packages/app/src/lang.json

@@ -407,6 +407,9 @@
   "HOzFdo": {
     "defaultMessage": "Muted"
   },
+  "HWbkEK": {
+    "defaultMessage": "Clear cache and reload"
+  },
   "HbefNb": {
     "defaultMessage": "Open Wallet"
   },

packages/app/src/translations/en.json

@@ -133,6 +133,7 @@
   "HAlOn1": "Name",
   "HFls6j": "name will be available later",
   "HOzFdo": "Muted",
+  "HWbkEK": "Clear cache and reload",
   "HbefNb": "Open Wallet",
   "IDjHJ6": "Thanks for using Snort, please consider donating if you can.",
   "IEwZvs": "Are you sure you want to unpin this note?",
@@ -412,4 +413,4 @@
   "zjJZBd": "You're ready!",
   "zonsdq": "Failed to load LNURL service",
   "zvCDao": "Automatically show latest notes"
-}
+}