fix: tm show UI

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

.changeset/config.json

@@ -6,7 +6,7 @@
       "repo": "eyaltoledano/claude-task-master"
     }
   ],
-  "commit": false,
+  "commit": true,
   "fixed": [],
   "linked": [],
   "access": "public",

.changeset/wild-ears-look.md

@@ -0,0 +1,5 @@
+---
+"extension": minor
+---
+
+Added a Start Build button to the VSCODE Task Properties Right Panel

.github/workflows/ci.yml

@@ -61,7 +61,7 @@ jobs:
         timeout-minutes: 5
 
       - name: Typecheck
-        run: npm run typecheck
+        run: npm run turbo:typecheck
         env:
           FORCE_COLOR: 1
 
@@ -84,7 +84,7 @@ jobs:
         timeout-minutes: 5
 
       - name: Build
-        run: npm run build
+        run: npm run turbo:build
         env:
           NODE_ENV: production
           FORCE_COLOR: 1

.gitignore

@@ -94,3 +94,6 @@ apps/extension/.vscode-test/
 
 # apps/extension
 apps/extension/vsix-build/
+
+# turbo
+.turbo

apps/cli/package.json

@@ -6,15 +6,10 @@
 	"main": "./dist/index.js",
 	"types": "./src/index.ts",
 	"exports": {
-		".": {
-			"types": "./src/index.ts",
-			"import": "./dist/index.js"
-		}
+		".": "./src/index.ts"
 	},
 	"files": ["dist", "README.md"],
 	"scripts": {
-		"build": "tsup",
-		"dev": "tsup --watch",
 		"typecheck": "tsc --noEmit",
 		"lint": "biome check src",
 		"format": "biome format --write src",
@@ -37,10 +32,8 @@
 	},
 	"devDependencies": {
 		"@biomejs/biome": "^1.9.4",
-		"@tm/build-config": "*",
 		"@types/inquirer": "^9.0.3",
 		"@types/node": "^22.10.5",
-		"tsup": "^8.3.0",
 		"tsx": "^4.20.4",
 		"typescript": "^5.7.3",
 		"vitest": "^2.1.8"
@@ -50,5 +43,10 @@
 	},
 	"keywords": ["task-master", "cli", "task-management", "productivity"],
 	"author": "",
-	"license": "MIT"
+	"license": "MIT",
+	"typesVersions": {
+		"*": {
+			"*": ["src/*"]
+		}
+	}
 }

apps/cli/src/commands/list.command.ts

@@ -17,6 +17,18 @@ import {
 } from '@tm/core';
 import type { StorageType } from '@tm/core/types';
 import * as ui from '../utils/ui.js';
