Skip to content

👁️ Preview & Dev Server Improvements #316

@vasconceloscezar

Description

@vasconceloscezar

Summary

Make the preview/dev server feature more accessible and visible. Currently preview is buried inside task view, and users can't tell which tasks have running servers.

Problems Identified

1. Preview Only Available Inside Tasks

Current: Preview functionality only accessible when a task is open.
Impact: Users create dummy tasks just to access preview for context gathering.

Solution:

  • Standalone "Preview" button in Kanban header or sidebar
  • Preview accessible from project level, not just task level
  • Quick preview without opening task details

2. Preview Button in Chat After Runs

Current: After task completes, no quick access to preview.
Impact: Extra clicks to verify changes visually.

Solution:

  • Add preview button in chat window after run completes
  • "View Changes" quick action alongside git actions
  • Preview thumbnail in completion message (optional)

3. No Indication of Running Dev Servers

Current: Can't tell which tasks have active dev servers.
Impact: Users don't know if preview is available, may start duplicate servers.

Solution:

  • Badge/indicator on task card when dev server running
  • List of active servers in project header
  • Quick stop/restart actions
  • Port number visible

4. Preview Icon Clarity

Current: Heart icon used for preview (mentioned as confusing).
Impact: Users don't recognize it as preview function.

Solution:

  • Use more intuitive icon (eye, monitor, browser)
  • Tooltip on hover explaining function
  • Consistent iconography

Acceptance Criteria

  • Preview accessible from Kanban without opening task
  • Preview button appears in chat after task completion
  • Running dev servers indicated on task cards
  • Preview icon is intuitive and clear

Technical Notes

Components:

  • New PreviewButton component for Kanban header
  • Update TaskCard with server status indicator
  • Add preview action to chat completion UI

Backend:

  • Already tracks dev server state
  • May need endpoint to list all running servers for project

Team Feedback Sources

  • Feedback 1: Preview only in tasks
  • Feedback 4: Preview button importance, placement

Priority

🟡 P1 - Medium (2/6 feedbacks, workflow improvement)

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions