mobile: save report issue information if app gets

restarted or accidentally closed

apps/mobile/app/components/sheets/github/issue.js

@@ -35,10 +35,14 @@ import { presentDialog } from "../../dialog/functions";
 import { Button } from "../../ui/button";
 import Seperator from "../../ui/seperator";
 import Paragraph from "../../ui/typography/paragraph";
+import { useStoredRef } from "../../../hooks/use-stored-ref";
+
 export const Issue = ({ defaultTitle, defaultBody, issueTitle }) => {
   const { colors } = useThemeColors();
-  const body = useRef(defaultBody);
-  const title = useRef(defaultTitle);
+
+  const body = useStoredRef("issueBody", defaultBody);
+  const title = useStoredRef("issueTitle", defaultTitle);
+
   const user = useUserStore((state) => state.user);
   const [loading, setLoading] = useState(false);
   const bodyRef = useRef();
@@ -70,6 +74,8 @@ Logged in: ${user ? "yes" : "no"}`,
       });
       setLoading(false);
       eSendEvent(eCloseSheet);
+      body.reset();
+      title.reset();
       await sleep(300);
       presentDialog({
         title: "Issue reported",

apps/mobile/app/hooks/use-stored-ref.ts

@@ -0,0 +1,52 @@
+/*
+This file is part of the Notesnook project (https://notesnook.com/)
+
+Copyright (C) 2023 Streetwriters (Private) Limited
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+import { useRef } from "react";
+import { MMKV } from "../common/database/mmkv";
+
+export function useStoredRef<T>(
+  key: string,
+  initialValue: T
+): {
+  current: T;
+  reset(): void;
+} {
+  const refKey = `storedRef:${key}`;
+  const value = useRef(
+    MMKV.getMap<{ current: T }>(refKey)?.current || initialValue
+  );
+  const frameRef = useRef(0);
+
+  return {
+    get current() {
+      return value.current;
+    },
+    set current(next: T) {
+      value.current = next;
+      cancelAnimationFrame(frameRef.current);
+      frameRef.current = requestAnimationFrame(() => {
+        MMKV.setMap(refKey, {
+          current: value.current
+        });
+      });
+    },
+    reset() {
+      MMKV.removeItem(refKey);
+    }
+  };
+}

apps/mobile/app/hooks/use-stored-state.ts

@@ -0,0 +1,49 @@
+/*
+This file is part of the Notesnook project (https://notesnook.com/)
+
+Copyright (C) 2023 Streetwriters (Private) Limited
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+import { useRef, useState } from "react";
+import { MMKV } from "../common/database/mmkv";
+
+export function useStoredValue<T>(
+  key: string,
+  initialValue: T
+): { value: T; reset(): void } {
+  const refKey = `storedState:${key}`;
+  const [value, setValue] = useState<T>(
+    MMKV.getMap<{ value: T }>(refKey)?.value || initialValue
+  );
+  const frameRef = useRef(0);
+
+  return {
+    get value() {
+      return value;
+    },
+    set value(next: T) {
+      setValue(next);
+      cancelAnimationFrame(frameRef.current);
+      frameRef.current = requestAnimationFrame(() => {
+        MMKV.setMap(refKey, {
+          value: value
+        });
+      });
+    },
+    reset() {
+      MMKV.removeItem(refKey);
+    }
+  };
+}