Protect against other exit methods, protect against multiple fetches

src/components/dialogs/nuxs/TenMillion/index.tsx

@@ -87,6 +87,7 @@ export function TenMillion() {
   const agent = useAgent()
   const nuxDialogs = useNuxDialogContext()
   const [userNumber, setUserNumber] = React.useState<number>(0)
+  const fetching = React.useRef(false)
 
   React.useEffect(() => {
     async function fetchUserNumber() {
@@ -119,9 +120,12 @@ export function TenMillion() {
       }
     }
 
-    networkRetry(3, fetchUserNumber).catch(() => {
+    if (!fetching.current) {
-      nuxDialogs.dismissActiveNux()
+      fetching.current = true
-    })
+      networkRetry(3, fetchUserNumber).catch(() => {
+        nuxDialogs.dismissActiveNux()
+      })
+    }
   }, [
     agent.sessionManager.pdsUrl,
     agent.session?.accessJwt,

src/components/dialogs/nuxs/index.tsx

@@ -49,14 +49,7 @@ function Inner() {
   const dismissActiveNux = React.useCallback(() => {
     if (!activeNux) return
     setActiveNux(undefined)
-    const nux = nuxs?.find(nux => nux.id === activeNux)
+  }, [activeNux, setActiveNux])
-    upsertNux({
-      id: activeNux,
-      completed: true,
-      data: nux?.data,
-      expiresAt: nux?.expiresAt,
-    })
-  }, [activeNux, setActiveNux, upsertNux, nuxs])
 
   if (IS_DEV && typeof window !== 'undefined') {
     // @ts-ignore
@@ -77,12 +70,18 @@ function Inner() {
       if (nux && nux.completed) continue
 
       setActiveNux(id)
-      // snooze immediately upon enabling
+      // immediately snooze (in memory)
       snoozeNuxDialog()
+      // immediately update remote data
+      upsertNux({
+        id,
+        completed: true,
+        data: undefined,
+      })
 
       break
     }
-  }, [nuxs, snoozed, snoozeNuxDialog])
+  }, [nuxs, snoozed, snoozeNuxDialog, upsertNux])
 
   const ctx = React.useMemo(() => {
     return {