https://sonarly.com/issue/34209?type=bug
When viewing a workflow run record page, the side panel crashes with "Expected the flow to be defined" because `WorkflowRunVisualizerEffect` resets `flowComponentState` to `undefined` during data refetch while the side panel that depends on this state remains open.
Fix: Replaced `useFlowOrThrow()` with `useAtomComponentStateValue(flowComponentState)` in `SidePanelWorkflowRunViewStepContent` and added `!isDefined(flow)` to the existing null-check guard that already handles `workflowRun` and `workflowSelectedNode` being undefined.
**Why this fix:**
The `flowComponentState` is set by `WorkflowRunVisualizerEffect` via a `useEffect` that depends on async GraphQL data. When the workflow run data is temporarily unavailable (network errors, refetch cycles), the effect resets `flowComponentState` to `undefined` without closing the side panel. The side panel component was using `useFlowOrThrow()` which throws when flow is undefined, causing a crash.
The fix follows the exact same pattern already used on line 68 of the same file:
```typescript
if (!isDefined(workflowRun) || !isDefined(workflowSelectedNode)) {
return null;
}
```
Now extended to also check for flow:
```typescript
if (!isDefined(flow) || !isDefined(workflowRun) || !isDefined(workflowSelectedNode)) {
return null;
}
```
This renders nothing (graceful degradation) while the flow data is loading or temporarily unavailable, and re-renders automatically when the Jotai atom is populated — matching how the component already handles the other async dependencies.
Sonarly Claude Code
5ad4387f96