remember last state open/close of thumbnails panel

papermerge · Aug 24, 2024 · 51dd903 · 51dd903
1 parent 09beb3f
commit 51dd903
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 12 deletions.
diff --git a/ui2/src/slices/dualPanel/dualPanel.ts b/ui2/src/slices/dualPanel/dualPanel.ts
@@ -1,3 +1,4 @@
+import Cookies from "js-cookie"
 import {
   createSlice,
   PayloadAction,
@@ -41,7 +42,8 @@ import type {
   SearchResultNode,
   PaginatedSearchResult,
   DroppedThumbnailPosition,
-  PageType
+  PageType,
+  BooleanString
 } from "@/types"
 import {
   DualPanelState,
@@ -59,6 +61,10 @@ import {
   ZOOM_FACTOR_STEP
 } from "@/cconstants"
 
+const MAIN_THUMBNAILS_PANEL_OPENED_COOKIE = "main_thumbnails_panel_opened"
+const SECONDARY_THUMBNAILS_PANEL_OPENED_COOKIE =
+  "secondary_thumbnails_panel_opened"
+
 const initialState: DualPanelState = {
   mainPanel: {
     commander: commanderInitialState(null),
@@ -296,15 +302,25 @@ const dualPanelSlice = createSlice({
 
       if (mode == "main") {
         if (state.mainPanel.viewer) {
-          state.mainPanel.viewer.thumbnailsPanelOpen =
-            !state.mainPanel.viewer.thumbnailsPanelOpen
+          const new_value = !state.mainPanel.viewer.thumbnailsPanelOpen
+          state.mainPanel.viewer.thumbnailsPanelOpen = new_value
+          if (new_value) {
+            Cookies.set(MAIN_THUMBNAILS_PANEL_OPENED_COOKIE, "true")
+          } else {
+            Cookies.set(MAIN_THUMBNAILS_PANEL_OPENED_COOKIE, "false")
+          }
         }
       }
 
       if (mode == "secondary") {
         if (state.secondaryPanel?.viewer) {
-          state.secondaryPanel.viewer.thumbnailsPanelOpen =
-            !state.secondaryPanel.viewer.thumbnailsPanelOpen
+          const new_value = !state.secondaryPanel.viewer.thumbnailsPanelOpen
+          state.secondaryPanel.viewer.thumbnailsPanelOpen = new_value
+          if (new_value) {
+            Cookies.set(SECONDARY_THUMBNAILS_PANEL_OPENED_COOKIE, "true")
+          } else {
+            Cookies.set(SECONDARY_THUMBNAILS_PANEL_OPENED_COOKIE, "false")
+          }
         }
       }
     },
@@ -509,7 +525,7 @@ const dualPanelSlice = createSlice({
           versions: action.payload.versions,
           currentVersion: Math.max(...versionNumbers),
           currentPage: action.meta.arg.page || 1,
-          thumbnailsPanelOpen: false,
+          thumbnailsPanelOpen: mainThumbnailsPanelInitialState(),
           zoomFactor: 100,
           selectedIds: []
         }
@@ -526,7 +542,7 @@ const dualPanelSlice = createSlice({
             versions: action.payload.versions,
             currentVersion: Math.max(...versionNumbers),
             currentPage: action.meta.arg.page || 1,
-            thumbnailsPanelOpen: false,
+            thumbnailsPanelOpen: secondaryThumbnailsPanelInitialState(),
             zoomFactor: 100,
             selectedIds: []
           }
@@ -966,3 +982,27 @@ export const selectZoomFactor = (state: RootState, mode: PanelMode) => {
 
   return state.dualPanel.secondaryPanel?.viewer?.zoomFactor
 }
+
+function mainThumbnailsPanelInitialState(): boolean {
+  const is_opened = Cookies.get(
+    MAIN_THUMBNAILS_PANEL_OPENED_COOKIE
+  ) as BooleanString
+
+  if (is_opened == "true") {
+    return true
+  }
+
+  return false
+}
+
+function secondaryThumbnailsPanelInitialState(): boolean {
+  const is_opened = Cookies.get(
+    SECONDARY_THUMBNAILS_PANEL_OPENED_COOKIE
+  ) as BooleanString
+
+  if (is_opened == "true") {
+    return true
+  }
+
+  return false
+}
diff --git a/ui2/src/slices/navBar.ts b/ui2/src/slices/navBar.ts
@@ -1,7 +1,7 @@
 import {createSlice} from "@reduxjs/toolkit"
 import Cookies from "js-cookie"
 import {RootState} from "@/app/types"
-import type {NavBarCollapsedCookieStrings} from "@/types"
+import type {BooleanString} from "@/types"
 
 const COLLAPSED_WIDTH = 55
 const FULL_WIDTH = 160
@@ -40,9 +40,7 @@ const navBarSlice = createSlice({
 
 /* Load initial collapse state value from cookie */
 function initial_collapse_value(): boolean {
-  const collapsed = Cookies.get(
-    NAVBAR_COLLAPSED_COOKIE
-  ) as NavBarCollapsedCookieStrings
+  const collapsed = Cookies.get(NAVBAR_COLLAPSED_COOKIE) as BooleanString
 
   if (collapsed == "true") {
     return true

diff --git a/ui2/src/types.ts b/ui2/src/types.ts
@@ -279,4 +279,4 @@ export type ThumbnailPageDroppedArgs = {
   position: DroppedThumbnailPosition
 }
 
-export type NavBarCollapsedCookieStrings = "true" | "false"
+export type BooleanString = "true" | "false"