impr: notify the user if custom text saving failed due to local storage being full

Author: Miodec

frontend/src/ts/modals/save-custom-text.ts

@@ -48,10 +48,15 @@ function save(): boolean {
     return false;
   }
 
-  CustomText.setCustomText(name, state.textToSave, checkbox);
-  CustomTextState.setCustomTextName(name, checkbox);
-  Notifications.add("Custom text saved", 1);
-  return true;
+  const saved = CustomText.setCustomText(name, state.textToSave, checkbox);
+  if (saved) {
+    CustomTextState.setCustomTextName(name, checkbox);
+    Notifications.add("Custom text saved", 1);
+    return true;
+  } else {
+    Notifications.add("Error saving custom text", -1);
+    return false;
+  }
 }
 
 function updateIndicatorAndButton(): void {

frontend/src/ts/test/custom-text.ts

@@ -168,7 +168,7 @@ export function setCustomText(
   name: string,
   text: string | string[],
   long = false
-): void {
+): boolean {
   if (long) {
     const customText = getLocalStorageLong();
 
@@ -188,7 +188,7 @@ export function setCustomText(
       textByName.text = text.join(" ");
     }
 
-    setLocalStorageLong(customText);
+    return setLocalStorageLong(customText);
   } else {
     const customText = getLocalStorage();
 
@@ -198,7 +198,7 @@ export function setCustomText(
       customText[name] = text.join(" ");
     }
 
-    setLocalStorage(customText);
+    return setLocalStorage(customText);
   }
 }
 
@@ -242,12 +242,12 @@ function getLocalStorageLong(): CustomTextLongObject {
   return customTextLongLS.get();
 }
 
-function setLocalStorage(data: CustomTextObject): void {
-  customTextLS.set(data);
+function setLocalStorage(data: CustomTextObject): boolean {
+  return customTextLS.set(data);
 }
 
-function setLocalStorageLong(data: CustomTextLongObject): void {
-  customTextLongLS.set(data);
+function setLocalStorageLong(data: CustomTextLongObject): boolean {
+  return customTextLongLS.set(data);
 }
 
 export function getCustomTextNames(long = false): string[] {

frontend/src/ts/utils/local-storage-with-schema.ts

@@ -1,5 +1,7 @@
-import { ZodError, ZodIssue } from "zod";
+import { ZodIssue } from "zod";
 import { deepClone } from "./misc";
+import { isZodError } from "@monkeytype/util/zod";
+import * as Notifications from "../elements/notifications";
 
 export class LocalStorageWithSchema<T> {
   private key: string;
@@ -77,11 +79,23 @@ export class LocalStorageWithSchema<T> {
       window.localStorage.setItem(this.key, JSON.stringify(parsed));
       return true;
     } catch (e) {
-      console.error(
-        `Failed to set ${this.key} in localStorage`,
-        data,
-        (e as ZodError).issues
-      );
+      let message = "Unknown error occurred";
+
+      if (isZodError(e)) {
+        message = e.issues
+          .map((i) => (i.message ? i.message : JSON.stringify(i)))
+          .join(", ");
+      } else {
+        if ((e as Error).message.includes("exceeded the quota")) {
+          message =
+            "Local storage is full. Please clear some space and try again.";
+        }
+      }
+
+      const msg = `Failed to set ${this.key} in localStorage: ${message}`;
+      console.error(msg);
+      Notifications.add(msg, -1);
+
       return false;
     }
   }