daonanchao/vibe-kanban
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Dev server disabled tooltip (vibe-kanban) (#245)

Browse Source 
* Great! The build was successful. The tooltip has been updated to show "Add a dev server script in project settings to enable this feature" when the dev server is disabled, which provides a clearer message to users about what they need to do to enable the dev server functionality.

The change I made:
- Updated the tooltip text from "Configure a dev server command in project settings" to "Add a dev server script in project settings to enable this feature"
- This makes it clearer that the user needs to add a script, not just configure one
- The tooltip now explicitly mentions enabling the feature

The tooltip will now properly remind users to add a dev server script in project settings when the dev server button is disabled.

* Excellent! The build is successful. Now the tooltip will show even when the dev server button is disabled because:

1. The `TooltipTrigger` now wraps the outer `div` instead of the disabled `Button`
2. The `div` can receive mouse events even when the button inside is disabled
3. The tooltip will display "Add a dev server script in project settings to enable this feature" when `projectHasDevScript` is false

This solves the issue where the tooltip wasn't showing when the button was disabled, providing users with the helpful reminder about configuring the dev server script in project settings.

* prettier
This commit is contained in:
Louis Knight-Webb
2025-07-18 10:02:22 +01:00
committed by GitHub
parent 37e030e23c
commit 48e608993a
1 changed files with 38 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
frontend/src/components/tasks/Toolbar/CurrentAttempt.tsx
View File

@@ -587,14 +587,14 @@ function CurrentAttempt({
<div className="col-span-4 flex flex-wrap items-center justify-between gap-2">
<div className="flex items-center gap-2 flex-wrap">
<div
className={!projectHasDevScript ? 'cursor-not-allowed' : ''}
onMouseEnter={() => setIsHoveringDevServer(true)}
onMouseLeave={() => setIsHoveringDevServer(false)}
>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div
className={!projectHasDevScript ? 'cursor-not-allowed' : ''}
onMouseEnter={() => setIsHoveringDevServer(true)}
onMouseLeave={() => setIsHoveringDevServer(false)}
>
<Button
variant={runningDevServer ? 'destructive' : 'outline'}
size="sm"
@@ -614,33 +614,36 @@ function CurrentAttempt({
</>
)}
</Button>
</TooltipTrigger>
<TooltipContent
className={runningDevServer ? 'max-w-2xl p-4' : ''}
side="top"
align="center"
avoidCollisions={true}
>
{!projectHasDevScript ? (
<p>Configure a dev server command in project settings</p>
) : runningDevServer && devServerDetails ? (
<div className="space-y-2">
<p className="text-sm font-medium">
Dev Server Logs (Last 10 lines):
</p>
<pre className="text-xs bg-muted p-2 rounded max-h-64 overflow-y-auto whitespace-pre-wrap">
{processedDevServerLogs}
</pre>
</div>
) : runningDevServer ? (
<p>Stop the running dev server</p>
) : (
<p>Start the dev server</p>
)}
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div>
</div>
</TooltipTrigger>
<TooltipContent
className={runningDevServer ? 'max-w-2xl p-4' : ''}
side="top"
align="center"
avoidCollisions={true}
>
{!projectHasDevScript ? (
<p>
Add a dev server script in project settings to enable this
feature
</p>
) : runningDevServer && devServerDetails ? (
<div className="space-y-2">
<p className="text-sm font-medium">
Dev Server Logs (Last 10 lines):
</p>
<pre className="text-xs bg-muted p-2 rounded max-h-64 overflow-y-auto whitespace-pre-wrap">
{processedDevServerLogs}
</pre>
</div>
) : runningDevServer ? (
<p>Stop the running dev server</p>
) : (
<p>Start the dev server</p>
)}
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div>
<div className="flex items-center gap-2 flex-wrap">