d703c0d78d3b

add exit animation when leaving settings back to main entry view

time
2026-05-19 05:22 UTC · 5 months ago
machine
koh2
parent
1fd4f7b8c872
2 files src/popup/App.tsx+12 −2src/popup/views/Settings.tsx+6 −1
src/popup/App.tsx+12 −2
@@ -161,6 +161,7 @@161161   // onBack fires we return to Panic instead of Settings so the user keeps the162162   // destruction context they came from.163163   const [returnToPanic, setReturnToPanic] = createSignal(false);164+  const [settingsExiting, setSettingsExiting] = createSignal(false);164165   const [showNotes, setShowNotes] = createSignal(false);165166   const [openNoteId, setOpenNoteId] = createSignal<string | undefined>(undefined);166167   // Set on popup boot when peach_recovery_pending flag is found in session@@ -1324,7 +1325,7 @@13241325                 </div>13251326               </Portal>13261327             </Show>1327-            <Show when={view() === "settings"}>1328+            <Show when={view() === "settings" || settingsExiting()}>13281329               <Suspense fallback={<div class="peach-loading"><PeachWordmark /></div>}>13291330                 <SettingsView13301331                   entriesCount={entries().length}@@ -1339,6 +1340,7 @@13391340                   isPro={proStatus()}13401341                   initialSection={settingsInitialSection()}13411342                   upgradeHighlight={upgradeHighlight()}1343+                  isExiting={settingsExiting()}13421344                   onBreachMonitoringChange={applyBreachMonitoring}13431345                   onLockOnCloseChange={applyLockOnClose}13441346                   onAutoLockMinutesChange={applyAutoLockMinutes}@@ -1364,7 +1366,15 @@13641366                       window.setTimeout(() => setView("settings"), 2500);13651367                     }13661368                   }}1367-                  onBack={() => { setSettingsInitialSection(null); setUpgradeHighlight(null); handleBack(); }}1369+                  onBack={() => {1370+                    setSettingsExiting(true);1371+                    window.setTimeout(() => {1372+                      setSettingsExiting(false);1373+                      setSettingsInitialSection(null);1374+                      setUpgradeHighlight(null);1375+                      handleBack();1376+                    }, 200);1377+                  }}13681378                   onImport={() => setView("import")}13691379                   onExport={() => setView("export")}13701380                   onBreachCheckDone={loadEntries}

view file

src/popup/views/Settings.tsx+6 −1
@@ -53,6 +53,7 @@5353   shortcuts: Record<ShortcutAction, Keybinding>;5454   onShortcutsChange: (active: Record<ShortcutAction, Keybinding>) => void | Promise<void>;5555   onLicenseChange?: () => void | Promise<void>;56+  isExiting?: boolean;5657   onBack: () => void;5758   onImport: () => void;5859   onExport: () => void;@@ -1727,7 +1728,11 @@17271728     <Show17281729       when={showNewRecoveryWords()}17291730       fallback={1730-        <div class="peach-overlay-view ov-enter-right" style="display:flex;flex-direction:column">1731+        <div1732+          class="peach-overlay-view"1733+          classList={{ "ov-enter-right": !props.isExiting, "ov-exit-right": !!props.isExiting }}1734+          style="display:flex;flex-direction:column"1735+        >17311736           <StackDeck17321737             active={activeCard()}17331738             onActiveChange={setActiveCard}

view file