refactor: unify tool-starting logic with shared useStartTool hook

- New useStartTool hook: calls working createInstance+startInstance API
- WorkspacesPage: uses shared hook instead of inline createInstance logic
- WorkspaceDetailPage ToolsTab: uses shared hook instead of broken createWorkspaceInstance
- Both pages now use identical StartToolModal + identical start logic

Quality gates: tsc --noEmit clean

apps/web/src/pages/workspace-detail.tsx

@@ -7,6 +7,7 @@ import { useWorkspaces } from "../hooks/use-workspaces";
 import { useWorkspaceFiles } from "../hooks/use-workspace-files";
 import { useWorkspaceGit } from "../hooks/use-workspace-git";
 import { useWorkspaceInstances } from "../hooks/use-workspace-instances";
+import { useStartTool } from "../hooks/use-start-tool";
 import { useMobileViewport } from "../hooks/use-mobile-viewport";
 import { StartToolModal } from "../components/start-tool-modal";
 import type { FileEntry } from "../api/workspace-files";
@@ -312,7 +313,8 @@ function GitTab({ workspaceId }: { workspaceId: string }) {
 /* ─── Tools Tab ─── */
 
 function ToolsTab({ workspace }: { workspace: Workspace }) {
-	const { instances, loading, create } = useWorkspaceInstances(workspace.id);
+	const { instances, loading, refresh } = useWorkspaceInstances(workspace.id);
+	const { startTool, starting } = useStartTool();
 	const [showModal, setShowModal] = useState(false);
 
 	return (
@@ -326,8 +328,9 @@ function ToolsTab({ workspace }: { workspace: Workspace }) {
 					<button
 						className="btn btn-primary"
 						onClick={() => setShowModal(true)}
+						disabled={starting}
 					>
-						Start Tool
+						{starting ? "Starting..." : "Start Tool"}
 					</button>
 				</div>
 			) : (
@@ -355,8 +358,9 @@ function ToolsTab({ workspace }: { workspace: Workspace }) {
 					<button
 						className="btn btn-primary"
 						onClick={() => setShowModal(true)}
+						disabled={starting}
 					>
-						Start Another Tool
+						{starting ? "Starting..." : "Start Another Tool"}
 					</button>
 				</>
 			)}
@@ -365,8 +369,16 @@ function ToolsTab({ workspace }: { workspace: Workspace }) {
 					workspace={workspace}
 					onClose={() => setShowModal(false)}
 					onStart={async (toolTypeId, configProfileId) => {
-						await create(toolTypeId, undefined, configProfileId);
-						setShowModal(false);
+						const instance = await startTool(
+							workspace,
+							toolTypeId,
+							undefined,
+							configProfileId,
+						);
+						if (instance) {
+							setShowModal(false);
+							await refresh();
+						}
 					}}
 				/>
 			)}
@@ -376,11 +388,7 @@ function ToolsTab({ workspace }: { workspace: Workspace }) {
 
 /* ─── Settings Tab ─── */
 
-function SettingsTab({
-	workspace,
-}: {
-	workspace: Workspace;
-}) {
+function SettingsTab({ workspace }: { workspace: Workspace }) {
 	return (
 		<div className="settings-tab">
 			<div className="settings-section">
@@ -411,5 +419,3 @@ function SettingsTab({
 		</div>
 	);
 }
-
-

apps/web/src/pages/workspaces.tsx

@@ -4,10 +4,10 @@ import { useState } from "react";
 import { Icon } from "../components/icon";
 import { useWorkspaces } from "../hooks/use-workspaces";
 import { useWorkspaceActions } from "../hooks/use-workspace-actions";
+import { useStartTool } from "../hooks/use-start-tool";
 import { WorkspaceCard } from "../components/workspace-card";
 import { WorkspaceCreateForm } from "../components/workspace-create-form";
 import { StartToolModal } from "../components/start-tool-modal";
-import { createInstance, startInstance } from "../api/sessions";
 import type { Workspace } from "../types/workspace";
 
 export function WorkspacesPage() {
@@ -16,6 +16,7 @@ export function WorkspacesPage() {
 
 	const { workspaces, loading, error, refresh } = useWorkspaces();
 	const actions = useWorkspaceActions();
+	const { startTool } = useStartTool();
 
 	const handleDelete = async (workspace: Workspace) => {
 		await actions.delete(workspace, refresh);
@@ -35,29 +36,15 @@ export function WorkspacesPage() {
 		configProfileId?: string,
 	) => {
 		if (!startWorkspace) return;
-		try {
-			const instance = await createInstance(
-				startWorkspace.project_id,
-				startWorkspace.repo_id,
-				toolTypeId,
-				`${startWorkspace.name} - ${toolTypeId}`,
-				undefined,
-				undefined,
-				undefined,
-				configProfileId,
-				[],
-				startWorkspace.id,
-			);
-			await startInstance(
-				startWorkspace.project_id,
-				startWorkspace.repo_id,
-				instance.id,
-				configProfileId,
-			);
+		const instance = await startTool(
+			startWorkspace,
+			toolTypeId,
+			undefined,
+			configProfileId,
+		);
+		if (instance) {
 			setStartWorkspace(null);
 			await refresh();
-		} catch (err) {
-			alert(err instanceof Error ? err.message : "Failed to start tool");
 		}
 	};