fix: selection history navigation

kubeshop · Aug 19, 2021 · eaab450 · eaab450
1 parent cc52e47
commit eaab450
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 10 deletions.
diff --git a/src/components/organisms/ActionsPane/ActionsPane.tsx b/src/components/organisms/ActionsPane/ActionsPane.tsx
@@ -112,11 +112,13 @@ const ActionsPane = (props: {contentHeight: string}) => {
   const [key, setKey] = useState('source');
   const dispatch = useAppDispatch();
 
-  const isLeftArrowEnabled = selectionHistory.length > 0 && currentSelectionHistoryIndex !== 0;
+  const isLeftArrowEnabled =
+    selectionHistory.length > 1 &&
+    (currentSelectionHistoryIndex === undefined || (currentSelectionHistoryIndex && currentSelectionHistoryIndex > 0));
   const isRightArrowEnabled =
-    selectionHistory.length > 0 &&
-    currentSelectionHistoryIndex &&
-    currentSelectionHistoryIndex < selectionHistory.length - 2;
+    selectionHistory.length > 1 &&
+    currentSelectionHistoryIndex !== undefined &&
+    currentSelectionHistoryIndex < selectionHistory.length - 1;
 
   const onClickLeftArrow = () => {
     dispatch(selectFromHistory({direction: 'left'}));

diff --git a/src/redux/reducers/main.ts b/src/redux/reducers/main.ts
@@ -62,7 +62,6 @@ export type StartPreviewLoaderPayload = {
 
 function updateSelectionHistory(type: 'resource' | 'path', isVirtualSelection: boolean, state: AppState) {
   if (isVirtualSelection) {
-    state.currentSelectionHistoryIndex = undefined;
     return;
   }
   if (type === 'resource' && state.selectedResourceId) {
@@ -77,6 +76,7 @@ function updateSelectionHistory(type: 'resource' | 'path', isVirtualSelection: b
       selectedPath: state.selectedPath,
     });
   }
+  state.currentSelectionHistoryIndex = undefined;
 }
 
 export const mainSlice = createSlice({

diff --git a/src/redux/thunks/selectionHistory.ts b/src/redux/thunks/selectionHistory.ts
@@ -22,17 +22,16 @@ export const selectFromHistory = createAsyncThunk<
     if (currentSelectionHistoryIndex === 0) {
       return;
     }
-    nextSelectionHistoryIndex = currentSelectionHistoryIndex
-      ? currentSelectionHistoryIndex - 1
-      : selectionHistory.length - 2;
+    nextSelectionHistoryIndex =
+      currentSelectionHistoryIndex !== undefined ? currentSelectionHistoryIndex - 1 : selectionHistory.length - 2;
   } else if (direction === 'right') {
-    if (!currentSelectionHistoryIndex || currentSelectionHistoryIndex === selectionHistory.length - 1) {
+    if (currentSelectionHistoryIndex === undefined || currentSelectionHistoryIndex === selectionHistory.length - 1) {
       return;
     }
     nextSelectionHistoryIndex = currentSelectionHistoryIndex + 1;
   }
 
-  if (!nextSelectionHistoryIndex) {
+  if (nextSelectionHistoryIndex === null) {
     return;
   }