Merge branch '9964-output-glob-acr' refs #9964
[arvados.git] / services / workbench2 / src / views-components / side-panel / side-panel.tsx
index ef3eb7d640681f03f12d88e400467cf076256332..fe3edc0016eb1a105ebf63086c8d33d3d2b74cec 100644 (file)
@@ -45,12 +45,13 @@ const mapDispatchToProps = (dispatch: Dispatch): SidePanelTreeProps => ({
 const mapStateToProps = ({ router, sidePanel, detailsPanel }: RootState) => ({
     currentRoute: router.location ? router.location.pathname : '',
     isCollapsed: sidePanel.collapsedState,
+    currentSideWidth: sidePanel.currentSideWidth,
     isDetailsPanelTransitioning: detailsPanel.isTransitioning
 });
 
 export const SidePanel = withStyles(styles)(
     connect(mapStateToProps, mapDispatchToProps)(
-        ({ classes, ...props }: WithStyles<CssRules> & SidePanelTreeProps & { currentRoute: string, isDetailsPanelTransitioning: boolean }) =>{
+        ({ classes, ...props }: WithStyles<CssRules> & SidePanelTreeProps ) =>{
 
         const splitPaneRef = useRef<any>(null)
 
@@ -60,13 +61,16 @@ export const SidePanel = withStyles(styles)(
             if (!splitPane) return;
 
             const observerCallback: ResizeObserverCallback = (entries: ResizeObserverEntry[]) => {
+                //entries[0] targets the left side of the split pane
+                const width = entries[0].contentRect.width
+                if (width === props.currentSideWidth) return;
+
                 //prevents potential infinite resize triggers
                 window.requestAnimationFrame((): void | undefined => {
                   if (!Array.isArray(entries) || !entries.length) {
+                      props.setCurrentSideWidth(width)
                     return;
                   }
-                    const width = entries[0].contentRect.width
-                    props.setCurrentSideWidth(width)
                 });
               };