Moving zoomToolbar into display

Signed-off-by: Jitendra Gundaniya <[email protected]>
kedro-org · Jul 18, 2024 · 47b7414 · 47b7414
1 parent 2f602cd
commit 47b7414
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 6 deletions.
diff --git a/src/components/app/app.js b/src/components/app/app.js
@@ -99,7 +99,6 @@ App.propTypes = {
     exportBtn: PropTypes.bool,
     pipelineBtn: PropTypes.bool,
     sidebar: PropTypes.bool,
-    zoomToolBar: PropTypes.bool,
     miniMapBtn: PropTypes.bool,
   }),
   /**
@@ -110,6 +109,7 @@ App.propTypes = {
     sidebar: PropTypes.bool,
     miniMap: PropTypes.bool,
     expandAllPipelines: PropTypes.bool,
+    zoomToolBar: PropTypes.bool,
   }),
 };
 

diff --git a/src/components/global-toolbar/global-toolbar.test.js b/src/components/global-toolbar/global-toolbar.test.js
@@ -60,7 +60,6 @@ describe('GlobalToolbar', () => {
         settingsModal: false,
         shareableUrlModal: false,
         sidebar: true,
-        zoomToolbar: true,
       },
     };
     expect(mapStateToProps(mockState.spaceflights)).toEqual(expectedResult);

diff --git a/src/components/minimap-toolbar/minimap-toolbar.js b/src/components/minimap-toolbar/minimap-toolbar.js
@@ -18,6 +18,7 @@ export const MiniMapToolbar = ({
   onToggleMiniMap,
   onUpdateChartZoom,
   visible,
+  displayZoomToolbar,
 }) => {
   const { scale, minScale, maxScale } = chartZoom;
 
@@ -45,7 +46,7 @@ export const MiniMapToolbar = ({
           icon={PlusIcon}
           labelText={'Zoom in'}
           onClick={() => onUpdateChartZoom(scaleZoom(chartZoom, 1.3))}
-          visible={visible.zoomToolbar}
+          visible={displayZoomToolbar}
         />
         <IconButton
           ariaLabel={'Zoom out'}
@@ -57,7 +58,7 @@ export const MiniMapToolbar = ({
           icon={MinusIcon}
           labelText={'Zoom out'}
           onClick={() => onUpdateChartZoom(scaleZoom(chartZoom, 0.7))}
-          visible={visible.zoomToolbar}
+          visible={displayZoomToolbar}
         />
         <IconButton
           ariaLabel={'Reset zoom'}
@@ -66,7 +67,7 @@ export const MiniMapToolbar = ({
           icon={ResetIcon}
           labelText={'Reset zoom'}
           onClick={() => onUpdateChartZoom(scaleZoom(chartZoom, 0))}
-          visible={visible.zoomToolbar}
+          visible={displayZoomToolbar}
         />
         <li>
           <span className="pipeline-minimap-toolbar__scale" title="Zoom level">
@@ -88,6 +89,7 @@ const scaleZoom = ({ scale }, factor) => ({
 export const mapStateToProps = (state) => ({
   visible: state.visible,
   displayMiniMap: state.display.miniMap,
+  displayZoomToolbar: state.display.zoomToolbar,
   chartZoom: getChartZoom(state),
 });
 

diff --git a/src/components/minimap-toolbar/minimap-toolbar.test.js b/src/components/minimap-toolbar/minimap-toolbar.test.js
@@ -50,6 +50,7 @@ describe('MiniMapToolbar', () => {
     const expectedResult = {
       displayMiniMap: true,
       chartZoom: expect.any(Object),
+      displayZoomToolbar: expect.any(Boolean),
       visible: expect.objectContaining({
         miniMap: expect.any(Boolean),
         miniMapBtn: expect.any(Boolean),

diff --git a/src/store/initial-state.js b/src/store/initial-state.js
@@ -45,13 +45,13 @@ export const createInitialState = () => ({
     settingsModal: false,
     shareableUrlModal: false,
     sidebar: window.innerWidth > sidebarWidth.breakpoint,
-    zoomToolbar: true,
   },
   display: {
     globalToolbar: true,
     sidebar: true,
     miniMap: true,
     expandAllPipelines: false,
+    zoomToolbar: true,
   },
   zoom: {},
   runsMetadata: {},