fix clicking nested workflow (#11391)

## Description

Fix clicking nested workflows in the sidepanel. Previously, clicking
"View Nested Graph" on a workflow node inside an already-open nested
workflow panel would throw a runtime error (`TypeError: n is not a
function`). Additionally, even if the click succeeded, the graph
wouldn't update - only the title would change.

**Changes:**
- Updated `WorkflowNestedNode` to use `useWorkflowStepDetail` directly
instead of going through `WorkflowNestedGraphContext`, which wasn't
available inside the nested graph panel
- Added a `key` prop to `ReactFlowProvider` in the step detail panel to
force React to remount the graph when switching between nested
workflows, ensuring the nodes/edges reinitialize with the new data

## Related Issue(s)

#11385 

## Type of Change

- [x] Bug fix (non-breaking change that fixes an issue)
- [ ] New feature (non-breaking change that adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality to change)
- [ ] Documentation update
- [ ] Code refactoring
- [ ] Performance improvement
- [ ] Test update

## Checklist

- [x] I have made corresponding changes to the documentation (if
applicable)
- [ ] I have added tests that prove my fix is effective or that my
feature works

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Bug Fixes**
* Fixed a runtime error that occurred when clicking "View Nested Graph"
in nested workflow panels.
* Improved graph updating behavior when switching between different
nested workflows.

<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

Author: graysonhicks

.changeset/common-hoops-lose.md

@@ -0,0 +1,5 @@
+---
+'@mastra/playground-ui': patch
+---
+
+Fix clicking nested workflows in sidepanel: resolve runtime error when clicking "View Nested Graph" inside an already-open nested workflow panel, and ensure the graph updates when switching between nested workflows.

packages/playground-ui/src/domains/workflows/components/workflow-step-detail.tsx

@@ -52,7 +52,7 @@ export function WorkflowStepDetailContent() {
         {stepDetail.type === 'map-config' && stepDetail.mapConfig && <CodeDialogContent data={stepDetail.mapConfig} />}
         {stepDetail.type === 'nested-graph' && stepDetail.nestedGraph && (
           <div className="h-full min-h-[400px]">
-            <ReactFlowProvider>
+            <ReactFlowProvider key={stepDetail.nestedGraph.fullStep}>
               <WorkflowNestedGraph
                 stepGraph={stepDetail.nestedGraph.stepGraph}
                 open={true}

packages/playground-ui/src/domains/workflows/workflow/workflow-nested-node.tsx

@@ -4,8 +4,7 @@ import { CircleDashed, HourglassIcon, Loader2, PauseIcon, ShieldAlert } from 'lu
 import { SerializedStepFlowEntry } from '@mastra/core/workflows';
 
 import { cn } from '@/lib/utils';
-import { useContext } from 'react';
-import { WorkflowNestedGraphContext } from '../context/workflow-nested-graph-context';
+import { useWorkflowStepDetail } from '../context/workflow-step-detail-context';
 import { useCurrentRun } from '../context/use-current-run';
 import { CheckIcon, CrossIcon, Icon } from '@/ds/icons';
 import { Txt } from '@/ds/components/Txt';
@@ -41,7 +40,7 @@ export function WorkflowNestedNode({
   stepsFlow,
 }: NodeProps<NestedNode> & WorkflowNestedNodeProps) {
   const { steps } = useCurrentRun();
-  const { showNestedGraph } = useContext(WorkflowNestedGraphContext);
+  const { showNestedGraph } = useWorkflowStepDetail();
 
   const {
     label,