Skip to content

Implement tooltip on custom call type#182

Open
kumaradityaraj wants to merge 1 commit into
serverlessworkflow:mainfrom
kumaradityaraj:hoverTooltip
Open

Implement tooltip on custom call type#182
kumaradityaraj wants to merge 1 commit into
serverlessworkflow:mainfrom
kumaradityaraj:hoverTooltip

Conversation

@kumaradityaraj

Copy link
Copy Markdown
Contributor

Closes

A small, reusable tooltip component and use it to replace the native browser title tooltip currently shown on custom call type badges.

Note - Tooltip hover style is breaking currently. A ss has been attached.

Screenshot 2026-06-17 at 2 54 20 PM

Signed-off-by: kumaradityaraj <sedulous.0007@gmail.com>
Copilot AI review requested due to automatic review settings June 17, 2026 09:42
@netlify

netlify Bot commented Jun 17, 2026

Copy link
Copy Markdown

Deploy Preview for swf-editor ready!

Name Link
🔨 Latest commit 1f1deda
🔍 Latest deploy log https://app.netlify.com/projects/swf-editor/deploys/6a326bff49d7a30008c6d9a3
😎 Deploy Preview https://deploy-preview-182--swf-editor.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Note

Copilot was unable to run its full agentic suite in this review.

This PR replaces the browser default title tooltip for unknown task badges with the app’s Tooltip component to provide a consistent UI.

Changes:

  • Adds Tooltip UI components to Nodes.tsx
  • Wraps custom/unknown badges with TooltipTrigger and TooltipContent
  • Introduces inline color styling based on prefers-color-scheme

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@kumaradityaraj

Copy link
Copy Markdown
Contributor Author

@lornakelly Please review this.

</span>
<Tooltip>
<TooltipTrigger asChild>
<span className="dec-task-node-badge-custom" data-testid={`${testId}-custom`}>

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The span here should be removed, that was temporary for the browser tooltip , please also remove the associated css

<TooltipContent>
<p
style={{
color: window.matchMedia("(prefers-color-scheme: dark)").matches ? "#fff" : "#000",

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be done in css and follow the same pattern the other components do for styling light and dark modes (in css files you will see classes with .dark)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants