21128: fixed subprocess toolbar not expanding Arvados-DCO-1.1-Signed-off-by: Lisa...

[arvados-workbench2.git] / src / components / multiselect-toolbar / MultiselectToolbar.tsx

diff --git a/src/components/multiselect-toolbar/MultiselectToolbar.tsx b/src/components/multiselect-toolbar/MultiselectToolbar.tsx
index 30d5bd7912f1d232d7687ea847d842506841fb55..2a4f4a4bfc314865e8dc0c164d17f22579007a9b 100644 (file)
--- a/src/components/multiselect-toolbar/MultiselectToolbar.tsx
+++ b/src/components/multiselect-toolbar/MultiselectToolbar.tsx
@@ -48,6 +48,7 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
         height: '2.7rem',
         padding: 0,
         margin: "1rem auto auto 0.5rem",
+        transition: `width ${WIDTH_TRANSITION}ms`,
         overflowY: 'auto',
         scrollBehavior: 'smooth',
         '&::-webkit-scrollbar': {
@@ -108,23 +109,26 @@ export const MultiselectToolbar = connect(
         const currentPathIsTrash = window.location.pathname === "/trash";
         const [isTransitioning, setIsTransitioning] = useState(false);
         
-        const actions =
-        currentPathIsTrash && selectedToKindSet(checkedList).size
-        ? [msToggleTrashAction]
-        : selectActionsByKind(currentResourceKinds as string[], multiselectActionsFilters)
-        .filter((action) => (singleSelectedUuid === null ? action.isForMulti : true));
-        
         const handleTransition = () => {
             setIsTransitioning(true)
             setTimeout(() => {
                 setIsTransitioning(false)
             }, WIDTH_TRANSITION);
         }
-
+        
         useEffect(()=>{
-            handleTransition()
+            if(!isTransitioning){
+                handleTransition()
+            }
         }, [checkedList])
 
+        const actions =
+            currentPathIsTrash && selectedToKindSet(checkedList).size
+                ? [msToggleTrashAction]
+                : selectActionsByKind(currentResourceKinds as string[], multiselectActionsFilters).filter((action) =>
+                        singleSelectedUuid === null ? action.isForMulti : true
+                    );
+
         return (
             <React.Fragment>
                 <Toolbar