0e09b33736
1. **✅ Added Missing Route** (`App.tsx:152-155`): ```typescript <Route path="/projects/:projectId/tasks/:taskId/full" element={<ProjectTasks />} /> ``` 2. **✅ Fixed setFullScreen Logic** (`project-tasks.tsx:320-332`): - Removed conditional blocking when `selectedAttempt` is null - Added auto-resolution logic for both cases (with/without attempt ID) 3. **✅ Enhanced TaskRelationshipCard** (`TaskRelationshipCard.tsx`): - Added `onClickFullscreen` prop and fullscreen button - Button appears as small maximize icon next to status badge - Stops click propagation to avoid conflicts 4. **✅ Updated TaskRelationshipViewer** (`TaskRelationshipViewer.tsx`): - Added `onNavigateToTaskFullscreen` prop - Wired up fullscreen navigation for both parent and child task cards 5. **✅ Connected Navigation Handlers** (`TaskDetailsPanel.tsx`): - Added `useNavigate` hook - Implemented fullscreen navigation using auto-resolution URLs 6. **✅ Updated handleViewTaskDetails** (`project-tasks.tsx:180-192`): - Added optional `fullscreen` parameter for future extensibility - **✅ Rust Clippy**: All checks passed with no warnings - **✅ Prettier Formatting**: All files now properly formatted - **❌ ESLint**: Has compatibility issues (unrelated to our changes) - **❌ TypeScript**: Environment issues with npx (unrelated to our changes) The ESLint and TypeScript issues appear to be environment/dependency related and not caused by our implementation changes. 1. **Navigate to fullscreen without attempts**: - URL `/projects/123/tasks/456/full` will show clean fullscreen interface - "No attempts yet" message with "Start Attempt" button 2. **Navigate to fullscreen from parent/child tasks**: - Click the maximize icon on any relationship card - Automatically navigates to `/projects/123/tasks/456/full` - Uses auto-resolution to show latest attempt or no-attempt state 3. **Existing functionality preserved**: - All current fullscreen navigation still works - Auto-resolution works for both sidebar and fullscreen modes - **✅ Leverages existing auto-resolution logic** - no duplication - **✅ User-friendly URLs** - bookmarkable and semantic - **✅ Graceful degradation** - works with or without attempts - **✅ Consistent behavior** - same patterns used throughout app - **✅ Future-proof** - scales as more attempts are added The implementation is complete and ready for use! 🎉 **Key Improvement**: Removed the redundant old navigate handler since users navigating to related tasks from fullscreen mode want to stay in fullscreen mode. 1. **✅ Simplified TaskRelationshipViewer Interface**: - Removed `onNavigateToTask` prop (no longer needed) - Only kept `onNavigateToTaskFullscreen` prop - Both `onClick` and `onClickFullscreen` now navigate to fullscreen mode 2. **✅ Updated TaskDetailsPanel**: - Removed the old `onNavigateToTask` prop from TaskRelationshipViewer - Only passes `onNavigateToTaskFullscreen` handler 3. **✅ Cleaner User Experience**: - Clicking anywhere on a relationship card → fullscreen navigation - Clicking the maximize icon → same fullscreen navigation - Users stay in fullscreen mode when exploring related tasks - **✅ Rust Clippy**: All checks passed with no warnings - **✅ Cargo Format**: All Rust code properly formatted - **✅ Prettier**: All TypeScript/React code properly formatted - **❌ ESLint**: Pre-existing environment/dependency compatibility issues (unrelated to our changes) The ESLint failure appears to be a `react-hooks/exhaustive-deps` rule compatibility issue with ESLint v9, which is unrelated to our implementation. ```typescript // Relationship navigation - clean and simple TaskRelationshipViewer({ selectedAttempt, onNavigateToTaskFullscreen: (taskId) => navigate(`/projects/${projectId}/tasks/${taskId}/full`) }) // Both click handlers navigate to fullscreen <TaskRelationshipCard onClick={() => onNavigateToTaskFullscreen(taskId)} // Entire card clickable onClickFullscreen={() => onNavigateToTaskFullscreen(taskId)} // Icon click /> ``` - **🎯 Focused workflow**: Related task navigation keeps users in fullscreen mode - **🔗 Auto-resolution URLs**: `/projects/123/tasks/456/full` works with or without attempts - **📱 Multiple interaction methods**: Click anywhere on card OR click maximize icon - **⚡ Consistent experience**: Same fullscreen behavior across the entire app The feature is **complete and ready for use**! Users can now seamlessly navigate between related tasks in fullscreen mode. 🚀 Perfect! I've implemented the minimal, non-overengineered solution as requested. **The Problem**: Users clicking parent/child tasks from fullscreen mode were navigating to sidebar view instead of staying in fullscreen. **The Solution**: Changed exactly **ONE LINE** of code in `project-tasks.tsx:316`: ```typescript // Before (goes to sidebar) handleViewTaskDetails(task); // After (goes to fullscreen) handleViewTaskDetails(task, undefined, true); ``` - **✅ Clean user experience**: Users in fullscreen mode stay in fullscreen when navigating to related tasks - **✅ Uses existing infrastructure**: No new buttons, no new props, no new components - **✅ Auto-resolution**: Works perfectly with the existing `/projects/:projectId/tasks/:taskId/full` route - **✅ Handles all cases**: Works with tasks that have attempts, tasks without attempts, and latest attempt fallback - **✅ Rust Clippy**: All checks passed - **✅ Cargo Format**: All code properly formatted - **✅ Prettier**: All frontend code properly formatted - **❌ ESLint**: Pre-existing environment compatibility issue (unrelated to our changes) The solution leverages: 1. **Existing route**: `/projects/:projectId/tasks/:taskId/full` (added earlier) 2. **Existing function**: `handleViewTaskDetails()` already supported a `fullscreen` parameter 3. **Existing UI**: TaskRelationshipCard components work exactly as before 4. **Existing auto-resolution**: Auto-resolves to latest attempt when no attempt specified **Result**: Users click the same relationship cards they always have, but now they stay in fullscreen mode. Simple, elegant, and minimal! 🎉 View parent for spinoff tasks (vibe-kanban 9b0fdbd7) For spinoff tasks without a task attempt, we don't see the parent in the task relationships. This was introduced in the last commit enabling full screen nav Keep fullscreen state for new tasks (vibe-kanban a8988027) When in fullscreen mode, new tasks attempts and spinoffs should nav to fullscreen as well.check the last two commits for related stuff. Cleanup New attempt keeps fullscreen state (vibe-kanban 1f323fd2) In the last 4 commits we changed things such that subtasks open in fullscreen when created and navigated to. the same thing should happen for new task attempts Lint Add nav hook Simplify nav hooks
Get 10X more out of Claude Code, Gemini CLI, Codex, Amp and other coding agents...
Overview
AI coding agents are increasingly writing the world's code and human engineers now spend the majority of their time planning, reviewing, and orchestrating tasks. Vibe Kanban streamlines this process, enabling you to:
- Easily switch between different coding agents
- Orchestrate the execution of multiple coding agents in parallel or in sequence
- Quickly review work and start dev servers
- Track the status of tasks that your coding agents are working on
- Centralise configuration of coding agent MCP configs
You can watch a video overview here.
Installation
Make sure you have authenticated with your favourite coding agent. A full list of supported coding agents can be found in the docs. Then in your terminal run:
npx vibe-kanban
Documentation
Please head to the website for the latest documentation and user guides.
Support
Please open an issue on this repo if you find any bugs or have any feature requests.
Contributing
We would prefer that ideas and changes are raised with the core team via GitHub issues, where we can discuss implementation details and alignment with the existing roadmap. Please do not open PRs without first discussing your proposal with the team.
Development
Prerequisites
Additional development tools:
cargo install cargo-watch
cargo install sqlx-cli
Install dependencies:
pnpm i
Running the dev server
pnpm run dev
This will start the frontend and backend with live reloading. A blank DB will be copied from the dev_assets_seed folder.
Build from source
- Run
build-npm-package.sh - In the
npx-clifolder runnpm pack - You can run your build with
npx [GENERATED FILE].tgz
Environment Variables
The following environment variables can be configured at build time or runtime:
| Variable | Type | Default | Description |
|---|---|---|---|
GITHUB_CLIENT_ID |
Build-time | Ov23li9bxz3kKfPOIsGm |
GitHub OAuth app client ID for authentication |
POSTHOG_API_KEY |
Build-time | Empty | PostHog analytics API key (disables analytics if empty) |
POSTHOG_API_ENDPOINT |
Build-time | Empty | PostHog analytics endpoint (disables analytics if empty) |
BACKEND_PORT |
Runtime | 0 (auto-assign) |
Backend server port |
FRONTEND_PORT |
Runtime | 3000 |
Frontend development server port |
HOST |
Runtime | 127.0.0.1 |
Backend server host |
DISABLE_WORKTREE_ORPHAN_CLEANUP |
Runtime | Not set | Disable git worktree cleanup (for debugging) |
Build-time variables must be set when running pnpm run build. Runtime variables are read when the application starts.
Custom GitHub OAuth App (Optional)
By default, Vibe Kanban uses Bloop AI's GitHub OAuth app for authentication. To use your own GitHub app for self-hosting or custom branding:
- Create a GitHub OAuth App at GitHub Developer Settings
- Enable "Device Flow" in the app settings
- Set scopes to include
user:email,repo - Build with your client ID:
GITHUB_CLIENT_ID=your_client_id_here pnpm run build