From 0e78d0bd5061cc8d1fa6d6a4f25edf59770bcbe9 Mon Sep 17 00:00:00 2001
From: Dan Ditomaso <dan.ditomaso@gmail.com>
Date: Tue, 7 Jan 2025 15:09:00 -0500
Subject: [PATCH] feat: added delay to toast appearing to avoid conflicting
 with messages/node loading.

---
 src/core/hooks/useKeyBackupReminder.tsx | 62 +++++++++++++------------
 1 file changed, 33 insertions(+), 29 deletions(-)

diff --git a/src/core/hooks/useKeyBackupReminder.tsx b/src/core/hooks/useKeyBackupReminder.tsx
index 8ce9e1d8..9af1ec70 100644
--- a/src/core/hooks/useKeyBackupReminder.tsx
+++ b/src/core/hooks/useKeyBackupReminder.tsx
@@ -17,6 +17,8 @@ interface ReminderState {
   lastShown: string;
 }
 
+const TOAST_DELAY = 10000;
+
 export function useBackupReminder({
   suppressDays = 365,
   message = "It's time to back up your key data. Would you like to do this now?",
@@ -47,35 +49,37 @@ export function useBackupReminder({
 
   useEffect(() => {
     if (!reminderState) {
-      const { dismiss: dimissToast } = toast({
-        title: "Backup Reminder",
-        description: message,
-        action: (
-          <div className="flex gap-2">
-            <Button
-              type="button"
-              variant={"default"}
-              onClick={async () => {
-                await onAccept();
-                dimissToast()
-                suppressReminder();
-              }}
-            >
-              Back up now
-            </Button>
-            <Button
-              type="button"
-              variant={"outline"}
-              onClick={() => {
-                dimissToast();
-                suppressReminder();
-              }}
-            >
-              Remind me later
-            </Button>
-          </div>
-        ),
-      });
+      setTimeout(() => {
+        const { dismiss: dimissToast } = toast({
+          title: "Backup Reminder",
+          description: message,
+          action: (
+            <div className="flex gap-2">
+              <Button
+                type="button"
+                variant={"default"}
+                onClick={async () => {
+                  await onAccept();
+                  dimissToast()
+                  suppressReminder();
+                }}
+              >
+                Back up now
+              </Button>
+              <Button
+                type="button"
+                variant={"outline"}
+                onClick={() => {
+                  dimissToast();
+                  suppressReminder();
+                }}
+              >
+                Remind me later
+              </Button>
+            </div>
+          ),
+        });
+      }, TOAST_DELAY);
     }
   }, [reminderState]);