Merge pull request #1317 from RodriSanchez1/feature/SideNavigationBut…

…tons Fix show side scroll buttons on saving
cboard-org · Dec 15, 2022 · 825b5d2 · 825b5d2
2 parents b0bb41a + 3fc67f9
commit 825b5d2
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 17 deletions.
diff --git a/src/components/Board/Board.component.js b/src/components/Board/Board.component.js
@@ -424,13 +424,13 @@ export class Board extends Component {
                 active={
                   navigationSettings.caBackButtonActive &&
                   !isSelecting &&
-                  !isSaving &&
+                  (!isSaving || isNavigationButtonsOnTheSide) &&
                   !this.props.scannerSettings.active
                 }
                 navHistory={this.props.navHistory}
                 previousBoard={onRequestPreviousBoard}
                 toRootBoard={onRequestToRootBoard}
-                isLocked={this.props.isLocked}
+                isSaving={isSaving}
                 isNavigationButtonsOnTheSide={isNavigationButtonsOnTheSide}
               />
             )}
@@ -503,12 +503,12 @@ export class Board extends Component {
               <ScrollButtons
                 active={
                   navigationSettings.bigScrollButtonsActive &&
-                  !isSaving &&
+                  (!isSaving || isNavigationButtonsOnTheSide) &&
                   !this.props.scannerSettings.active &&
                   (isScroll || isNavigationButtonsOnTheSide)
                 }
                 isScroll={isScroll}
-                isLocked={isLocked}
+                isSaving={isSaving}
                 boardContainer={
                   board.isFixed
                     ? this.fixedBoardContainerRef

diff --git a/src/components/NavigationButtons/NavigationButtons.component.js b/src/components/NavigationButtons/NavigationButtons.component.js
@@ -10,23 +10,23 @@ const NavigationButtons = ({
   navHistory,
   previousBoard,
   toRootBoard,
-  isLocked,
+  isSaving,
   isNavigationButtonsOnTheSide
 }) => {
   if (!active) {
     return null;
   }
   const classPreviousBoardButton = isNavigationButtonsOnTheSide
     ? `SideNavigationButton SideButtonPreviousBoard ${
-        navHistory.length > 2 ? '' : 'disable'
+        !isSaving && navHistory.length > 1 ? '' : 'disable'
       }`
-    : `NavigationButton left`;
+    : `NavigationButton right`;
 
   const classToRootBoardButton = isNavigationButtonsOnTheSide
     ? `SideNavigationButton SideButtonToRootBoard ${
-        navHistory.length > 1 ? '' : 'disable'
+        !isSaving && navHistory.length > 2 ? '' : 'disable'
       }`
-    : 'NavigationButton right';
+    : 'NavigationButton left';
 
   return (
     <React.Fragment>
@@ -36,14 +36,14 @@ const NavigationButtons = ({
         }
       >
         {(navHistory.length > 2 || isNavigationButtonsOnTheSide) && (
-          <div className={classPreviousBoardButton}>
+          <div className={classToRootBoardButton}>
             <button onClick={toRootBoard}>
               <FirstPageIcon />
             </button>
           </div>
         )}
         {(navHistory.length > 1 || isNavigationButtonsOnTheSide) && (
-          <div className={classToRootBoardButton}>
+          <div className={classPreviousBoardButton}>
             <button onClick={previousBoard}>
               <ChevronLeftIcon />
             </button>
@@ -58,7 +58,7 @@ NavigationButtons.props = {
   navHistory: PropTypes.arrayOf(PropTypes.string),
   previousBoard: PropTypes.func,
   toRootBoard: PropTypes.func,
-  isLocked: PropTypes.bool,
+  isSaving: PropTypes.bool,
   isNavigationButtonsOnTheSide: PropTypes.bool
 };
 

diff --git a/src/components/NavigationButtons/NavigationButtons.css b/src/components/NavigationButtons/NavigationButtons.css
@@ -78,12 +78,12 @@
 }
 
 .SideButtonScrollUp,
-.SideButtonPreviousBoard {
+.SideButtonToRootBoard {
   margin-bottom: 2px;
 }
 
 .SideButtonScrollDown,
-.SideButtonToRootBoard {
+.SideButtonPreviousBoard {
   margin-top: 2px;
 }
 

diff --git a/src/components/ScrollButtons/ScrollButtons.js b/src/components/ScrollButtons/ScrollButtons.js
@@ -73,13 +73,13 @@ const ScrollButtons = props => {
 
   const classScrollUp = props.isNavigationButtonsOnTheSide
     ? `SideNavigationButton SideButtonScrollUp ${
-        !props.isScroll || isScrollTop ? 'disable' : ''
+        !props.isScroll || props.isSaving || isScrollTop ? 'disable' : ''
       }`
     : `NavigationButton top`;
 
   const classScrollDown = props.isNavigationButtonsOnTheSide
     ? `SideNavigationButton SideButtonScrollDown ${
-        !props.isScroll || isScrollDown ? 'disable' : ''
+        !props.isScroll || props.isSaving || isScrollDown ? 'disable' : ''
       }`
     : 'NavigationButton bottom';
 
@@ -113,7 +113,7 @@ const ScrollButtons = props => {
 
 ScrollButtons.props = {
   active: PropTypes.bool,
-  isLocked: PropTypes.bool,
+  isSaving: PropTypes.bool,
   boardContainer: PropTypes.object,
   totalRows: PropTypes.number,
   boardId: PropTypes.number,