[eric] workflows: auto-fit card height, drop stray step bands, fix active-poll 401 + view dead-ends

electron/main.js

@@ -978,6 +978,9 @@ app.whenReady().then(async () => {
       backendPort = parseInt(process.env.OPENSWARM_PORT || '8324', 10);
       console.log(`Dev mode: using existing backend on port ${backendPort}`);
       emitSplashStatus('Connecting to dev backend…');
+      // Load the token before marking ready, same as prod, so the workflow
+      // poller's setBackend() gets a real token instead of '' (else it 401s).
+      await loadAuthToken();
       markBackendReady();
     } else {
       // Kick off backend without awaiting so the window can paint while Python is still cold-starting. Renderer fetches lazy-await markBackendReady() via the get-auth-token IPC; splash status updates still fire from inside startBackend.

electron/workflowsLifecycle.js

@@ -48,7 +48,9 @@ function fetchJson(pathStr) {
 }
 
 async function getActive() {
-  const res = await fetchJson('/workflows/active');
+  // Must hit the /api prefix; the bare path 401s and would leave the
+  // powerSaveBlocker + updater-veto blind to in-flight runs.
+  const res = await fetchJson('/api/workflows/active');
   if (!res || !Array.isArray(res.active)) return [];
   return res.active;
 }

frontend/src/app/pages/Workflows/EditAgentView.tsx

@@ -228,12 +228,7 @@ export default function EditAgentView({ workflow, steps, isFixMode = false }: Pr
           tone="filled"
         />
       </Box>
-      <Box sx={{
-        p: 1.5, borderRadius: `${c.radius.lg}px`,
-        border: `1px solid ${c.border.subtle}`, bgcolor: c.bg.elevated,
-      }}>
-        <StepList steps={steps} />
-      </Box>
+      <StepList steps={steps} />
       {isFixMode && fixSeed && <FixPrefixCard seed={fixSeed} expanded={fixPrefixExpanded} onToggle={() => setFixPrefixExpanded((x) => !x)} />}
       {/* Embedded real Edit Agent chat. AgentChat owns the composer +
           message list + tool-call card rendering, matching Image #48

frontend/src/app/pages/Workflows/StepList.tsx

@@ -68,7 +68,9 @@ export default function StepList(props: Props) {
             left: CONNECTOR_X - 0.5,
             top: CIRCLE_SIZE * 0.5,
             bottom: CIRCLE_SIZE * 0.5,
-            width: 1,
+            // '1px' not 1: MUI sx treats width:1 as 100%, which rendered the
+            // connector as a full-width grey band behind the steps.
+            width: '1px',
             bgcolor: c.border.medium,
             opacity: 0.65,
           }}

frontend/src/app/pages/Workflows/WorkflowCard.tsx

@@ -356,6 +356,12 @@ const WorkflowCard: React.FC<Props> = ({
   const displayY = localResize?.y ?? localDragPos?.y ?? (cardY + mdDy);
   const displayW = localResize?.w ?? cardWidth;
   const displayH = localResize?.h ?? cardHeight;
+  // Chat views embed a full AgentChat that needs a fixed scroll viewport;
+  // every other view should size to its content so nothing is cut off and
+  // there's no dead space below short content. While the user is actively
+  // resizing, honor the dragged height.
+  const isChatView = card?.view === 'edit_agent' || card?.view === 'fix_agent';
+  const autoHeight = !isChatView && !localResize && !isResizing;
   const noTransition = isDragging || isResizing || (isSelected && !!multiDragDelta);
 
   if (!card) return null;
@@ -412,7 +418,8 @@ const WorkflowCard: React.FC<Props> = ({
         left: displayX,
         top: displayY,
         width: displayW,
-        height: displayH,
+        height: autoHeight ? 'auto' : displayH,
+        maxHeight: autoHeight ? 'min(82vh, 760px)' : undefined,
         borderRadius: '14px',
         border,
         bgcolor: c.bg.surface,
@@ -507,7 +514,7 @@ const WorkflowCard: React.FC<Props> = ({
             label="History"
             icon={<HistoryIcon sx={{ fontSize: 16 }} />}
             active={card.view === 'history' || card.view === 'history_detail'}
-            onClick={() => dispatch(updateWorkflowCard({ workflowId, patch: { view: 'history' } }))}
+            onClick={() => dispatch(updateWorkflowCard({ workflowId, patch: { view: (card.view === 'history' || card.view === 'history_detail') ? 'saved' : 'history' } }))}
           />
           <TabBtn
             label={runStarting ? 'Starting…' : 'Run'}

frontend/src/app/pages/Workflows/WorkflowEditViews.tsx

@@ -3,9 +3,10 @@ import Box from '@mui/material/Box';
 import Typography from '@mui/material/Typography';
 import Select from '@mui/material/Select';
 import MenuItem from '@mui/material/MenuItem';
+import ArrowBackRounded from '@mui/icons-material/ArrowBackRounded';
 import { useClaudeTokens } from '@/shared/styles/ThemeContext';
 import { useAppDispatch } from '@/shared/hooks';
-import { updateWorkflow, type Workflow } from '@/shared/state/workflowsSlice';
+import { updateWorkflow, updateWorkflowCard, type Workflow } from '@/shared/state/workflowsSlice';
 import { validateDraft } from './permissionsUtils';
 import { ActionBtn, HINT_FS, LABEL_FS } from './workflowEditCommon';
 import GeneralFacet from './GeneralFacet';
@@ -103,6 +104,18 @@ export default function WorkflowEditViews({ workflow, facet, onChangeFacet, onDi
           as two distinct groups, not five evenly-spaced chips. */}
       <Box sx={{ display: 'flex', alignItems: 'center', flexWrap: 'nowrap', minWidth: 0, py: 0.5 }}>
         <Box sx={{ display: 'inline-flex', alignItems: 'center', gap: 1, flexShrink: 0 }}>
+          <Box
+            onClick={() => dispatch(updateWorkflowCard({ workflowId: workflow.id, patch: { view: 'saved' } }))}
+            role="button"
+            aria-label="Back"
+            sx={{
+              display: 'inline-flex', alignItems: 'center', justifyContent: 'center',
+              width: 26, height: 26, borderRadius: 999, mr: 0.25,
+              color: c.text.secondary, cursor: 'pointer',
+              '&:hover': { color: c.text.primary, bgcolor: c.bg.elevated },
+            }}>
+            <ArrowBackRounded sx={{ fontSize: 17 }} />
+          </Box>
           <Typography sx={{ fontSize: LABEL_FS, color: c.text.secondary, fontWeight: 500 }}>Currently Editing</Typography>
           <Select
             size="small"