fix(blocks): render tooltip field in sub-block label#4073
fix(blocks): render tooltip field in sub-block label#4073minijeong-log wants to merge 2 commits intosimstudioai:stagingfrom
Conversation
PR SummaryLow Risk Overview Also makes the tooltip trigger wrappers keyboard-focusable (adds Reviewed by Cursor Bugbot for commit 4891982. Bugbot is set up for automated code reviews on this repo. Configure here. |
|
The latest updates on your projects. Learn more about Vercel for GitHub. |
Greptile SummaryThis PR wires up the previously unrendered Confidence Score: 5/5Safe to merge — minimal, well-scoped change that follows established patterns in the file. The only finding is a P2 accessibility suggestion (missing tabIndex on the tooltip trigger span), which also applies to the pre-existing AlertTriangle trigger. No logic, data, or security concerns. No files require special attention.
|
| Filename | Overview |
|---|---|
| apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/sub-block.tsx | Adds conditional Info-icon tooltip rendering in renderLabel when config.tooltip is set; follows the existing AlertTriangle tooltip pattern exactly. |
Flowchart
%%{init: {'theme': 'neutral'}}%%
flowchart TD
A[renderLabel called] --> B{config.title?}
B -- No --> Z[return null]
B -- Yes --> C{config.type === 'switch'?}
C -- Yes --> Z
C -- No --> D[Render Label container]
D --> E[Render title text]
E --> F{required?}
F -- Yes --> G[Render asterisk span]
F -- No --> H
G --> H{config.tooltip?}
H -- Yes --> I[Render Info icon + Tooltip.Root]
H -- No --> J
I --> J[Render labelSuffix]
J --> K{code + JSON + invalid?}
K -- Yes --> L[Render AlertTriangle + Tooltip.Root]
K -- No --> M[Render action buttons]
L --> M
Reviews (1): Last reviewed commit: "fix(blocks): render tooltip field in sub..." | Re-trigger Greptile
| <Tooltip.Trigger asChild> | ||
| <span className='inline-flex'> | ||
| <Info className='h-3 w-3 flex-shrink-0 cursor-pointer text-muted-foreground' /> | ||
| </span> |
There was a problem hiding this comment.
Tooltip trigger not keyboard-accessible
The <span> wrapping the Info icon has no tabIndex, so keyboard-only users cannot focus it to trigger the tooltip. Adding tabIndex={0} (and a matching role) makes it reachable via Tab. Note: the existing AlertTriangle trigger below uses the same pattern, so this affects both.
| <Tooltip.Trigger asChild> | |
| <span className='inline-flex'> | |
| <Info className='h-3 w-3 flex-shrink-0 cursor-pointer text-muted-foreground' /> | |
| </span> | |
| <span className='inline-flex' tabIndex={0} role='button'> |
Signed-off-by: Mini Jeong <mini.jeong@navercorp.com>
Signed-off-by: Mini Jeong <mini.jeong@navercorp.com>
589d26d to
4891982
Compare
Summary
SubBlockConfig.tooltipwas typed inblocks/types.ts(added in commit 8215a81) but never rendered insub-block.tsxInfoicon next to the field label that shows the tooltip text on hoverTooltip.Root/Trigger/Contentpattern already present in the same fileChanges
apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/panel/components/editor/components/sub-block/sub-block.tsxInfoto lucide-react importsrenderLabelTest plan
tooltip: 'some help text'to a subBlock in any block configFixes #4071