+import {
+	displayHeader,
+	displayDashboards,
+	calculateTaskStatistics,
+	calculateSubtaskStatistics,
+	calculateDependencyStatistics,
+	getPriorityBreakdown,
+	displayRecommendedNextTask,
+	getTaskDescription,
+	displaySuggestedNextSteps,
+	type NextTaskInfo
+} from '../ui/index.js';
 
 /**
  * Options interface for the list command
@@ -173,13 +185,6 @@ export class ListTasksCommand extends Command {
 			includeSubtasks: options.withSubtasks
 		});
 
-		// Runtime guard to prevent 'auto' from reaching CLI consumers
-		if (result.storageType === 'auto') {
-			throw new Error(
-				'Internal error: unresolved storage type reached CLI. Please check TaskService.getStorageType() implementation.'
-			);
-		}
-
 		return result as ListTasksResult;
 	}
 
@@ -252,19 +257,16 @@ export class ListTasksCommand extends Command {
 	 * Display in text format with tables
 	 */
 	private displayText(data: ListTasksResult, withSubtasks?: boolean): void {
-		const { tasks, total, filtered, tag, storageType } = data;
+		const { tasks, tag } = data;
 
-		// Header
-		ui.displayBanner(`Task List${tag ? ` (${tag})` : ''}`);
+		// Get file path for display
+		const filePath = this.tmCore ? `.taskmaster/tasks/tasks.json` : undefined;
 
-		// Statistics
-		console.log(chalk.blue.bold('\n📊 Statistics:\n'));
-		console.log(`  Total tasks: ${chalk.cyan(total)}`);
-		console.log(`  Filtered: ${chalk.cyan(filtered)}`);
-		if (tag) {
-			console.log(`  Tag: ${chalk.cyan(tag)}`);
-		}
-		console.log(`  Storage: ${chalk.cyan(storageType)}`);
+		// Display header without banner (banner already shown by main CLI)
+		displayHeader({
+			tag: tag || 'master',
+			filePath: filePath
+		});
 
 		// No tasks message
 		if (tasks.length === 0) {
@@ -272,21 +274,50 @@ export class ListTasksCommand extends Command {
 			return;
 		}
 
-		// Task table
-		console.log(chalk.blue.bold(`\n📋 Tasks (${tasks.length}):\n`));
+		// Calculate statistics
+		const taskStats = calculateTaskStatistics(tasks);
+		const subtaskStats = calculateSubtaskStatistics(tasks);
+		const depStats = calculateDependencyStatistics(tasks);
+		const priorityBreakdown = getPriorityBreakdown(tasks);
+
+		// Find next task following the same logic as findNextTask
+		const nextTask = this.findNextTask(tasks);
+
+		// Display dashboard boxes
+		displayDashboards(
+			taskStats,
+			subtaskStats,
+			priorityBreakdown,
+			depStats,
+			nextTask
+		);
+
+		// Task table - no title, just show the table directly
 		console.log(
 			ui.createTaskTable(tasks, {
 				showSubtasks: withSubtasks,
-				showDependencies: true
+				showDependencies: true,
+				showComplexity: true // Enable complexity column
 			})
 		);
 
-		// Progress bar
-		const completedCount = tasks.filter(
-			(t: Task) => t.status === 'done'
-		).length;
-		console.log(chalk.blue.bold('\n📊 Overall Progress:\n'));
-		console.log(`  ${ui.createProgressBar(completedCount, tasks.length)}`);
+		// Display recommended next task section immediately after table
+		if (nextTask) {
+			// Find the full task object to get description
+			const fullTask = tasks.find((t) => String(t.id) === String(nextTask.id));
+			const description = fullTask ? getTaskDescription(fullTask) : undefined;
+
+			displayRecommendedNextTask({
+				...nextTask,
+				status: 'pending', // Next task is typically pending
+				description
+			});
+		} else {
+			displayRecommendedNextTask(undefined);
+		}
+
+		// Display suggested next steps at the end
+		displaySuggestedNextSteps();
 	}
 
 	/**
@@ -296,6 +327,128 @@ export class ListTasksCommand extends Command {
 		this.lastResult = result;
 	}
 
+	/**
+	 * Find the next task to work on
+	 * Implements the same logic as scripts/modules/task-manager/find-next-task.js
+	 */
+	private findNextTask(tasks: Task[]): NextTaskInfo | undefined {
+		const priorityValues: Record<string, number> = {
+			critical: 4,
+			high: 3,
+			medium: 2,
+			low: 1
+		};
+
+		// Build set of completed task IDs (including subtasks)
+		const completedIds = new Set<string>();
+		tasks.forEach((t) => {
+			if (t.status === 'done' || t.status === 'completed') {
+				completedIds.add(String(t.id));
+			}
+			if (t.subtasks) {
+				t.subtasks.forEach((st) => {
+					if (st.status === 'done' || st.status === 'completed') {
+						completedIds.add(`${t.id}.${st.id}`);
+					}
+				});
+			}
+		});
+
+		// First, look for eligible subtasks in in-progress parent tasks
+		const candidateSubtasks: NextTaskInfo[] = [];
+
+		tasks
+			.filter(
+				(t) => t.status === 'in-progress' && t.subtasks && t.subtasks.length > 0
+			)
+			.forEach((parent) => {
+				parent.subtasks!.forEach((st) => {
+					const stStatus = (st.status || 'pending').toLowerCase();
+					if (stStatus !== 'pending' && stStatus !== 'in-progress') return;
+
+					// Check if dependencies are satisfied
+					const fullDeps =
+						st.dependencies?.map((d) => {
+							// Handle both numeric and string IDs
+							if (typeof d === 'string' && d.includes('.')) {
+								return d;
+							}
+							return `${parent.id}.${d}`;
+						}) ?? [];
+
+					const depsSatisfied =
+						fullDeps.length === 0 ||
+						fullDeps.every((depId) => completedIds.has(String(depId)));
+
+					if (depsSatisfied) {
+						candidateSubtasks.push({
+							id: `${parent.id}.${st.id}`,
+							title: st.title || `Subtask ${st.id}`,
+							priority: st.priority || parent.priority || 'medium',
+							dependencies: fullDeps.map((d) => String(d))
+						});
+					}
+				});
+			});
+
+		if (candidateSubtasks.length > 0) {
+			// Sort by priority, then by dependencies count, then by ID
+			candidateSubtasks.sort((a, b) => {
+				const pa = priorityValues[a.priority || 'medium'] ?? 2;
+				const pb = priorityValues[b.priority || 'medium'] ?? 2;
+				if (pb !== pa) return pb - pa;
+
+				const depCountA = a.dependencies?.length || 0;
+				const depCountB = b.dependencies?.length || 0;
+				if (depCountA !== depCountB) return depCountA - depCountB;
+
+				return String(a.id).localeCompare(String(b.id));
+			});
+			return candidateSubtasks[0];
+		}
+
+		// Fall back to finding eligible top-level tasks
+		const eligibleTasks = tasks.filter((task) => {
+			// Skip non-eligible statuses
+			const status = (task.status || 'pending').toLowerCase();
+			if (status !== 'pending' && status !== 'in-progress') return false;
+
+			// Check dependencies
+			const deps = task.dependencies || [];
+			const depsSatisfied =
+				deps.length === 0 ||
+				deps.every((depId) => completedIds.has(String(depId)));
+
+			return depsSatisfied;
+		});
+
+		if (eligibleTasks.length === 0) return undefined;
+
+		// Sort eligible tasks
+		eligibleTasks.sort((a, b) => {
+			// Priority (higher first)
+			const pa = priorityValues[a.priority || 'medium'] ?? 2;
+			const pb = priorityValues[b.priority || 'medium'] ?? 2;
+			if (pb !== pa) return pb - pa;
+
+			// Dependencies count (fewer first)
+			const depCountA = a.dependencies?.length || 0;
+			const depCountB = b.dependencies?.length || 0;
+			if (depCountA !== depCountB) return depCountA - depCountB;
+
+			// ID (lower first)
+			return Number(a.id) - Number(b.id);
+		});
+
+		const nextTask = eligibleTasks[0];
+		return {
+			id: nextTask.id,
+			title: nextTask.title,
+			priority: nextTask.priority,
+			dependencies: nextTask.dependencies?.map((d) => String(d))
+		};
+	}
+
 	/**
 	 * Get the last result (for programmatic usage)
 	 */

apps/cli/src/commands/show.command.ts

@@ -0,0 +1,383 @@
+/**
+ * @fileoverview ShowCommand using Commander's native class pattern
+ * Extends Commander.Command for better integration with the framework
+ */
+
+import { Command } from 'commander';
+import chalk from 'chalk';
+import boxen from 'boxen';
+import { createTaskMasterCore, type Task, type TaskMasterCore } from '@tm/core';
+import type { StorageType } from '@tm/core/types';
+import * as ui from '../utils/ui.js';
+import {
+	displayTaskHeader,
+	displayTaskProperties,
+	displayImplementationDetails,
+	displayTestStrategy,
+	displaySubtasks,
+	displaySuggestedActions
+} from '../ui/components/task-detail.component.js';
+
+/**
+ * Options interface for the show command
+ */
+export interface ShowCommandOptions {
+	id?: string;
+	status?: string;
+	format?: 'text' | 'json';
+	silent?: boolean;
+	project?: string;
+}
+
+/**
+ * Result type from show command
+ */
+export interface ShowTaskResult {
+	task: Task | null;
+	found: boolean;
+	storageType: Exclude<StorageType, 'auto'>;
+}
+
+/**
+ * Result type for multiple tasks
+ */
+export interface ShowMultipleTasksResult {
+	tasks: Task[];
+	notFound: string[];
+	storageType: Exclude<StorageType, 'auto'>;
+}
+
+/**
+ * ShowCommand extending Commander's Command class
+ * This is a thin presentation layer over @tm/core
+ */
+export class ShowCommand extends Command {
+	private tmCore?: TaskMasterCore;
+	private lastResult?: ShowTaskResult | ShowMultipleTasksResult;
+
+	constructor(name?: string) {
+		super(name || 'show');
+
+		// Configure the command
+		this.description('Display detailed information about one or more tasks')
+			.argument('[id]', 'Task ID(s) to show (comma-separated for multiple)')
+			.option(
+				'-i, --id <id>',
+				'Task ID(s) to show (comma-separated for multiple)'
+			)
+			.option('-s, --status <status>', 'Filter subtasks by status')
+			.option('-f, --format <format>', 'Output format (text, json)', 'text')
+			.option('--silent', 'Suppress output (useful for programmatic usage)')
+			.option('-p, --project <path>', 'Project root directory', process.cwd())
+			.action(
+				async (taskId: string | undefined, options: ShowCommandOptions) => {
+					await this.executeCommand(taskId, options);
+				}
+			);
+	}
+
+	/**
+	 * Execute the show command
+	 */
+	private async executeCommand(
+		taskId: string | undefined,
+		options: ShowCommandOptions
+	): Promise<void> {
+		try {
+			// Validate options
+			if (!this.validateOptions(options)) {
+				process.exit(1);
+			}
+
+			// Initialize tm-core
+			await this.initializeCore(options.project || process.cwd());
+
+			// Get the task ID from argument or option
+			const idArg = taskId || options.id;
+			if (!idArg) {
+				console.error(chalk.red('Error: Please provide a task ID'));
+				process.exit(1);
+			}
+
+			// Check if multiple IDs are provided (comma-separated)
+			const taskIds = idArg
+				.split(',')
+				.map((id) => id.trim())
+				.filter((id) => id.length > 0);
+
+			// Get tasks from core
+			const result =
+				taskIds.length > 1
+					? await this.getMultipleTasks(taskIds, options)
+					: await this.getSingleTask(taskIds[0], options);
+
+			// Store result for programmatic access
+			this.setLastResult(result);
+
+			// Display results
+			if (!options.silent) {
+				this.displayResults(result, options);
+			}
+		} catch (error: any) {
+			const msg = error?.getSanitizedDetails?.() ?? {
+				message: error?.message ?? String(error)
+			};
+			console.error(chalk.red(`Error: ${msg.message || 'Unexpected error'}`));
+			if (error.stack && process.env.DEBUG) {
+				console.error(chalk.gray(error.stack));
+			}
+			process.exit(1);
+		}
+	}
+
+	/**
+	 * Validate command options
+	 */
+	private validateOptions(options: ShowCommandOptions): boolean {
+		// Validate format
+		if (options.format && !['text', 'json'].includes(options.format)) {
+			console.error(chalk.red(`Invalid format: ${options.format}`));
+			console.error(chalk.gray(`Valid formats: text, json`));
+			return false;
+		}
+
+		return true;
+	}
+
+	/**
+	 * Initialize TaskMasterCore
+	 */
+	private async initializeCore(projectRoot: string): Promise<void> {
+		if (!this.tmCore) {
+			this.tmCore = await createTaskMasterCore({ projectPath: projectRoot });
+		}
+	}
+
+	/**
+	 * Get a single task from tm-core
+	 */
+	private async getSingleTask(
+		taskId: string,
+		_options: ShowCommandOptions
+	): Promise<ShowTaskResult> {
+		if (!this.tmCore) {
+			throw new Error('TaskMasterCore not initialized');
+		}
+
+		// Get the task
+		const task = await this.tmCore.getTask(taskId);
+
+		// Get storage type
+		const storageType = this.tmCore.getStorageType();
+
+		return {
+			task,
+			found: task !== null,
+			storageType: storageType as Exclude<StorageType, 'auto'>
+		};
+	}
+
+	/**
+	 * Get multiple tasks from tm-core
+	 */
+	private async getMultipleTasks(
+		taskIds: string[],
+		_options: ShowCommandOptions
+	): Promise<ShowMultipleTasksResult> {
+		if (!this.tmCore) {
+			throw new Error('TaskMasterCore not initialized');
+		}
+
+		const tasks: Task[] = [];
+		const notFound: string[] = [];
+
+		// Get each task individually
+		for (const taskId of taskIds) {
+			const task = await this.tmCore.getTask(taskId);
+			if (task) {
+				tasks.push(task);
+			} else {
+				notFound.push(taskId);
+			}
+		}
+
+		// Get storage type
+		const storageType = this.tmCore.getStorageType();
+
+		return {
+			tasks,
+			notFound,
+			storageType: storageType as Exclude<StorageType, 'auto'>
+		};
+	}
+
+	/**
+	 * Display results based on format
+	 */
+	private displayResults(
+		result: ShowTaskResult | ShowMultipleTasksResult,
+		options: ShowCommandOptions
+	): void {
+		const format = options.format || 'text';
+
+		switch (format) {
+			case 'json':
+				this.displayJson(result);
+				break;
+
+			case 'text':
+			default:
+				if ('task' in result) {
+					// Single task result
+					this.displaySingleTask(result, options);
+				} else {
+					// Multiple tasks result
+					this.displayMultipleTasks(result, options);
+				}
+				break;
+		}
+	}
+
+	/**
+	 * Display in JSON format
+	 */
+	private displayJson(result: ShowTaskResult | ShowMultipleTasksResult): void {
+		console.log(JSON.stringify(result, null, 2));
+	}
+
+	/**
+	 * Display a single task in text format
+	 */
+	private displaySingleTask(
+		result: ShowTaskResult,
+		options: ShowCommandOptions
+	): void {
+		if (!result.found || !result.task) {
+			console.log(
+				boxen(chalk.yellow(`Task not found!`), {
+					padding: { top: 0, bottom: 0, left: 1, right: 1 },
+					borderColor: 'yellow',
+					borderStyle: 'round',
+					margin: { top: 1 }
+				})
+			);
+			return;
+		}
+
+		const task = result.task;
+
+		// Display header with tag
+		displayTaskHeader(task.id, task.title);
+
+		// Display task properties in table format
+		displayTaskProperties(task);
+
+		// Display implementation details if available
+		if (task.details) {
+			console.log(); // Empty line for spacing
+			displayImplementationDetails(task.details);
+		}
+
+		// Display test strategy if available
+		if ('testStrategy' in task && task.testStrategy) {
+			console.log(); // Empty line for spacing
+			displayTestStrategy(task.testStrategy as string);
+		}
+
+		// Display subtasks if available
+		if (task.subtasks && task.subtasks.length > 0) {
+			// Filter subtasks by status if provided
+			const filteredSubtasks = options.status
+				? task.subtasks.filter((sub) => sub.status === options.status)
+				: task.subtasks;
+
+			if (filteredSubtasks.length === 0 && options.status) {
+				console.log(
+					chalk.gray(`  No subtasks with status '${options.status}'`)
+				);
+			} else {
+				displaySubtasks(filteredSubtasks, task.id);
+			}
+		}
+
+		// Display suggested actions
+		displaySuggestedActions(task.id);
+	}
+
+	/**
+	 * Display multiple tasks in text format
+	 */
+	private displayMultipleTasks(
+		result: ShowMultipleTasksResult,
+		_options: ShowCommandOptions
+	): void {
+		// Header
+		ui.displayBanner(`Tasks (${result.tasks.length} found)`);
+
+		if (result.notFound.length > 0) {
+			console.log(chalk.yellow(`\n⚠ Not found: ${result.notFound.join(', ')}`));
+		}
+
+		if (result.tasks.length === 0) {
+			ui.displayWarning('No tasks found matching the criteria.');
+			return;
+		}
+
+		// Task table
+		console.log(chalk.blue.bold(`\n📋 Tasks:\n`));
+		console.log(
+			ui.createTaskTable(result.tasks, {
+				showSubtasks: true,
+				showDependencies: true
+			})
+		);
+
+		console.log(`\n${chalk.gray('Storage: ' + result.storageType)}`);
+	}
+
+	/**
+	 * Set the last result for programmatic access
+	 */
+	private setLastResult(
+		result: ShowTaskResult | ShowMultipleTasksResult
+	): void {
+		this.lastResult = result;
+	}
+
+	/**
+	 * Get the last result (for programmatic usage)
+	 */
+	getLastResult(): ShowTaskResult | ShowMultipleTasksResult | undefined {
+		return this.lastResult;
+	}
+
+	/**
+	 * Clean up resources
+	 */
+	async cleanup(): Promise<void> {
+		if (this.tmCore) {
+			await this.tmCore.close();
+			this.tmCore = undefined;
+		}
+	}
+
+	/**
+	 * Static method to register this command on an existing program
+	 * This is for gradual migration - allows commands.js to use this
+	 */
+	static registerOn(program: Command): Command {
+		const showCommand = new ShowCommand();
+		program.addCommand(showCommand);
+		return showCommand;
+	}
+
+	/**
+	 * Alternative registration that returns the command for chaining
+	 * Can also configure the command name if needed
+	 */
+	static register(program: Command, name?: string): ShowCommand {
+		const showCommand = new ShowCommand(name);
+		program.addCommand(showCommand);
+		return showCommand;
+	}
+}

apps/cli/src/index.ts

@@ -5,6 +5,7 @@
 
 // Commands
 export { ListTasksCommand } from './commands/list.command.js';
+export { ShowCommand } from './commands/show.command.js';
 export { AuthCommand } from './commands/auth.command.js';
 export { ContextCommand } from './commands/context.command.js';
 

apps/cli/src/ui/components/dashboard.component.ts

@@ -0,0 +1,567 @@
+/**
+ * @fileoverview Dashboard components for Task Master CLI
+ * Displays project statistics and dependency information
+ */
+
+import chalk from 'chalk';
+import boxen from 'boxen';
+import type { Task, TaskPriority } from '@tm/core/types';
+
+/**
+ * Statistics for task collection
+ */
+export interface TaskStatistics {
+	total: number;
+	done: number;
+	inProgress: number;
+	pending: number;
+	blocked: number;
+	deferred: number;
+	cancelled: number;
+	review?: number;
+	completionPercentage: number;
+}
+
+/**
+ * Statistics for dependencies
+ */
+export interface DependencyStatistics {
+	tasksWithNoDeps: number;
+	tasksReadyToWork: number;
+	tasksBlockedByDeps: number;
+	mostDependedOnTaskId?: number;
+	mostDependedOnCount?: number;
+	avgDependenciesPerTask: number;
+}
+
+/**
+ * Next task information
+ */
+export interface NextTaskInfo {
+	id: string | number;
+	title: string;
+	priority?: TaskPriority;
+	dependencies?: (string | number)[];
+	complexity?: number | string;
+}
+
+/**
+ * Status breakdown for progress bars
+ */
+export interface StatusBreakdown {
+	'in-progress'?: number;
+	pending?: number;
+	blocked?: number;
+	deferred?: number;
+	cancelled?: number;
+	review?: number;
+}
+
+/**
+ * Create a progress bar with color-coded status segments
+ */
+function createProgressBar(
+	completionPercentage: number,
+	width: number = 30,
+	statusBreakdown?: StatusBreakdown
+): string {
+	// If no breakdown provided, use simple green bar
+	if (!statusBreakdown) {
+		const filled = Math.round((completionPercentage / 100) * width);
+		const empty = width - filled;
+		return chalk.green('█').repeat(filled) + chalk.gray('░').repeat(empty);
+	}
+
+	// Build the bar with different colored sections
+	// Order matches the status display: Done, Cancelled, Deferred, In Progress, Review, Pending, Blocked
+	let bar = '';
+	let charsUsed = 0;
+
+	// 1. Green filled blocks for completed tasks (done)
+	const completedChars = Math.round((completionPercentage / 100) * width);
+	if (completedChars > 0) {
+		bar += chalk.green('█').repeat(completedChars);
+		charsUsed += completedChars;
+	}
+
+	// 2. Gray filled blocks for cancelled (won't be done)
+	if (statusBreakdown.cancelled && charsUsed < width) {
+		const cancelledChars = Math.round(
+			(statusBreakdown.cancelled / 100) * width
+		);
+		const actualChars = Math.min(cancelledChars, width - charsUsed);
+		if (actualChars > 0) {
+			bar += chalk.gray('█').repeat(actualChars);
+			charsUsed += actualChars;
+		}
+	}
+
+	// 3. Gray filled blocks for deferred (won't be done now)
+	if (statusBreakdown.deferred && charsUsed < width) {
+		const deferredChars = Math.round((statusBreakdown.deferred / 100) * width);
+		const actualChars = Math.min(deferredChars, width - charsUsed);
+		if (actualChars > 0) {
+			bar += chalk.gray('█').repeat(actualChars);
+			charsUsed += actualChars;
+		}
+	}
+
+	// 4. Blue filled blocks for in-progress (actively working)
+	if (statusBreakdown['in-progress'] && charsUsed < width) {
+		const inProgressChars = Math.round(
+			(statusBreakdown['in-progress'] / 100) * width
+		);
+		const actualChars = Math.min(inProgressChars, width - charsUsed);
+		if (actualChars > 0) {
+			bar += chalk.blue('█').repeat(actualChars);
+			charsUsed += actualChars;
+		}
+	}
+
+	// 5. Magenta empty blocks for review (almost done)
+	if (statusBreakdown.review && charsUsed < width) {
+		const reviewChars = Math.round((statusBreakdown.review / 100) * width);
+		const actualChars = Math.min(reviewChars, width - charsUsed);
+		if (actualChars > 0) {
+			bar += chalk.magenta('░').repeat(actualChars);
+			charsUsed += actualChars;
+		}
+	}
+
+	// 6. Yellow empty blocks for pending (ready to start)
+	if (statusBreakdown.pending && charsUsed < width) {
+		const pendingChars = Math.round((statusBreakdown.pending / 100) * width);
+		const actualChars = Math.min(pendingChars, width - charsUsed);
+		if (actualChars > 0) {
+			bar += chalk.yellow('░').repeat(actualChars);
+			charsUsed += actualChars;
+		}
+	}
+
+	// 7. Red empty blocks for blocked (can't start yet)
+	if (statusBreakdown.blocked && charsUsed < width) {
+		const blockedChars = Math.round((statusBreakdown.blocked / 100) * width);
+		const actualChars = Math.min(blockedChars, width - charsUsed);
+		if (actualChars > 0) {
+			bar += chalk.red('░').repeat(actualChars);
+			charsUsed += actualChars;
+		}
+	}
+
+	// Fill any remaining space with gray empty yellow blocks
+	if (charsUsed < width) {
+		bar += chalk.yellow('░').repeat(width - charsUsed);
+	}
+
+	return bar;
+}
+
+/**
+ * Calculate task statistics from a list of tasks
+ */
+export function calculateTaskStatistics(tasks: Task[]): TaskStatistics {
+	const stats: TaskStatistics = {
+		total: tasks.length,
+		done: 0,
+		inProgress: 0,
+		pending: 0,
+		blocked: 0,
+		deferred: 0,
+		cancelled: 0,
+		review: 0,
+		completionPercentage: 0
+	};
+
+	tasks.forEach((task) => {
+		switch (task.status) {
+			case 'done':
+				stats.done++;
+				break;
+			case 'in-progress':
+				stats.inProgress++;
+				break;
+			case 'pending':
+				stats.pending++;
+				break;
+			case 'blocked':
+				stats.blocked++;
+				break;
+			case 'deferred':
+				stats.deferred++;
+				break;
+			case 'cancelled':
+				stats.cancelled++;
+				break;
+			case 'review':
+				stats.review = (stats.review || 0) + 1;
+				break;
+		}
+	});
+
+	stats.completionPercentage =
+		stats.total > 0 ? Math.round((stats.done / stats.total) * 100) : 0;
+
+	return stats;
+}
+
+/**
+ * Calculate subtask statistics from tasks
+ */
+export function calculateSubtaskStatistics(tasks: Task[]): TaskStatistics {
+	const stats: TaskStatistics = {
+		total: 0,
+		done: 0,
+		inProgress: 0,
+		pending: 0,
+		blocked: 0,
+		deferred: 0,
+		cancelled: 0,
+		review: 0,
+		completionPercentage: 0
+	};
+
+	tasks.forEach((task) => {
+		if (task.subtasks && task.subtasks.length > 0) {
+			task.subtasks.forEach((subtask) => {
+				stats.total++;
+				switch (subtask.status) {
+					case 'done':
+						stats.done++;
+						break;
+					case 'in-progress':
+						stats.inProgress++;
+						break;
+					case 'pending':
+						stats.pending++;
+						break;
+					case 'blocked':
+						stats.blocked++;
+						break;
+					case 'deferred':
+						stats.deferred++;
+						break;
+					case 'cancelled':
+						stats.cancelled++;
+						break;
+					case 'review':
+						stats.review = (stats.review || 0) + 1;
+						break;
+				}
+			});
+		}
+	});
+
+	stats.completionPercentage =
+		stats.total > 0 ? Math.round((stats.done / stats.total) * 100) : 0;
+
+	return stats;
+}
+
+/**
+ * Calculate dependency statistics
+ */
+export function calculateDependencyStatistics(
+	tasks: Task[]
+): DependencyStatistics {
+	const completedTaskIds = new Set(
+		tasks.filter((t) => t.status === 'done').map((t) => t.id)
+	);
+
+	const tasksWithNoDeps = tasks.filter(
+		(t) =>
+			t.status !== 'done' && (!t.dependencies || t.dependencies.length === 0)
+	).length;
+
+	const tasksWithAllDepsSatisfied = tasks.filter(
+		(t) =>
+			t.status !== 'done' &&
+			t.dependencies &&
+			t.dependencies.length > 0 &&
+			t.dependencies.every((depId) => completedTaskIds.has(depId))
+	).length;
+
+	const tasksBlockedByDeps = tasks.filter(
+		(t) =>
+			t.status !== 'done' &&
+			t.dependencies &&
+			t.dependencies.length > 0 &&
+			!t.dependencies.every((depId) => completedTaskIds.has(depId))
+	).length;
+
+	// Calculate most depended-on task
+	const dependencyCount: Record<string, number> = {};
+	tasks.forEach((task) => {
+		if (task.dependencies && task.dependencies.length > 0) {
+			task.dependencies.forEach((depId) => {
+				const key = String(depId);
+				dependencyCount[key] = (dependencyCount[key] || 0) + 1;
+			});
+		}
+	});
+
+	let mostDependedOnTaskId: number | undefined;
+	let mostDependedOnCount = 0;
+
+	for (const [taskId, count] of Object.entries(dependencyCount)) {
+		if (count > mostDependedOnCount) {
+			mostDependedOnCount = count;
+			mostDependedOnTaskId = parseInt(taskId);
+		}
+	}
+
+	// Calculate average dependencies
+	const totalDependencies = tasks.reduce(
+		(sum, task) => sum + (task.dependencies ? task.dependencies.length : 0),
+		0
+	);
+	const avgDependenciesPerTask =
+		tasks.length > 0 ? totalDependencies / tasks.length : 0;
+
+	return {
+		tasksWithNoDeps,
+		tasksReadyToWork: tasksWithNoDeps + tasksWithAllDepsSatisfied,
+		tasksBlockedByDeps,
+		mostDependedOnTaskId,
+		mostDependedOnCount,
+		avgDependenciesPerTask
+	};
+}
+
+/**
+ * Get priority counts
+ */
+export function getPriorityBreakdown(
+	tasks: Task[]
+): Record<TaskPriority, number> {
+	const breakdown: Record<TaskPriority, number> = {
+		critical: 0,
+		high: 0,
+		medium: 0,
+		low: 0
+	};
+
+	tasks.forEach((task) => {
+		const priority = task.priority || 'medium';
+		breakdown[priority]++;
+	});
+
+	return breakdown;
+}
+
+/**
+ * Calculate status breakdown as percentages
+ */
+function calculateStatusBreakdown(stats: TaskStatistics): StatusBreakdown {
+	if (stats.total === 0) return {};
+
+	return {
+		'in-progress': (stats.inProgress / stats.total) * 100,
+		pending: (stats.pending / stats.total) * 100,
+		blocked: (stats.blocked / stats.total) * 100,
+		deferred: (stats.deferred / stats.total) * 100,
+		cancelled: (stats.cancelled / stats.total) * 100,
+		review: ((stats.review || 0) / stats.total) * 100
+	};
+}
+
+/**
+ * Format status counts in the correct order with colors
+ * @param stats - The statistics object containing counts
+ * @param isSubtask - Whether this is for subtasks (affects "Done" vs "Completed" label)
+ */
+function formatStatusLine(
+	stats: TaskStatistics,
+	isSubtask: boolean = false
+): string {
+	const parts: string[] = [];
+
+	// Order: Done, Cancelled, Deferred, In Progress, Review, Pending, Blocked
+	if (isSubtask) {
+		parts.push(`Completed: ${chalk.green(`${stats.done}/${stats.total}`)}`);
+	} else {
+		parts.push(`Done: ${chalk.green(stats.done)}`);
+	}
+
+	parts.push(`Cancelled: ${chalk.gray(stats.cancelled)}`);
+	parts.push(`Deferred: ${chalk.gray(stats.deferred)}`);
+
+	// Add line break for second row
+	const firstLine = parts.join('  ');
+	parts.length = 0;
+
+	parts.push(`In Progress: ${chalk.blue(stats.inProgress)}`);
+	parts.push(`Review: ${chalk.magenta(stats.review || 0)}`);
+	parts.push(`Pending: ${chalk.yellow(stats.pending)}`);
+	parts.push(`Blocked: ${chalk.red(stats.blocked)}`);
+
+	const secondLine = parts.join('  ');
+
+	return firstLine + '\n' + secondLine;
+}
+
+/**
+ * Display the project dashboard box
+ */
+export function displayProjectDashboard(
+	taskStats: TaskStatistics,
+	subtaskStats: TaskStatistics,
+	priorityBreakdown: Record<TaskPriority, number>
+): string {
+	// Calculate status breakdowns using the helper function
+	const taskStatusBreakdown = calculateStatusBreakdown(taskStats);
+	const subtaskStatusBreakdown = calculateStatusBreakdown(subtaskStats);
+
+	// Create progress bars with the breakdowns
+	const taskProgressBar = createProgressBar(
+		taskStats.completionPercentage,
+		30,
+		taskStatusBreakdown
+	);
+	const subtaskProgressBar = createProgressBar(
+		subtaskStats.completionPercentage,
+		30,
+		subtaskStatusBreakdown
+	);
+
+	const taskPercentage = `${taskStats.completionPercentage}% ${taskStats.done}/${taskStats.total}`;
+	const subtaskPercentage = `${subtaskStats.completionPercentage}% ${subtaskStats.done}/${subtaskStats.total}`;
+
+	const content =
+		chalk.white.bold('Project Dashboard') +
+		'\n' +
+		`Tasks Progress: ${taskProgressBar} ${chalk.yellow(taskPercentage)}\n` +
+		formatStatusLine(taskStats, false) +
+		'\n\n' +
+		`Subtasks Progress: ${subtaskProgressBar} ${chalk.cyan(subtaskPercentage)}\n` +
+		formatStatusLine(subtaskStats, true) +
+		'\n\n' +
+		chalk.cyan.bold('Priority Breakdown:') +
+		'\n' +
+		`${chalk.red('•')} ${chalk.white('High priority:')} ${priorityBreakdown.high}\n` +
+		`${chalk.yellow('•')} ${chalk.white('Medium priority:')} ${priorityBreakdown.medium}\n` +
+		`${chalk.green('•')} ${chalk.white('Low priority:')} ${priorityBreakdown.low}`;
+
+	return content;
+}
+
+/**
+ * Display the dependency dashboard box
+ */
+export function displayDependencyDashboard(
+	depStats: DependencyStatistics,
+	nextTask?: NextTaskInfo
+): string {
+	const content =
+		chalk.white.bold('Dependency Status & Next Task') +
+		'\n' +
+		chalk.cyan.bold('Dependency Metrics:') +
+		'\n' +
+		`${chalk.green('•')} ${chalk.white('Tasks with no dependencies:')} ${depStats.tasksWithNoDeps}\n` +
+		`${chalk.green('•')} ${chalk.white('Tasks ready to work on:')} ${depStats.tasksReadyToWork}\n` +
+		`${chalk.yellow('•')} ${chalk.white('Tasks blocked by dependencies:')} ${depStats.tasksBlockedByDeps}\n` +
+		`${chalk.magenta('•')} ${chalk.white('Most depended-on task:')} ${
+			depStats.mostDependedOnTaskId
+				? chalk.cyan(
+						`#${depStats.mostDependedOnTaskId} (${depStats.mostDependedOnCount} dependents)`
+					)
+				: chalk.gray('None')
+		}\n` +
+		`${chalk.blue('•')} ${chalk.white('Avg dependencies per task:')} ${depStats.avgDependenciesPerTask.toFixed(1)}\n\n` +
+		chalk.cyan.bold('Next Task to Work On:') +
+		'\n' +
+		`ID: ${nextTask ? chalk.cyan(String(nextTask.id)) : chalk.gray('N/A')} - ${
+			nextTask
+				? chalk.white.bold(nextTask.title)
+				: chalk.yellow('No task available')
+		}\n` +
+		`Priority: ${nextTask?.priority || chalk.gray('N/A')}  Dependencies: ${
+			nextTask?.dependencies?.length
+				? chalk.cyan(nextTask.dependencies.join(', '))
+				: chalk.gray('None')
+		}\n` +
+		`Complexity: ${nextTask?.complexity || chalk.gray('N/A')}`;
+
+	return content;
+}
+
+/**
+ * Display dashboard boxes side by side or stacked
+ */
+export function displayDashboards(
+	taskStats: TaskStatistics,
+	subtaskStats: TaskStatistics,
+	priorityBreakdown: Record<TaskPriority, number>,
+	depStats: DependencyStatistics,
+	nextTask?: NextTaskInfo
+): void {
+	const projectDashboardContent = displayProjectDashboard(
+		taskStats,
+		subtaskStats,
+		priorityBreakdown
+	);
+	const dependencyDashboardContent = displayDependencyDashboard(
+		depStats,
+		nextTask
+	);
+
+	// Get terminal width
+	const terminalWidth = process.stdout.columns || 80;
+	const minDashboardWidth = 50;
+	const minDependencyWidth = 50;
+	const totalMinWidth = minDashboardWidth + minDependencyWidth + 4;
+
+	// If terminal is wide enough, show side by side
+	if (terminalWidth >= totalMinWidth) {
+		const halfWidth = Math.floor(terminalWidth / 2);
+		const boxContentWidth = halfWidth - 4;
+
+		const dashboardBox = boxen(projectDashboardContent, {
+			padding: 1,
+			borderColor: 'blue',
+			borderStyle: 'round',
+			width: boxContentWidth,
+			dimBorder: false
+		});
+
+		const dependencyBox = boxen(dependencyDashboardContent, {
+			padding: 1,
+			borderColor: 'magenta',
+			borderStyle: 'round',
+			width: boxContentWidth,
+			dimBorder: false
+		});
+
+		// Create side-by-side layout
+		const dashboardLines = dashboardBox.split('\n');
+		const dependencyLines = dependencyBox.split('\n');
+		const maxHeight = Math.max(dashboardLines.length, dependencyLines.length);
+
+		const combinedLines = [];
+		for (let i = 0; i < maxHeight; i++) {
+			const dashLine = i < dashboardLines.length ? dashboardLines[i] : '';
+			const depLine = i < dependencyLines.length ? dependencyLines[i] : '';
+			const paddedDashLine = dashLine.padEnd(halfWidth, ' ');
+			combinedLines.push(paddedDashLine + depLine);
+		}
+
+		console.log(combinedLines.join('\n'));
+	} else {
+		// Show stacked vertically
+		const dashboardBox = boxen(projectDashboardContent, {
+			padding: 1,
+			borderColor: 'blue',
+			borderStyle: 'round',
+			margin: { top: 0, bottom: 1 }
+		});
+
+		const dependencyBox = boxen(dependencyDashboardContent, {
+			padding: 1,
+			borderColor: 'magenta',
+			borderStyle: 'round',
+			margin: { top: 0, bottom: 1 }
+		});
+
+		console.log(dashboardBox);
+		console.log(dependencyBox);
+	}
+}

apps/cli/src/ui/components/header.component.ts

@@ -0,0 +1,47 @@
+/**
+ * @fileoverview Task Master header component
+ * Displays the banner, version, project info, and file path
+ */
+
+import chalk from 'chalk';
+import figlet from 'figlet';
+import gradient from 'gradient-string';
+
+/**
+ * Header configuration options
+ */
+export interface HeaderOptions {
+	title?: string;
+	tag?: string;
+	filePath?: string;
+}
+
+/**
+ * Display the Task Master header with project info
+ */
+export function displayHeader(options: HeaderOptions = {}): void {
+	const { filePath, tag } = options;
+
+	// Display tag and file path info
+	if (tag) {
+		let tagInfo = '';
+
+		if (tag && tag !== 'master') {
+			tagInfo = `🏷 tag: ${chalk.cyan(tag)}`;
+		} else {
+			tagInfo = `🏷 tag: ${chalk.cyan('master')}`;
+		}
+
+		console.log(tagInfo);
+
+		if (filePath) {
+			// Convert to absolute path if it's relative
+			const absolutePath = filePath.startsWith('/')
+				? filePath
+				: `${process.cwd()}/${filePath}`;
+			console.log(`Listing tasks from: ${chalk.dim(absolutePath)}`);
+		}
+
+		console.log(); // Empty line for spacing
+	}
+}

apps/cli/src/ui/components/index.ts

@@ -0,0 +1,9 @@
+/**
+ * @fileoverview UI components exports
+ */
+
+export * from './header.component.js';
+export * from './dashboard.component.js';
+export * from './next-task.component.js';
+export * from './suggested-steps.component.js';
+export * from './task-detail.component.js';

apps/cli/src/ui/components/next-task.component.ts

@@ -0,0 +1,134 @@
+/**
+ * @fileoverview Next task recommendation component
+ * Displays detailed information about the recommended next task
+ */
+
+import chalk from 'chalk';
+import boxen from 'boxen';
+import type { Task } from '@tm/core/types';
+
+/**
+ * Next task display options
+ */
+export interface NextTaskDisplayOptions {
+	id: string | number;
+	title: string;
+	priority?: string;
+	status?: string;
+	dependencies?: (string | number)[];
+	description?: string;
+}
+
+/**
+ * Display the recommended next task section
+ */
+export function displayRecommendedNextTask(
+	task: NextTaskDisplayOptions | undefined
+): void {
+	if (!task) {
+		// If no task available, show a message
+		console.log(
+			boxen(
+				chalk.yellow(
+					'No tasks available to work on. All tasks are either completed, blocked by dependencies, or in progress.'
+				),
+				{
+					padding: 1,
+					borderStyle: 'round',
+					borderColor: 'yellow',
+					title: '⚠ NO TASKS AVAILABLE ⚠',
+					titleAlignment: 'center'
+				}
+			)
+		);
+		return;
+	}
+
+	// Build the content for the next task box
+	const content = [];
+
+	// Task header with ID and title
+	content.push(
+		`🔥 ${chalk.hex('#FF8800').bold('Next Task to Work On:')} ${chalk.yellow(`#${task.id}`)}${chalk.hex('#FF8800').bold(` - ${task.title}`)}`
+	);
+	content.push('');
+
+	// Priority and Status line
+	const statusLine = [];
+	if (task.priority) {
+		const priorityColor =
+			task.priority === 'high'
+				? chalk.red
+				: task.priority === 'medium'
+					? chalk.yellow
+					: chalk.gray;
+		statusLine.push(`Priority: ${priorityColor.bold(task.priority)}`);
+	}
+	if (task.status) {
+		const statusDisplay =
+			task.status === 'pending'
+				? chalk.yellow('○ pending')
+				: task.status === 'in-progress'
+					? chalk.blue('▶ in-progress')
+					: chalk.gray(task.status);
+		statusLine.push(`Status: ${statusDisplay}`);
+	}
+	content.push(statusLine.join('  '));
+
+	// Dependencies
+	const depsDisplay =
+		!task.dependencies || task.dependencies.length === 0
+			? chalk.gray('None')
+			: chalk.cyan(task.dependencies.join(', '));
+	content.push(`Dependencies: ${depsDisplay}`);
+
+	// Description if available
+	if (task.description) {
+		content.push('');
+		content.push(`Description: ${chalk.white(task.description)}`);
+	}
+
+	// Action commands
+	content.push('');
+	content.push(
+		`${chalk.cyan('Start working:')} ${chalk.yellow(`task-master set-status --id=${task.id} --status=in-progress`)}`
+	);
+	content.push(
+		`${chalk.cyan('View details:')} ${chalk.yellow(`task-master show ${task.id}`)}`
+	);
+
+	// Display in a styled box with orange border
+	console.log(
+		boxen(content.join('\n'), {
+			padding: 1,
+			margin: { top: 1, bottom: 1 },
+			borderStyle: 'round',
+			borderColor: '#FFA500', // Orange color
+			title: chalk.hex('#FFA500')('⚡ RECOMMENDED NEXT TASK ⚡'),
+			titleAlignment: 'center',
+			width: process.stdout.columns * 0.97,
+			fullscreen: false
+		})
+	);
+}
+
+/**
+ * Get task description from the full task object
+ */
+export function getTaskDescription(task: Task): string | undefined {
+	// Try to get description from the task
+	// This could be from task.description or the first line of task.details
+	if ('description' in task && task.description) {
+		return task.description as string;
+	}
+
+	if ('details' in task && task.details) {
+		// Take first sentence or line from details
+		const details = task.details as string;
+		const firstLine = details.split('\n')[0];
+		const firstSentence = firstLine.split('.')[0];
+		return firstSentence;
+	}
+
+	return undefined;
+}

apps/cli/src/ui/components/suggested-steps.component.ts

@@ -0,0 +1,31 @@
+/**
+ * @fileoverview Suggested next steps component
+ * Displays helpful command suggestions at the end of the list
+ */
+
+import chalk from 'chalk';
+import boxen from 'boxen';
+
+/**
+ * Display suggested next steps section
+ */
+export function displaySuggestedNextSteps(): void {
+	const steps = [
+		`${chalk.cyan('1.')} Run ${chalk.yellow('task-master next')} to see what to work on next`,
+		`${chalk.cyan('2.')} Run ${chalk.yellow('task-master expand --id=<id>')} to break down a task into subtasks`,
+		`${chalk.cyan('3.')} Run ${chalk.yellow('task-master set-status --id=<id> --status=done')} to mark a task as complete`
+	];
+
+	console.log(
+		boxen(
+			chalk.white.bold('Suggested Next Steps:') + '\n\n' + steps.join('\n'),
+			{
+				padding: 1,
+				margin: { top: 0, bottom: 1 },
+				borderStyle: 'round',
+				borderColor: 'gray',
+				width: process.stdout.columns * 0.97
+			}
+		)
+	);
+}

apps/cli/src/ui/components/task-detail.component.ts

@@ -0,0 +1,264 @@
+/**
+ * @fileoverview Task detail component for show command
+ * Displays detailed task information in a structured format
+ */
+
+import chalk from 'chalk';
+import boxen from 'boxen';
+import Table from 'cli-table3';
+import { marked, MarkedExtension } from 'marked';
+import { markedTerminal } from 'marked-terminal';
+import type { Task } from '@tm/core/types';
+import { getStatusWithColor, getPriorityWithColor } from '../../utils/ui.js';
+
+// Configure marked to use terminal renderer with subtle colors
+marked.use(
+	markedTerminal({
+		// More subtle colors that match the overall design
+		code: (code: string) => {
+			// Custom code block handler to preserve formatting
+			return code
+				.split('\n')
+				.map((line) => '    ' + chalk.cyan(line))
+				.join('\n');
+		},
+		blockquote: chalk.gray.italic,
+		html: chalk.gray,
+		heading: chalk.white.bold, // White bold for headings
+		hr: chalk.gray,
+		listitem: chalk.white, // White for list items
+		paragraph: chalk.white, // White for paragraphs (default text color)
+		strong: chalk.white.bold, // White bold for strong text
+		em: chalk.white.italic, // White italic for emphasis
+		codespan: chalk.cyan, // Cyan for inline code (no background)
+		del: chalk.dim.strikethrough,
+		link: chalk.blue,
+		href: chalk.blue.underline,
+		// Add more explicit code block handling
+		showSectionPrefix: false,
+		unescape: true,
+		emoji: false,
+		// Try to preserve whitespace in code blocks
+		tab: 4,
+		width: 120
+	}) as MarkedExtension
+);
+
+// Also set marked options to preserve whitespace
+marked.setOptions({
+	breaks: true,
+	gfm: true
+});
+
+/**
+ * Display the task header with tag
+ */
+export function displayTaskHeader(
+	taskId: string | number,
+	title: string
+): void {
+	// Display task header box
+	console.log(
+		boxen(chalk.white.bold(`Task: #${taskId} - ${title}`), {
+			padding: { top: 0, bottom: 0, left: 1, right: 1 },
+			borderColor: 'blue',
+			borderStyle: 'round'
+		})
+	);
+}
+
+/**
+ * Display task properties in a table format
+ */
+export function displayTaskProperties(task: Task): void {
+	const terminalWidth = process.stdout.columns * 0.95 || 100;
+	// Create table for task properties - simple 2-column layout
+	const table = new Table({
+		head: [],
+		style: {
+			head: [],
+			border: ['grey']
+		},
+		colWidths: [
+			Math.floor(terminalWidth * 0.2),
+			Math.floor(terminalWidth * 0.8)
+		],
+		wordWrap: true
+	});
+
+	const deps =
+		task.dependencies && task.dependencies.length > 0
+			? task.dependencies.map((d) => String(d)).join(', ')
+			: 'None';
+
+	// Build the left column (labels) and right column (values)
+	const labels = [
+		chalk.cyan('ID:'),
+		chalk.cyan('Title:'),
+		chalk.cyan('Status:'),
+		chalk.cyan('Priority:'),
+		chalk.cyan('Dependencies:'),
+		chalk.cyan('Complexity:'),
+		chalk.cyan('Description:')
+	].join('\n');
+
+	const values = [
+		String(task.id),
+		task.title,
+		getStatusWithColor(task.status),
+		getPriorityWithColor(task.priority),
+		deps,
+		'N/A',
+		task.description || ''
+	].join('\n');
+
+	table.push([labels, values]);
+
+	console.log(table.toString());
+}
+
+/**
+ * Display implementation details in a box
+ */
+export function displayImplementationDetails(details: string): void {
+	// Handle all escaped characters properly
+	const cleanDetails = details
+		.replace(/\\n/g, '\n') // Convert \n to actual newlines
+		.replace(/\\t/g, '\t') // Convert \t to actual tabs
+		.replace(/\\"/g, '"') // Convert \" to actual quotes
+		.replace(/\\\\/g, '\\'); // Convert \\ to single backslash
+
+	const terminalWidth = process.stdout.columns * 0.95 || 100;
+
+	// Parse markdown to terminal-friendly format
+	const markdownResult = marked(cleanDetails);
+	const formattedDetails =
+		typeof markdownResult === 'string' ? markdownResult.trim() : cleanDetails; // Fallback to original if Promise
+
+	console.log(
+		boxen(
+			chalk.white.bold('Implementation Details:') + '\n\n' + formattedDetails,
+			{
+				padding: 1,
+				borderStyle: 'round',
+				borderColor: 'cyan', // Changed to cyan to match the original
+				width: terminalWidth // Fixed width to match the original
+			}
+		)
+	);
+}
+
+/**
+ * Display test strategy in a box
+ */
+export function displayTestStrategy(testStrategy: string): void {
+	// Handle all escaped characters properly (same as implementation details)
+	const cleanStrategy = testStrategy
+		.replace(/\\n/g, '\n') // Convert \n to actual newlines
+		.replace(/\\t/g, '\t') // Convert \t to actual tabs
+		.replace(/\\"/g, '"') // Convert \" to actual quotes
+		.replace(/\\\\/g, '\\'); // Convert \\ to single backslash
+
+	const terminalWidth = process.stdout.columns * 0.95 || 100;
+
+	// Parse markdown to terminal-friendly format (same as implementation details)
+	const markdownResult = marked(cleanStrategy);
+	const formattedStrategy =
+		typeof markdownResult === 'string' ? markdownResult.trim() : cleanStrategy; // Fallback to original if Promise
+
+	console.log(
+		boxen(chalk.white.bold('Test Strategy:') + '\n\n' + formattedStrategy, {
+			padding: 1,
+			borderStyle: 'round',
+			borderColor: 'cyan', // Changed to cyan to match implementation details
+			width: terminalWidth
+		})
+	);
+}
+
+/**
+ * Display subtasks in a table format
+ */
+export function displaySubtasks(
+	subtasks: Array<{
+		id: string | number;
+		title: string;
+		status: any;
+		description?: string;
+		dependencies?: string[];
+	}>,
+	parentId: string | number
+): void {
+	const terminalWidth = process.stdout.columns * 0.95 || 100;
+	// Display subtasks header
+	console.log(
+		boxen(chalk.magenta.bold('Subtasks'), {
+			padding: { top: 0, bottom: 0, left: 1, right: 1 },
+			borderColor: 'magenta',
+			borderStyle: 'round',
+			margin: { top: 1, bottom: 0 }
+		})
+	);
+
+	// Create subtasks table
+	const table = new Table({
+		head: [
+			chalk.magenta.bold('ID'),
+			chalk.magenta.bold('Status'),
+			chalk.magenta.bold('Title'),
+			chalk.magenta.bold('Deps')
+		],
+		style: {
+			head: [],
+			border: ['grey']
+		},
+		colWidths: [
+			Math.floor(terminalWidth * 0.1),
+			Math.floor(terminalWidth * 0.15),
+			Math.floor(terminalWidth * 0.6),
+			Math.floor(terminalWidth * 0.15)
+		],
+		wordWrap: true
+	});
+
+	subtasks.forEach((subtask) => {
+		const subtaskId = `${parentId}.${subtask.id}`;
+
+		// Format dependencies
+		const deps =
+			subtask.dependencies && subtask.dependencies.length > 0
+				? subtask.dependencies.join(', ')
+				: 'None';
+
+		table.push([
+			subtaskId,
+			getStatusWithColor(subtask.status),
+			subtask.title,
+			deps
+		]);
+	});
+
+	console.log(table.toString());
+}
+
+/**
+ * Display suggested actions
+ */
+export function displaySuggestedActions(taskId: string | number): void {
+	console.log(
+		boxen(
+			chalk.white.bold('Suggested Actions:') +
+				'\n\n' +
+				`${chalk.cyan('1.')} Run ${chalk.yellow(`task-master set-status --id=${taskId} --status=in-progress`)} to start working\n` +
+				`${chalk.cyan('2.')} Run ${chalk.yellow(`task-master expand --id=${taskId}`)} to break down into subtasks\n` +
+				`${chalk.cyan('3.')} Run ${chalk.yellow(`task-master update-task --id=${taskId} --prompt="..."`)} to update details`,
+			{
+				padding: 1,
+				margin: { top: 1 },
+				borderStyle: 'round',
+				borderColor: 'green',
+				width: process.stdout.columns * 0.95 || 100
+			}
+		)
+	);
+}

apps/cli/src/ui/index.ts

@@ -0,0 +1,9 @@
+/**
+ * @fileoverview Main UI exports
+ */
+
+// Export all components
+export * from './components/index.js';
+
+// Re-export existing UI utilities
+export * from '../utils/ui.js';

apps/cli/src/utils/ui.ts

@@ -18,19 +18,39 @@ export function getStatusWithColor(
 	const statusConfig = {
 		done: {
 			color: chalk.green,
-			icon: String.fromCharCode(8730),
-			tableIcon: String.fromCharCode(8730)
-		}, // √
-		pending: { color: chalk.yellow, icon: 'o', tableIcon: 'o' },
+			icon: '✓',
+			tableIcon: '✓'
+		},
+		pending: {
+			color: chalk.yellow,
+			icon: '○',
+			tableIcon: '○'
+		},
 		'in-progress': {
 			color: chalk.hex('#FFA500'),
-			icon: String.fromCharCode(9654),
-			tableIcon: '>'
-		}, // ▶
-		deferred: { color: chalk.gray, icon: 'x', tableIcon: 'x' },
-		blocked: { color: chalk.red, icon: '!', tableIcon: '!' },
-		review: { color: chalk.magenta, icon: '?', tableIcon: '?' },
-		cancelled: { color: chalk.gray, icon: 'X', tableIcon: 'X' }
+			icon: '▶',
+			tableIcon: '▶'
+		},
+		deferred: {
+			color: chalk.gray,
+			icon: 'x',
+			tableIcon: 'x'
+		},
+		review: {
+			color: chalk.magenta,
+			icon: '?',
+			tableIcon: '?'
+		},
+		cancelled: {
+			color: chalk.gray,
+			icon: 'x',
+			tableIcon: 'x'
+		},
+		blocked: {
+			color: chalk.red,
+			icon: '!',
+			tableIcon: '!'
+		}
 	};
 
 	const config = statusConfig[status] || {
@@ -39,18 +59,7 @@ export function getStatusWithColor(
 		tableIcon: 'X'
 	};
 
-	// Use simple ASCII characters for stable display
-	const simpleIcons = {
-		done: String.fromCharCode(8730), // √
-		pending: 'o',
-		'in-progress': '>',
-		deferred: 'x',
-		blocked: '!',
-		review: '?',
-		cancelled: 'X'
-	};
-
-	const icon = forTable ? simpleIcons[status] || 'X' : config.icon;
+	const icon = forTable ? config.tableIcon : config.icon;
 	return config.color(`${icon} ${status}`);
 }
 
@@ -245,10 +254,24 @@ export function createTaskTable(
 	} = options || {};
 
 	// Calculate dynamic column widths based on terminal width
-	const terminalWidth = process.stdout.columns || 100;
+	const terminalWidth = process.stdout.columns * 0.9 || 100;
+	// Adjust column widths to better match the original layout
 	const baseColWidths = showComplexity
-		? [8, Math.floor(terminalWidth * 0.35), 18, 12, 15, 12] // ID, Title, Status, Priority, Dependencies, Complexity
-		: [8, Math.floor(terminalWidth * 0.4), 18, 12, 20]; // ID, Title, Status, Priority, Dependencies
+		? [
+				Math.floor(terminalWidth * 0.06),
+				Math.floor(terminalWidth * 0.4),
+				Math.floor(terminalWidth * 0.15),
+				Math.floor(terminalWidth * 0.12),
+				Math.floor(terminalWidth * 0.2),
+				Math.floor(terminalWidth * 0.12)
+			] // ID, Title, Status, Priority, Dependencies, Complexity
+		: [
+				Math.floor(terminalWidth * 0.08),
+				Math.floor(terminalWidth * 0.4),
+				Math.floor(terminalWidth * 0.18),
+				Math.floor(terminalWidth * 0.12),
+				Math.floor(terminalWidth * 0.2)
+			]; // ID, Title, Status, Priority, Dependencies
 
 	const headers = [
 		chalk.blue.bold('ID'),
@@ -284,11 +307,19 @@ export function createTaskTable(
 		];
 
 		if (showDependencies) {
-			row.push(formatDependenciesWithStatus(task.dependencies, tasks));
+			// For table display, show simple format without status icons
+			if (!task.dependencies || task.dependencies.length === 0) {
+				row.push(chalk.gray('None'));
+			} else {
+				row.push(
+					chalk.cyan(task.dependencies.map((d) => String(d)).join(', '))
+				);
+			}
 		}
 
-		if (showComplexity && 'complexity' in task) {
-			row.push(getComplexityWithColor(task.complexity as number | string));
+		if (showComplexity) {
+			// Show N/A if no complexity score
+			row.push(chalk.gray('N/A'));
 		}
 
 		table.push(row);

apps/cli/tsup.config.ts

@@ -1,8 +0,0 @@
-import { defineConfig } from 'tsup';
-import { cliConfig, mergeConfig } from '@tm/build-config';
-
-export default defineConfig(
-	mergeConfig(cliConfig, {
-		entry: ['src/index.ts']
-	})
-);

apps/docs/package.json

@@ -5,10 +5,9 @@
 	"description": "Task Master documentation powered by Mintlify",
 	"scripts": {
 		"dev": "mintlify dev",
-		"build": "mintlify build",
 		"preview": "mintlify preview"
 	},
 	"devDependencies": {
-		"mintlify": "^4.0.0"
+		"mintlify": "^4.2.111"
 	}
 }

apps/extension/esbuild.js

@@ -103,8 +103,8 @@ async function main() {
 		// This prevents the multiple React instances issue
 		// Ensure React is resolved from the workspace root to avoid duplicates
 		alias: {
-			react: path.resolve(__dirname, 'node_modules/react'),
-			'react-dom': path.resolve(__dirname, 'node_modules/react-dom')
+			react: path.resolve(__dirname, '../../node_modules/react'),
+			'react-dom': path.resolve(__dirname, '../../node_modules/react-dom')
 		},
 		define: {
 			'process.env.NODE_ENV': production ? '"production"' : '"development"',
@@ -135,8 +135,8 @@ async function main() {
 		jsxImportSource: 'react',
 		external: ['*.css'],
 		alias: {
-			react: path.resolve(__dirname, 'node_modules/react'),
-			'react-dom': path.resolve(__dirname, 'node_modules/react-dom')
+			react: path.resolve(__dirname, '../../node_modules/react'),
+			'react-dom': path.resolve(__dirname, '../../node_modules/react-dom')
 		},
 		define: {
 			'process.env.NODE_ENV': production ? '"production"' : '"development"',

apps/extension/package.json

@@ -229,6 +229,7 @@
 		"build": "npm run build:js && npm run build:css",
 		"build:js": "node ./esbuild.js --production",
 		"build:css": "npx @tailwindcss/cli -i ./src/webview/index.css -o ./dist/index.css --minify",
+		"dev": "npm run watch",
 		"package": "npm exec node ./package.mjs",
 		"package:direct": "node ./package.mjs",
 		"debug:env": "node ./debug-env.mjs",

apps/extension/src/components/TaskDetails/TaskMetadataSidebar.tsx

@@ -1,9 +1,10 @@
 import type React from 'react';
 import { useState, useEffect } from 'react';
 import { Button } from '@/components/ui/button';
-import { Loader2 } from 'lucide-react';
+import { Loader2, Play } from 'lucide-react';
 import { PriorityBadge } from './PriorityBadge';
 import type { TaskMasterTask } from '../../webview/types';
+import { useVSCodeContext } from '../../webview/contexts/VSCodeContext';
 
 interface TaskMetadataSidebarProps {
 	currentTask: TaskMasterTask;
@@ -28,10 +29,12 @@ export const TaskMetadataSidebar: React.FC<TaskMetadataSidebarProps> = ({
 	isRegenerating = false,
 	isAppending = false
 }) => {
+	const { vscode } = useVSCodeContext();
 	const [isLoadingComplexity, setIsLoadingComplexity] = useState(false);
 	const [mcpComplexityScore, setMcpComplexityScore] = useState<
 		number | undefined
 	>(undefined);
+	const [isStartingTask, setIsStartingTask] = useState(false);
 
 	// Get complexity score from task
 	const currentComplexityScore = complexity?.score;
@@ -97,6 +100,29 @@ export const TaskMetadataSidebar: React.FC<TaskMetadataSidebarProps> = ({
 		}
 	};
 
+	// Handle starting a task
+	const handleStartTask = () => {
+		if (!currentTask || isStartingTask) {
+			return;
+		}
+
+		setIsStartingTask(true);
+
+		// Send message to extension to open terminal
+		if (vscode) {
+			vscode.postMessage({
+				type: 'openTerminal',
+				taskId: currentTask.id,
+				taskTitle: currentTask.title
+			});
+		}
+
+		// Reset loading state after a short delay
+		setTimeout(() => {
+			setIsStartingTask(false);
+		}, 500);
+	};
+
 	// Effect to handle complexity on task change
 	useEffect(() => {
 		if (currentTask?.id) {
@@ -284,6 +310,30 @@ export const TaskMetadataSidebar: React.FC<TaskMetadataSidebarProps> = ({
 					{currentTask.dependencies && currentTask.dependencies.length > 0 && (
 						<div className="border-b border-textSeparator-foreground" />
 					)}
+
+					{/* Start Task Button */}
+					<div className="mt-4">
+						<Button
+							onClick={handleStartTask}
+							variant="default"
+							size="sm"
+							className="w-full text-xs"
+							disabled={
+								isRegenerating ||
+								isAppending ||
+								isStartingTask ||
+								currentTask?.status === 'done' ||
+								currentTask?.status === 'in-progress'
+							}
+						>
+							{isStartingTask ? (
+								<Loader2 className="w-4 h-4 mr-2 animate-spin" />
+							) : (
+								<Play className="w-4 h-4 mr-2" />
+							)}
+							{isStartingTask ? 'Starting...' : 'Start Task'}
+						</Button>
+					</div>
 				</div>
 			</div>
 		</div>

apps/extension/src/services/webview-manager.ts

@@ -361,6 +361,30 @@ export class WebviewManager {
 					}
 					return;
 
+				case 'openTerminal':
+					// Open VS Code terminal for task execution
+					this.logger.log(
+						`Opening terminal for task ${data.taskId}: ${data.taskTitle}`
+					);
+
+					try {
+						const terminal = vscode.window.createTerminal({
+							name: `Task ${data.taskId}: ${data.taskTitle}`,
+							cwd: vscode.workspace.workspaceFolders?.[0]?.uri.fsPath
+						});
+						terminal.show();
+
+						this.logger.log('Terminal created and shown successfully');
+						response = { success: true };
+					} catch (error) {
+						this.logger.error('Failed to create terminal:', error);
+						response = {
+							success: false,
+							error: error instanceof Error ? error.message : 'Unknown error'
+						};
+					}
+					break;
+
 				default:
 					throw new Error(`Unknown message type: ${type}`);
 			}

bin/task-master.js

@@ -20,357 +20,8 @@
  * Main entry point for globally installed package
  */
 
-import { fileURLToPath } from 'url';
-import { dirname, resolve } from 'path';
-import { createRequire } from 'module';
-import { spawn } from 'child_process';
-import { Command } from 'commander';
-import { displayHelp, displayBanner } from '../scripts/modules/ui.js';
-import { registerCommands } from '../scripts/modules/commands.js';
-import { detectCamelCaseFlags } from '../scripts/modules/utils.js';
-import chalk from 'chalk';
+// Direct imports instead of spawning child processes
+import { runCLI } from '../scripts/modules/commands.js';
 
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = dirname(__filename);
-const require = createRequire(import.meta.url);
-
-// Get package information
-const packageJson = require('../package.json');
-const version = packageJson.version;
-
-// Get paths to script files
-const devScriptPath = resolve(__dirname, '../scripts/dev.js');
-const initScriptPath = resolve(__dirname, '../scripts/init.js');
-
-// Helper function to run dev.js with arguments
-function runDevScript(args) {
-	// Debug: Show the transformed arguments when DEBUG=1 is set
-	if (process.env.DEBUG === '1') {
-		console.error('\nDEBUG - CLI Wrapper Analysis:');
-		console.error('- Original command: ' + process.argv.join(' '));
-		console.error('- Transformed args: ' + args.join(' '));
-		console.error(
-			'- dev.js will receive: node ' +
-				devScriptPath +
-				' ' +
-				args.join(' ') +
-				'\n'
-		);
-	}
-
-	// For testing: If TEST_MODE is set, just print args and exit
-	if (process.env.TEST_MODE === '1') {
-		console.log('Would execute:');
-		console.log(`node ${devScriptPath} ${args.join(' ')}`);
-		process.exit(0);
-		return;
-	}
-
-	const child = spawn('node', [devScriptPath, ...args], {
-		stdio: 'inherit',
-		cwd: process.cwd()
-	});
-
-	child.on('close', (code) => {
-		process.exit(code);
-	});
-}
-
-// Helper function to detect camelCase and convert to kebab-case
-const toKebabCase = (str) => str.replace(/([A-Z])/g, '-$1').toLowerCase();
-
-/**
- * Create a wrapper action that passes the command to dev.js
- * @param {string} commandName - The name of the command
- * @returns {Function} Wrapper action function
- */
-function createDevScriptAction(commandName) {
-	return (options, cmd) => {
-		// Check for camelCase flags and error out with helpful message
-		const camelCaseFlags = detectCamelCaseFlags(process.argv);
-
-		// If camelCase flags were found, show error and exit
-		if (camelCaseFlags.length > 0) {
-			console.error('\nError: Please use kebab-case for CLI flags:');
-			camelCaseFlags.forEach((flag) => {
-				console.error(`  Instead of: --${flag.original}`);
-				console.error(`  Use:        --${flag.kebabCase}`);
-			});
-			console.error(
-				'\nExample: task-master parse-prd --num-tasks=5 instead of --numTasks=5\n'
-			);
-			process.exit(1);
-		}
-
-		// Since we've ensured no camelCase flags, we can now just:
-		// 1. Start with the command name
-		const args = [commandName];
-
-		// 3. Get positional arguments and explicit flags from the command line
-		const commandArgs = [];
-		const positionals = new Set(); // Track positional args we've seen
-
-		// Find the command in raw process.argv to extract args
-		const commandIndex = process.argv.indexOf(commandName);
-		if (commandIndex !== -1) {
-			// Process all args after the command name
-			for (let i = commandIndex + 1; i < process.argv.length; i++) {
-				const arg = process.argv[i];
-
-				if (arg.startsWith('--')) {
-					// It's a flag - pass through as is
-					commandArgs.push(arg);
-					// Skip the next arg if this is a flag with a value (not --flag=value format)
-					if (
-						!arg.includes('=') &&
-						i + 1 < process.argv.length &&
-						!process.argv[i + 1].startsWith('--')
-					) {
-						commandArgs.push(process.argv[++i]);
-					}
-				} else if (!positionals.has(arg)) {
-					// It's a positional argument we haven't seen
-					commandArgs.push(arg);
-					positionals.add(arg);
-				}
-			}
-		}
-
-		// Add all command line args we collected
-		args.push(...commandArgs);
-
-		// 4. Add default options from Commander if not specified on command line
-		// Track which options we've seen on the command line
-		const userOptions = new Set();
-		for (const arg of commandArgs) {
-			if (arg.startsWith('--')) {
-				// Extract option name (without -- and value)
-				const name = arg.split('=')[0].slice(2);
-				userOptions.add(name);
-
-				// Add the kebab-case version too, to prevent duplicates
-				const kebabName = name.replace(/([A-Z])/g, '-$1').toLowerCase();
-				userOptions.add(kebabName);
-
-				// Add the camelCase version as well
-				const camelName = kebabName.replace(/-([a-z])/g, (_, letter) =>
-					letter.toUpperCase()
-				);
-				userOptions.add(camelName);
-			}
-		}
-
-		// Add Commander-provided defaults for options not specified by user
-		Object.entries(options).forEach(([key, value]) => {
-			// Debug output to see what keys we're getting
-			if (process.env.DEBUG === '1') {
-				console.error(`DEBUG - Processing option: ${key} = ${value}`);
-			}
-
-			// Special case for numTasks > num-tasks (a known problem case)
-			if (key === 'numTasks') {
-				if (process.env.DEBUG === '1') {
-					console.error('DEBUG - Converting numTasks to num-tasks');
-				}
-				if (!userOptions.has('num-tasks') && !userOptions.has('numTasks')) {
-					args.push(`--num-tasks=${value}`);
-				}
-				return;
-			}
-
-			// Skip built-in Commander properties and options the user provided
-			if (
-				['parent', 'commands', 'options', 'rawArgs'].includes(key) ||
-				userOptions.has(key)
-			) {
-				return;
-			}
-
-			// Also check the kebab-case version of this key
-			const kebabKey = key.replace(/([A-Z])/g, '-$1').toLowerCase();
-			if (userOptions.has(kebabKey)) {
-				return;
-			}
-
-			// Add default values, using kebab-case for the parameter name
-			if (value !== undefined) {
-				if (typeof value === 'boolean') {
-					if (value === true) {
-						args.push(`--${kebabKey}`);
-					} else if (value === false && key === 'generate') {
-						args.push('--skip-generate');
-					}
-				} else {
-					// Always use kebab-case for option names
-					args.push(`--${kebabKey}=${value}`);
-				}
-			}
-		});
-
-		// Special handling for parent parameter (uses -p)
-		if (options.parent && !args.includes('-p') && !userOptions.has('parent')) {
-			args.push('-p', options.parent);
-		}
-
-		// Debug output for troubleshooting
-		if (process.env.DEBUG === '1') {
-			console.error('DEBUG - Command args:', commandArgs);
-			console.error('DEBUG - User options:', Array.from(userOptions));
-			console.error('DEBUG - Commander options:', options);
-			console.error('DEBUG - Final args:', args);
-		}
-
-		// Run the script with our processed args
-		runDevScript(args);
-	};
-}
-
-// // Special case for the 'init' command which uses a different script
-// function registerInitCommand(program) {
-// 	program
-// 		.command('init')
-// 		.description('Initialize a new project')
-// 		.option('-y, --yes', 'Skip prompts and use default values')
-// 		.option('-n, --name <name>', 'Project name')
-// 		.option('-d, --description <description>', 'Project description')
-// 		.option('-v, --version <version>', 'Project version')
-// 		.option('-a, --author <author>', 'Author name')
-// 		.option('--skip-install', 'Skip installing dependencies')
-// 		.option('--dry-run', 'Show what would be done without making changes')
-// 		.action((options) => {
-// 			// Pass through any options to the init script
-// 			const args = [
-// 				'--yes',
-// 				'name',
-// 				'description',
-// 				'version',
-// 				'author',
-// 				'skip-install',
-// 				'dry-run'
-// 			]
-// 				.filter((opt) => options[opt])
-// 				.map((opt) => {
-// 					if (opt === 'yes' || opt === 'skip-install' || opt === 'dry-run') {
-// 						return `--${opt}`;
-// 					}
-// 					return `--${opt}=${options[opt]}`;
-// 				});
-
-// 			const child = spawn('node', [initScriptPath, ...args], {
-// 				stdio: 'inherit',
-// 				cwd: process.cwd()
-// 			});
-
-// 			child.on('close', (code) => {
-// 				process.exit(code);
-// 			});
-// 		});
-// }
-
-// Set up the command-line interface
-const program = new Command();
-
-program
-	.name('task-master')
-	.description('Claude Task Master CLI')
-	.version(version)
-	.addHelpText('afterAll', () => {
-		// Use the same help display function as dev.js for consistency
-		displayHelp();
-		return ''; // Return empty string to prevent commander's default help
-	});
-
-// Add custom help option to directly call our help display
-program.helpOption('-h, --help', 'Display help information');
-program.on('--help', () => {
-	displayHelp();
-});
-
-// // Add special case commands
-// registerInitCommand(program);
-
-program
-	.command('dev')
-	.description('Run the dev.js script')
-	.action(() => {
-		const args = process.argv.slice(process.argv.indexOf('dev') + 1);
-		runDevScript(args);
-	});
-
-// Use a temporary Command instance to get all command definitions
-const tempProgram = new Command();
-registerCommands(tempProgram);
-
-// For each command in the temp instance, add a modified version to our actual program
-tempProgram.commands.forEach((cmd) => {
-	if (['dev'].includes(cmd.name())) {
-		// Skip commands we've already defined specially
-		return;
-	}
-
-	// Create a new command with the same name and description
-	const newCmd = program.command(cmd.name()).description(cmd.description());
-
-	// Copy all options
-	cmd.options.forEach((opt) => {
-		newCmd.option(opt.flags, opt.description, opt.defaultValue);
-	});
-
-	// Set the action to proxy to dev.js
-	newCmd.action(createDevScriptAction(cmd.name()));
-});
-
-// Parse the command line arguments
-program.parse(process.argv);
-
-// Add global error handling for unknown commands and options
-process.on('uncaughtException', (err) => {
-	// Check if this is a commander.js unknown option error
-	if (err.code === 'commander.unknownOption') {
-		const option = err.message.match(/'([^']+)'/)?.[1];
-		const commandArg = process.argv.find(
-			(arg) =>
-				!arg.startsWith('-') &&
-				arg !== 'task-master' &&
-				!arg.includes('/') &&
-				arg !== 'node'
-		);
-		const command = commandArg || 'unknown';
-
-		console.error(chalk.red(`Error: Unknown option '${option}'`));
-		console.error(
-			chalk.yellow(
-				`Run 'task-master ${command} --help' to see available options for this command`
-			)
-		);
-		process.exit(1);
-	}
-
-	// Check if this is a commander.js unknown command error
-	if (err.code === 'commander.unknownCommand') {
-		const command = err.message.match(/'([^']+)'/)?.[1];
-
-		console.error(chalk.red(`Error: Unknown command '${command}'`));
-		console.error(
-			chalk.yellow(`Run 'task-master --help' to see available commands`)
-		);
-		process.exit(1);
-	}
-
-	// Handle other uncaught exceptions
-	console.error(chalk.red(`Error: ${err.message}`));
-	if (process.env.DEBUG === '1') {
-		console.error(err);
-	}
-	process.exit(1);
-});
-
-// Show help if no command was provided (just 'task-master' with no args)
-if (process.argv.length <= 2) {
-	displayBanner();
-	displayHelp();
-	process.exit(0);
-}
-
-// Add exports at the end of the file
-export { detectCamelCaseFlags };
+// Simply run the CLI directly
+runCLI();

package.json

@@ -11,18 +11,20 @@
 	},
 	"workspaces": ["apps/*", "packages/*", "."],
 	"scripts": {
-		"build": "npm run build:packages && tsup",
-		"dev": "npm run build:packages && npm link && (npm run dev:packages & tsup --watch --onSuccess 'echo Build complete && npm link')",
-		"dev:packages": "(cd packages/tm-core && npm run dev) & (cd apps/cli && npm run dev) & wait",
-		"dev:core": "cd packages/tm-core && npm run dev",
-		"dev:cli": "cd apps/cli && npm run dev",
-		"build:packages": "npm run build:build-config && npm run build:core && npm run build:cli",
-		"build:build-config": "cd packages/build-config && npm run build",
-		"build:core": "cd packages/tm-core && npm run build",
-		"build:cli": "cd apps/cli && npm run build",
-		"typecheck": "npm run typecheck:core && npm run typecheck:cli",
-		"typecheck:core": "cd packages/tm-core && npm run typecheck",
-		"typecheck:cli": "cd apps/cli && npm run typecheck",
+		"build": "npm run build:build-config && tsup",
+		"dev": "tsup --watch='packages/*/src/**/*' --watch='apps/cli/src/**/*' --watch='bin/**/*' --watch='mcp-server/**/*'",
+		"turbo:dev": "turbo dev",
+		"turbo:build": "turbo build",
+		"turbo:typecheck": "turbo typecheck",
+		"dev:main": "tsup --watch --onSuccess 'echo \"📦 Main package built\" && npm link'",
+		"dev:legacy": "npm run build:build-config && concurrently -n \"core,cli,main\" -c \"blue,green,yellow\" \"npm run dev:core\" \"npm run dev:cli\" \"npm run dev:main\"",
+		"dev:core": "npm run dev -w @tm/core",
+		"dev:cli": "npm run dev -w @tm/cli",
+		"build:packages": "turbo build --filter='./packages/*' --filter='./apps/*'",
+		"build:packages:parallel": "turbo build --filter='./packages/*' --filter='./apps/*'",
+		"build:build-config": "npm run build -w @tm/build-config",
+		"build:core": "npm run build -w @tm/core",
+		"build:cli": "npm run build -w @tm/cli",
 		"test": "node --experimental-vm-modules node_modules/.bin/jest",
 		"test:unit": "node --experimental-vm-modules node_modules/.bin/jest --testPathPattern=unit",
 		"test:integration": "node --experimental-vm-modules node_modules/.bin/jest --testPathPattern=integration",
@@ -35,6 +37,7 @@
 		"postpack": "chmod +x dist/task-master.js dist/mcp-server.js",
 		"changeset": "changeset",
 		"release": "changeset publish",
+		"publish-packages": "turbo run build lint test && changeset version && changeset publish",
 		"inspector": "npx @modelcontextprotocol/inspector node dist/mcp-server.js",
 		"mcp-server": "node dist/mcp-server.js",
 		"format-check": "biome format .",
@@ -70,6 +73,7 @@
 		"@inquirer/search": "^3.0.15",
 		"@openrouter/ai-sdk-provider": "^0.4.5",
 		"@streamparser/json": "^0.0.22",
+		"@tm/cli": "*",
 		"ai": "^4.3.10",
 		"ajv": "^8.17.1",
 		"ajv-formats": "^3.0.1",
@@ -93,6 +97,8 @@
 		"jsonrepair": "^3.13.0",
 		"jsonwebtoken": "^9.0.2",
 		"lru-cache": "^10.2.0",
+		"marked": "^15.0.12",
+		"marked-terminal": "^7.3.0",
 		"ollama-ai-provider": "^1.2.0",
 		"openai": "^4.89.0",
 		"ora": "^8.2.0",
@@ -108,6 +114,7 @@
 	"engines": {
 		"node": ">=18.0.0"
 	},
+	"packageManager": "npm@10.9.2",
 	"repository": {
 		"type": "git",
 		"url": "git+https://github.com/eyaltoledano/claude-task-master.git"
@@ -123,14 +130,14 @@
 	},
 	"devDependencies": {
 		"@biomejs/biome": "^1.9.4",
-
 		"@changesets/changelog-github": "^0.5.1",
 		"@changesets/cli": "^2.28.1",
-		"dotenv-mono": "^1.5.1",
-
 		"@types/jest": "^29.5.14",
+		"@types/marked-terminal": "^6.1.1",
+		"concurrently": "^9.2.1",
+		"cross-env": "^10.0.0",
+		"dotenv-mono": "^1.5.1",
 		"execa": "^8.0.1",
-		"ink": "^5.0.1",
 		"jest": "^29.7.0",
 		"jest-environment-node": "^29.7.0",
 		"mock-fs": "^5.5.0",
@@ -138,6 +145,7 @@
 		"supertest": "^7.1.0",
 		"tsup": "^8.5.0",
 		"tsx": "^4.16.2",
+		"turbo": "^2.5.6",
 		"typescript": "^5.9.2"
 	}
 }

packages/build-config/package.json

@@ -7,9 +7,8 @@
 	"types": "./dist/tsup.base.d.ts",
 	"exports": {
 		".": {
-			"types": "./src/tsup.base.ts",
-			"import": "./dist/tsup.base.js",
-			"require": "./dist/tsup.base.cjs"
+			"types": "./dist/tsup.base.d.ts",
+			"import": "./dist/tsup.base.js"
 		}
 	},
 	"files": ["dist", "src"],
@@ -17,15 +16,14 @@
 	"author": "",
 	"license": "MIT",
 	"scripts": {
-		"build": "tsup",
-		"dev": "tsup --watch",
+		"build": "tsc",
 		"typecheck": "tsc --noEmit"
 	},
 	"devDependencies": {
-		"tsup": "^8.5.0",
+		"dotenv-mono": "^1.5.1",
 		"typescript": "^5.7.3"
 	},
-	"peerDependencies": {
-		"tsup": "^8.0.0"
+	"dependencies": {
+		"tsup": "^8.5.0"
 	}
 }

packages/build-config/src/tsup.base.ts

@@ -8,73 +8,29 @@ const isProduction = process.env.NODE_ENV === 'production';
 const isDevelopment = !isProduction;
 
 /**
- * Base configuration for library packages (tm-core, etc.)
+ * Environment helpers
  */
-export const libraryConfig: Partial<Options> = {
-	format: ['cjs', 'esm'],
-	target: 'es2022',
-	// Sourcemaps only in development to reduce production bundle size
-	sourcemap: isDevelopment,
-	clean: true,
-	dts: true,
-	// Enable optimizations in production
-	splitting: isProduction,
-	treeshake: isProduction,
-	minify: isProduction,
-	bundle: true,
-	esbuildOptions(options) {
-		options.conditions = ['module'];
-		// Better source mapping in development only
-		options.sourcesContent = isDevelopment;
-		// Keep original names for better debugging in development
-		options.keepNames = isDevelopment;
-	},
-	// Watch mode configuration for development
-	watch: isDevelopment ? ['src'] : false
+export const env = {
+	isProduction,
+	isDevelopment,
+	NODE_ENV: process.env.NODE_ENV || 'development'
 };
 
 /**
- * Base configuration for CLI packages
+ * Base tsup configuration for all packages
+ * Since everything gets bundled into root dist/ anyway, use consistent settings
  */
-export const cliConfig: Partial<Options> = {
+export const baseConfig: Partial<Options> = {
 	format: ['esm'],
 	target: 'node18',
-	splitting: false,
-	// Sourcemaps only in development to reduce production bundle size
 	sourcemap: isDevelopment,
 	clean: true,
-	dts: true,
-	shims: true,
-	// Enable minification in production for smaller bundles
+	dts: false,
 	minify: isProduction,
 	treeshake: isProduction,
-	esbuildOptions(options) {
-		options.platform = 'node';
-		// Better source mapping in development only
-		options.sourcesContent = isDevelopment;
-		// Keep original names for better debugging in development
-		options.keepNames = isDevelopment;
-	}
-};
-
-/**
- * Base configuration for executable bundles (root level)
- */
-export const executableConfig: Partial<Options> = {
-	format: ['esm'],
-	target: 'node18',
 	splitting: false,
-	// Sourcemaps only in development to reduce production bundle size
-	sourcemap: isDevelopment,
-	clean: true,
-	bundle: true, // Bundle everything into one file
-	// Minify in production for smaller executables
-	minify: isProduction,
-	// Handle TypeScript imports transparently
-	loader: {
-		'.js': 'jsx',
-		'.ts': 'ts'
-	},
+	// Don't bundle any other dependencies (auto-external all node_modules)
+	external: [/^[^./]/],
 	esbuildOptions(options) {
 		options.platform = 'node';
 		// Allow importing TypeScript from JavaScript
@@ -83,14 +39,18 @@ export const executableConfig: Partial<Options> = {
 		options.sourcesContent = isDevelopment;
 		// Keep original names for better debugging in development
 		options.keepNames = isDevelopment;
-	}
+	},
+	// Watch mode configuration for development
+	watch: false
 };
 
 /**
- * Common external modules that should not be bundled
+ * Legacy external modules list - kept for backwards compatibility
+ * Note: When using tsup-node, this is not needed as it automatically
+ * excludes dependencies and peerDependencies from package.json
  */
 export const commonExternals = [
-	// Native Node.js modules
+	// Native Node.js modules (for cases where tsup is used instead of tsup-node)
 	'fs',
 	'path',
 	'child_process',
@@ -119,6 +79,7 @@ export const commonExternals = [
 
 /**
  * Utility function to merge configurations
+ * Simplified for tsup-node usage
  */
 export function mergeConfig(
 	baseConfig: Partial<Options>,
@@ -127,8 +88,6 @@ export function mergeConfig(
 	return {
 		...baseConfig,
 		...overrides,
-		// Merge arrays instead of overwriting
-		external: [...(baseConfig.external || []), ...(overrides.external || [])],
 		// Merge esbuildOptions
 		esbuildOptions(options, context) {
 			if (baseConfig.esbuildOptions) {
@@ -140,12 +99,3 @@ export function mergeConfig(
 		}
 	} as Options;
 }
-
-/**
- * Environment helpers
- */
-export const env = {
-	isProduction,
-	isDevelopment,
-	NODE_ENV: process.env.NODE_ENV || 'development'
-};

packages/build-config/tsconfig.json

@@ -6,9 +6,10 @@
 		"moduleResolution": "bundler",
 		"allowSyntheticDefaultImports": true,
 		"esModuleInterop": true,
+		"baseUrl": ".",
+		"outDir": "dist",
 		"allowJs": true,
 		"strict": true,
-		"noEmit": true,
 		"resolveJsonModule": true,
 		"isolatedModules": true,
 		"declaration": true,

packages/build-config/tsup.config.ts

@@ -1,23 +0,0 @@
-import { defineConfig } from 'tsup';
-
-const isProduction = process.env.NODE_ENV === 'production';
-
-export default defineConfig({
-	entry: ['src/tsup.base.ts'],
-	format: ['esm', 'cjs'],
-	target: 'node18',
-	// Sourcemaps only in development
-	sourcemap: !isProduction,
-	clean: true,
-	dts: true,
-	// Enable minification in production
-	minify: isProduction,
-	treeshake: isProduction,
-	external: ['tsup'],
-	esbuildOptions(options) {
-		// Better source mapping in development only
-		options.sourcesContent = !isProduction;
-		// Keep original names for better debugging in development
-		options.keepNames = !isProduction;
-	}
-});

packages/tm-core/package.json

@@ -7,54 +7,19 @@
 	"types": "./src/index.ts",
 	"main": "./dist/index.js",
 	"exports": {
-		".": {
-			"types": "./src/index.ts",
-			"import": "./dist/index.js"
-		},
-		"./auth": {
-			"types": "./src/auth/index.ts",
-			"import": "./dist/auth/index.js"
-		},
-		"./storage": {
-			"types": "./src/storage/index.ts",
-			"import": "./dist/storage/index.js"
-		},
-		"./config": {
-			"types": "./src/config/index.ts",
-			"import": "./dist/config/index.js"
-		},
-		"./providers": {
-			"types": "./src/providers/index.ts",
-			"import": "./dist/providers/index.js"
-		},
-		"./services": {
-			"types": "./src/services/index.ts",
-			"import": "./dist/services/index.js"
-		},
-		"./errors": {
-			"types": "./src/errors/index.ts",
-			"import": "./dist/errors/index.js"
-		},
-		"./logger": {
-			"types": "./src/logger/index.ts",
-			"import": "./dist/logger/index.js"
-		},
-		"./types": {
-			"types": "./src/types/index.ts",
-			"import": "./dist/types/index.js"
-		},
-		"./interfaces": {
-			"types": "./src/interfaces/index.ts",
-			"import": "./dist/interfaces/index.js"
-		},
-		"./utils": {
-			"types": "./src/utils/index.ts",
-			"import": "./dist/utils/index.js"
-		}
+		".": "./src/index.ts",
+		"./auth": "./src/auth/index.ts",
+		"./storage": "./src/storage/index.ts",
+		"./config": "./src/config/index.ts",
+		"./providers": "./src/providers/index.ts",
+		"./services": "./src/services/index.ts",
+		"./errors": "./src/errors/index.ts",
+		"./logger": "./src/logger/index.ts",
+		"./types": "./src/types/index.ts",
+		"./interfaces": "./src/interfaces/index.ts",
+		"./utils": "./src/utils/index.ts"
 	},
 	"scripts": {
-		"build": "tsup",
-		"dev": "tsup --watch",
 		"test": "vitest run",
 		"test:watch": "vitest",
 		"test:coverage": "vitest run --coverage",
@@ -74,15 +39,16 @@
 		"@tm/build-config": "*",
 		"@types/node": "^20.11.30",
 		"@vitest/coverage-v8": "^2.0.5",
+		"dotenv-mono": "^1.3.14",
 		"ts-node": "^10.9.2",
-		"tsup": "^8.0.2",
+		"tsup": "^8.5.0",
 		"typescript": "^5.4.3",
 		"vitest": "^2.0.5"
 	},
 	"engines": {
 		"node": ">=18.0.0"
 	},
-	"files": ["dist", "README.md", "CHANGELOG.md"],
+	"files": ["src", "README.md", "CHANGELOG.md"],
 	"keywords": ["task-management", "typescript", "ai", "prd", "parser"],
 	"author": "Task Master AI",
 	"license": "MIT"

packages/tm-core/src/auth/auth-manager.ts

@@ -31,7 +31,7 @@ export class AuthManager {
 	private organizationService?: OrganizationService;
 
 	private constructor(config?: Partial<AuthConfig>) {
-		this.credentialStore = new CredentialStore(config);
+		this.credentialStore = CredentialStore.getInstance(config);
 		this.supabaseClient = new SupabaseAuthClient();
 		this.oauthService = new OAuthService(this.credentialStore, config);
 
@@ -73,6 +73,7 @@ export class AuthManager {
 	 */
 	static resetInstance(): void {
 		AuthManager.instance = null;
+		CredentialStore.resetInstance();
 	}
 
 	/**

packages/tm-core/src/auth/credential-store.ts

@@ -19,15 +19,39 @@ import { getLogger } from '../logger/index.js';
  * human-readable persisted format in the auth.json file.
  */
 export class CredentialStore {
+	private static instance: CredentialStore | null = null;
 	private logger = getLogger('CredentialStore');
 	private config: AuthConfig;
 	// Clock skew tolerance for expiry checks (30 seconds)
 	private readonly CLOCK_SKEW_MS = 30_000;
 
-	constructor(config?: Partial<AuthConfig>) {
+	private constructor(config?: Partial<AuthConfig>) {
 		this.config = getAuthConfig(config);
 	}
 
+	/**
+	 * Get the singleton instance of CredentialStore
+	 */
+	static getInstance(config?: Partial<AuthConfig>): CredentialStore {
+		if (!CredentialStore.instance) {
+			CredentialStore.instance = new CredentialStore(config);
+		} else if (config) {
+			// Warn if config is provided after initialization
+			const logger = getLogger('CredentialStore');
+			logger.warn(
+				'getInstance called with config after initialization; config is ignored.'
+			);
+		}
+		return CredentialStore.instance;
+	}
+
+	/**
+	 * Reset the singleton instance (useful for testing)
+	 */
+	static resetInstance(): void {
+		CredentialStore.instance = null;
+	}
+
 	/**
 	 * Get stored authentication credentials
 	 * @returns AuthCredentials with expiresAt as number (milliseconds) for runtime use

packages/tm-core/src/auth/index.ts

@@ -5,7 +5,7 @@
 export { AuthManager } from './auth-manager.js';
 export { CredentialStore } from './credential-store.js';
 export { OAuthService } from './oauth-service.js';
-export { SupabaseSessionStorage } from './supabase-session-storage';
+export { SupabaseSessionStorage } from './supabase-session-storage.js';
 export type {
 	Organization,
 	Brief,

packages/tm-core/src/auth/supabase-session-storage.ts

@@ -7,9 +7,9 @@
  */
 
 import { SupportedStorage } from '@supabase/supabase-js';
-import { CredentialStore } from './credential-store';
-import { AuthCredentials } from './types';
-import { getLogger } from '../logger';
+import { CredentialStore } from './credential-store.js';
+import { AuthCredentials } from './types.js';
+import { getLogger } from '../logger/index.js';
 
 const STORAGE_KEY = 'sb-taskmaster-auth-token';
 

packages/tm-core/src/clients/supabase-client.ts

@@ -10,8 +10,8 @@ import {
 } from '@supabase/supabase-js';
 import { AuthenticationError } from '../auth/types.js';
 import { getLogger } from '../logger/index.js';
-import { SupabaseSessionStorage } from '../auth/supabase-session-storage';
-import { CredentialStore } from '../auth/credential-store';
+import { SupabaseSessionStorage } from '../auth/supabase-session-storage.js';
+import { CredentialStore } from '../auth/credential-store.js';
 
 export class SupabaseAuthClient {
 	private client: SupabaseJSClient | null = null;
@@ -19,7 +19,7 @@ export class SupabaseAuthClient {
 	private logger = getLogger('SupabaseAuthClient');
 
 	constructor() {
-		const credentialStore = new CredentialStore();
+		const credentialStore = CredentialStore.getInstance();
 		this.sessionStorage = new SupabaseSessionStorage(credentialStore);
 	}
 

packages/tm-core/tsconfig.json

@@ -1,7 +1,7 @@
 {
 	"compilerOptions": {
 		"target": "ES2022",
-		"module": "ESNext",
+		"module": "NodeNext",
 		"lib": ["ES2022"],
 		"declaration": true,
 		"declarationMap": true,
@@ -24,11 +24,12 @@
 		"esModuleInterop": true,
 		"skipLibCheck": true,
 		"forceConsistentCasingInFileNames": true,
-		"moduleResolution": "bundler",
+		"moduleResolution": "NodeNext",
 		"moduleDetection": "force",
 		"types": ["node"],
 		"resolveJsonModule": true,
-		"isolatedModules": true
+		"isolatedModules": true,
+		"allowImportingTsExtensions": false
 	},
 	"include": ["src/**/*"],
 	"exclude": ["node_modules", "dist", "tests", "**/*.test.ts", "**/*.spec.ts"]

packages/tm-core/tsup.config.ts

@@ -1,24 +0,0 @@
-import { defineConfig } from 'tsup';
-import { libraryConfig, mergeConfig } from '@tm/build-config';
-
-export default defineConfig(
-	mergeConfig(libraryConfig, {
-		entry: {
-			index: 'src/index.ts',
-			'auth/index': 'src/auth/index.ts',
-			'config/index': 'src/config/index.ts',
-			'services/index': 'src/services/index.ts',
-			'logger/index': 'src/logger/index.ts',
-			'interfaces/index': 'src/interfaces/index.ts',
-			'types/index': 'src/types/index.ts',
-			'providers/index': 'src/providers/index.ts',
-			'storage/index': 'src/storage/index.ts',
-			'parser/index': 'src/parser/index.ts',
-			'utils/index': 'src/utils/index.ts',
-			'errors/index': 'src/errors/index.ts'
-		},
-		tsconfig: './tsconfig.json',
-		outDir: 'dist',
-		external: ['zod', '@supabase/supabase-js']
-	})
-);

scripts/modules/commands.js

@@ -16,7 +16,12 @@ import ora from 'ora'; // Import ora
 
 import { log, readJSON } from './utils.js';
 // Import new commands from @tm/cli
-import { ListTasksCommand, AuthCommand, ContextCommand } from '@tm/cli';
+import {
+	ListTasksCommand,
+	ShowCommand,
+	AuthCommand,
+	ContextCommand
+} from '@tm/cli';
 
 import {
 	parsePRD,
@@ -1749,6 +1754,10 @@ function registerCommands(programInstance) {
 	// Manages workspace context (org/brief selection)
 	ContextCommand.registerOn(programInstance);
 
+	// Register the show command from @tm/cli
+	// Displays detailed information about tasks
+	ShowCommand.registerOn(programInstance);
+
 	// expand command
 	programInstance
 		.command('expand')
@@ -2567,80 +2576,6 @@ ${result.result}
 			);
 		});
 
-	// show command
-	programInstance
-		.command('show')
-		.description(
-			`Display detailed information about one or more tasks${chalk.reset('')}`
-		)
-		.argument('[id]', 'Task ID(s) to show (comma-separated for multiple)')
-		.option(
-			'-i, --id <id>',
-			'Task ID(s) to show (comma-separated for multiple)'
-		)
-		.option('-s, --status <status>', 'Filter subtasks by status')
-		.option(
-			'-f, --file <file>',
-			'Path to the tasks file',
-			TASKMASTER_TASKS_FILE
-		)
-		.option(
-			'-r, --report <report>',
-			'Path to the complexity report file',
-			COMPLEXITY_REPORT_FILE
-		)
-		.option('--tag <tag>', 'Specify tag context for task operations')
-		.action(async (taskId, options) => {
-			// Initialize TaskMaster
-			const initOptions = {
-				tasksPath: options.file || true,
-				tag: options.tag
-			};
-			// Only pass complexityReportPath if user provided a custom path
-			if (options.report && options.report !== COMPLEXITY_REPORT_FILE) {
-				initOptions.complexityReportPath = options.report;
-			}
-			const taskMaster = initTaskMaster(initOptions);
-
-			const idArg = taskId || options.id;
-			const statusFilter = options.status;
-			const tag = taskMaster.getCurrentTag();
-
-			// Show current tag context
-			displayCurrentTagIndicator(tag);
-
-			if (!idArg) {
-				console.error(chalk.red('Error: Please provide a task ID'));
-				process.exit(1);
-			}
-
-			// Check if multiple IDs are provided (comma-separated)
-			const taskIds = idArg
-				.split(',')
-				.map((id) => id.trim())
-				.filter((id) => id.length > 0);
-
-			if (taskIds.length > 1) {
-				// Multiple tasks - use compact summary view with interactive drill-down
-				await displayMultipleTasksSummary(
-					taskMaster.getTasksPath(),
-					taskIds,
-					taskMaster.getComplexityReportPath(),
-					statusFilter,
-					{ projectRoot: taskMaster.getProjectRoot(), tag }
-				);
-			} else {
-				// Single task - use detailed view
-				await displayTaskById(
-					taskMaster.getTasksPath(),
-					taskIds[0],
-					taskMaster.getComplexityReportPath(),
-					statusFilter,
-					{ projectRoot: taskMaster.getProjectRoot(), tag }
-				);
-			}
-		});
-
 	// add-dependency command
 	programInstance
 		.command('add-dependency')

src/utils/getVersion.js

@@ -1,7 +1,4 @@
-import fs from 'fs';
-import path from 'path';
-import { fileURLToPath } from 'url';
-import { log } from '../../scripts/modules/utils.js';
+import packageJson from '../../package.json' with { type: 'json' };
 
 /**
  * Reads the version from the nearest package.json relative to this file.
@@ -9,27 +6,5 @@ import { log } from '../../scripts/modules/utils.js';
  * @returns {string} The version string or 'unknown'.
  */
 export function getTaskMasterVersion() {
-	let version = 'unknown';
-	try {
-		// Get the directory of the current module (getPackageVersion.js)
-		const currentModuleFilename = fileURLToPath(import.meta.url);
-		const currentModuleDirname = path.dirname(currentModuleFilename);
-		// Construct the path to package.json relative to this file (../../package.json)
-		const packageJsonPath = path.join(
-			currentModuleDirname,
-			'..',
-			'..',
-			'package.json'
-		);
-
-		if (fs.existsSync(packageJsonPath)) {
-			const packageJsonContent = fs.readFileSync(packageJsonPath, 'utf8');
-			const packageJson = JSON.parse(packageJsonContent);
-			version = packageJson.version;
-		}
-	} catch (error) {
-		// Silently fall back to default version
-		log('warn', 'Could not read own package.json for version info.', error);
-	}
-	return version;
+	return packageJson.version || 'unknown';
 }

tsconfig.json

@@ -12,7 +12,15 @@
 		"strict": true,
 		"skipLibCheck": true,
 		"noEmit": true,
-		"baseUrl": "."
+		"baseUrl": ".",
+		"paths": {
+			"@tm/core": ["./packages/tm-core/src/index.ts"],
+			"@tm/core/*": ["./packages/tm-core/src/*"],
+			"@tm/cli": ["./apps/cli/src/index.ts"],
+			"@tm/cli/*": ["./apps/cli/src/*"],
+			"@tm/build-config": ["./packages/build-config/src/index.ts"],
+			"@tm/build-config/*": ["./packages/build-config/src/*"]
+		}
 	},
 	"tsx": {
 		"tsconfig": {

tsup.config.ts

@@ -1,20 +1,97 @@
 import { defineConfig } from 'tsup';
-import {
-	executableConfig,
-	mergeConfig,
-	commonExternals
-} from '@tm/build-config';
+import { baseConfig, mergeConfig } from '@tm/build-config';
+import { load as dotenvLoad } from 'dotenv-mono';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+dotenvLoad();
+
+// Get all TM_PUBLIC_* env variables for build-time injection
+const getBuildTimeEnvs = () => {
+	const envs: Record<string, string> = {};
+	for (const [key, value] of Object.entries(process.env)) {
+		if (key.startsWith('TM_PUBLIC_')) {
+			// Return the actual value, not JSON.stringify'd
+			envs[key] = value || '';
+		}
+	}
+	return envs;
+};
 
 export default defineConfig(
-	mergeConfig(executableConfig, {
+	mergeConfig(baseConfig, {
 		entry: {
-			'task-master': 'bin/task-master.js',
+			'task-master': 'scripts/dev.js',
 			'mcp-server': 'mcp-server/server.js'
 		},
 		outDir: 'dist',
 		publicDir: 'public',
-		// Bundle our monorepo packages but keep node_modules external
-		noExternal: [/@tm\/.*/],
-		external: commonExternals
+		// Override the base config's external to bundle our workspace packages
+		noExternal: [/^@tm\//],
+		external: [
+			/^@supabase\//, // Keep Supabase external to avoid dynamic require issues
+			'marked',
+			'marked-terminal'
+		],
+		env: getBuildTimeEnvs(),
+		esbuildOptions(options) {
+			// Set up path aliases for workspace packages
+			options.alias = {
+				'@tm/core': path.resolve(__dirname, 'packages/tm-core/src/index.ts'),
+				'@tm/core/auth': path.resolve(
+					__dirname,
+					'packages/tm-core/src/auth/index.ts'
+				),
+				'@tm/core/storage': path.resolve(
+					__dirname,
+					'packages/tm-core/src/storage/index.ts'
+				),
+				'@tm/core/config': path.resolve(
+					__dirname,
+					'packages/tm-core/src/config/index.ts'
+				),
+				'@tm/core/providers': path.resolve(
+					__dirname,
+					'packages/tm-core/src/providers/index.ts'
+				),
+				'@tm/core/services': path.resolve(
+					__dirname,
+					'packages/tm-core/src/services/index.ts'
+				),
+				'@tm/core/errors': path.resolve(
+					__dirname,
+					'packages/tm-core/src/errors/index.ts'
+				),
+				'@tm/core/logger': path.resolve(
+					__dirname,
+					'packages/tm-core/src/logger/index.ts'
+				),
+				'@tm/core/types': path.resolve(
+					__dirname,
+					'packages/tm-core/src/types/index.ts'
+				),
+				'@tm/core/interfaces': path.resolve(
+					__dirname,
+					'packages/tm-core/src/interfaces/index.ts'
+				),
+				'@tm/core/utils': path.resolve(
+					__dirname,
+					'packages/tm-core/src/utils/index.ts'
+				),
+				'@tm/cli': path.resolve(__dirname, 'apps/cli/src/index.ts'),
+				'@tm/cli/commands': path.resolve(
+					__dirname,
+					'apps/cli/src/commands/index.ts'
+				),
+				'@tm/cli/utils': path.resolve(__dirname, 'apps/cli/src/utils/index.ts'),
+				'@tm/cli/ui': path.resolve(__dirname, 'apps/cli/src/ui/index.ts'),
+				'@tm/build-config': path.resolve(
+					__dirname,
+					'packages/build-config/src/tsup.base.ts'
+				)
+			};
+		}
 	})
 );

turbo.json

@@ -0,0 +1,44 @@
+{
+	"$schema": "https://turbo.build/schema.json",
+	"extends": ["//"],
+	"tasks": {
+		"build": {
+			"dependsOn": ["^build"],
+			"outputs": ["dist/**"],
+			"outputLogs": "new-only"
+		},
+		"dev": {
+			"cache": false,
+			"persistent": true,
+			"inputs": [
+				"$TURBO_DEFAULT$",
+				"!{packages,apps}/**/dist/**",
+				"!{packages,apps}/**/node_modules/**"
+			]
+		},
+		"test:watch": {
+			"cache": false,
+			"persistent": true,
+			"dependsOn": ["^build"]
+		},
+		"lint": {
+			"dependsOn": ["^build"],
+			"inputs": [
+				"$TURBO_DEFAULT$",
+				"!{packages,apps}/**/dist/**",
+				"!{packages,apps}/**/node_modules/**"
+			],
+			"outputLogs": "new-only"
+		},
+		"typecheck": {
+			"dependsOn": ["^build"],
+			"inputs": [
+				"$TURBO_DEFAULT$",
+				"!{packages,apps}/**/dist/**",
+				"!{packages,apps}/**/node_modules/**"
+			],
+			"outputLogs": "new-only"
+		}
+	},
+	"globalDependencies": ["turbo.json", "tsconfig.json", ".env*"]
+}