[arvados] created: 2.7.0-5932-g6b84843b28

git repository hosting git at public.arvados.org
Wed Jan 31 19:39:53 UTC 2024


        at  6b84843b285257b736d4d0d1775feb3f2eeb1d42 (commit)


commit 6b84843b285257b736d4d0d1775feb3f2eeb1d42
Author: Peter Amstutz <peter.amstutz at curii.com>
Date:   Wed Jan 31 14:35:01 2024 -0500

    21440: Adjust order of process panel and make panels bigger
    
    This makes switching panels feel more like tabs, while retaining the
    ability to scroll through them.
    
    Arvados-DCO-1.1-Signed-off-by: Peter Amstutz <peter.amstutz at curii.com>

diff --git a/services/workbench2/src/views/process-panel/process-io-card.tsx b/services/workbench2/src/views/process-panel/process-io-card.tsx
index 6c745886c8..c9d0d20501 100644
--- a/services/workbench2/src/views/process-panel/process-io-card.tsx
+++ b/services/workbench2/src/views/process-panel/process-io-card.tsx
@@ -123,7 +123,7 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     },
     tableWrapper: {
         height: "auto",
-        maxHeight: `calc(100% - ${theme.spacing.unit * 4.5}px)`,
+        maxHeight: `calc(100% - ${theme.spacing.unit * 3}px)`,
         overflow: "auto",
     },
     tableRoot: {
diff --git a/services/workbench2/src/views/process-panel/process-panel-root.tsx b/services/workbench2/src/views/process-panel/process-panel-root.tsx
index 30d72dfd56..774e572cc9 100644
--- a/services/workbench2/src/views/process-panel/process-panel-root.tsx
+++ b/services/workbench2/src/views/process-panel/process-panel-root.tsx
@@ -68,12 +68,12 @@ export type ProcessPanelRootProps = ProcessPanelRootDataProps & ProcessPanelRoot
 
 const panelsData: MPVPanelState[] = [
     { name: "Details" },
-    { name: "Command" },
     { name: "Logs", visible: true },
-    { name: "Inputs" },
+    { name: "Subprocesses" },
     { name: "Outputs" },
+    { name: "Inputs" },
+    { name: "Command" },
     { name: "Resources" },
-    { name: "Subprocesses" },
 ];
 
 export const ProcessPanelRoot = withStyles(styles)(
@@ -112,6 +112,8 @@ export const ProcessPanelRoot = withStyles(styles)(
             }
         }, [containerRequest, loadInputs, loadOutputs, loadOutputDefinitions, loadNodeJson]);
 
+        const maxHeight = "100%";
+
         // Trigger processing output params when raw or definitions change
         React.useEffect(() => {
             updateOutputParams();
@@ -137,19 +139,11 @@ export const ProcessPanelRoot = withStyles(styles)(
                         resumeOnHoldWorkflow={props.resumeOnHoldWorkflow}
                     />
                 </MPVPanelContent>
-                <MPVPanelContent
-                    forwardProps
-                    xs="auto"
-                    data-cy="process-cmd">
-                    <ProcessCmdCard
-                        onCopy={props.onCopyToClipboard}
-                        process={process}
-                    />
-                </MPVPanelContent>
                 <MPVPanelContent
                     forwardProps
                     xs
-                    minHeight="50%"
+                    minHeight={maxHeight}
+                    maxHeight={maxHeight}
                     data-cy="process-logs">
                     <ProcessLogsCard
                         onCopy={props.onCopyToClipboard}
@@ -168,20 +162,14 @@ export const ProcessPanelRoot = withStyles(styles)(
                 <MPVPanelContent
                     forwardProps
                     xs
-                    maxHeight="50%"
-                    data-cy="process-inputs">
-                    <ProcessIOCard
-                        label={ProcessIOCardType.INPUT}
-                        process={process}
-                        params={inputParams}
-                        raw={inputRaw}
-                        mounts={inputMounts}
-                    />
+                    maxHeight={maxHeight}
+                    data-cy="process-children">
+                    <SubprocessPanel process={process} />
                 </MPVPanelContent>
                 <MPVPanelContent
                     forwardProps
                     xs
-                    maxHeight="50%"
+                    maxHeight={maxHeight}
                     data-cy="process-outputs">
                     <ProcessIOCard
                         label={ProcessIOCardType.OUTPUT}
@@ -194,18 +182,33 @@ export const ProcessPanelRoot = withStyles(styles)(
                 <MPVPanelContent
                     forwardProps
                     xs
-                    data-cy="process-resources">
-                    <ProcessResourceCard
+                    maxHeight={maxHeight}
+                    data-cy="process-inputs">
+                    <ProcessIOCard
+                        label={ProcessIOCardType.INPUT}
+                        process={process}
+                        params={inputParams}
+                        raw={inputRaw}
+                        mounts={inputMounts}
+                    />
+                </MPVPanelContent>
+                <MPVPanelContent
+                    forwardProps
+                    xs="auto"
+                    data-cy="process-cmd">
+                    <ProcessCmdCard
+                        onCopy={props.onCopyToClipboard}
                         process={process}
-                        nodeInfo={nodeInfo}
                     />
                 </MPVPanelContent>
                 <MPVPanelContent
                     forwardProps
                     xs
-                    maxHeight="50%"
-                    data-cy="process-children">
-                    <SubprocessPanel process={process} />
+                    data-cy="process-resources">
+                    <ProcessResourceCard
+                        process={process}
+                        nodeInfo={nodeInfo}
+                    />
                 </MPVPanelContent>
             </MPVContainer>
         ) : (

-----------------------------------------------------------------------


hooks/post-receive
-- 




More information about the arvados-commits mailing list