tower-studio 0.1.3 → 0.1.5

package/src/components/assistant/assistant-provider.tsx

@@ -1,512 +0,0 @@
-"use client";
-
-import {
-  createContext,
-  useCallback,
-  useContext,
-  useEffect,
-  useRef,
-  useState,
-  type ReactNode,
-} from "react";
-import { toast } from "sonner";
-import { getConfigValue } from "@/actions/config-actions";
-import { ASSISTANT_SESSION_KEY } from "@/lib/assistant-constants";
-import type { ChatMessage, MessageRole } from "@/hooks/use-assistant-chat";
-import {
-  type AssistantSession,
-  getSessions,
-  addSession,
-  deleteSession,
-  getActiveSessionId,
-  setActiveSessionId,
-  buildSessionTitle,
-} from "@/lib/assistant-sessions";
-
-// ---------------------------------------------------------------------------
-// Context types
-// ---------------------------------------------------------------------------
-
-interface AssistantContextValue {
-  isOpen: boolean;
-  isStarting: boolean;
-  displayMode: "sidebar" | "dialog";
-  worktreePath: string | null;
-  toggleAssistant: () => void;
-  closeAssistant: () => void;
-  // Chat state — persisted at provider level so it survives route changes
-  chatMessages: ChatMessage[];
-  chatStatus: "idle" | "connecting" | "streaming" | "error";
-  isChatThinking: boolean;
-  isLoadingHistory: boolean;
-  sendChatMessage: (text: string, options?: { imageFilenames?: string[] }) => void;
-  cancelChat: () => string | null;
-  // Session management
-  sessions: AssistantSession[];
-  activeSessionId: string | null;
-  createNewSession: () => void;
-  switchSession: (sessionId: string) => void;
-  removeSession: (sessionId: string) => void;
-  refreshSessions: () => Promise<void>;
-}
-
-const AssistantContext = createContext<AssistantContextValue | null>(null);
-
-// ---------------------------------------------------------------------------
-// ID generator (same as in use-assistant-chat.ts)
-// ---------------------------------------------------------------------------
-
-function nextId(): string {
-  return typeof crypto !== "undefined" && crypto.randomUUID
-    ? crypto.randomUUID()
-    : `msg-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
-}
-
-// ---------------------------------------------------------------------------
-// sessionStorage image cache — preserves imageFilenames across page reload
-// ---------------------------------------------------------------------------
-
-const IMAGE_CACHE_KEY = "assistant-image-cache";
-
-function cacheMessageImages(sessionId: string, userMsgIndex: number, filenames: string[]): void {
-  try {
-    const raw = sessionStorage.getItem(IMAGE_CACHE_KEY);
-    const cache: Record<string, Record<number, string[]>> = raw ? JSON.parse(raw) : {};
-    if (!cache[sessionId]) cache[sessionId] = {};
-    cache[sessionId][userMsgIndex] = filenames;
-    sessionStorage.setItem(IMAGE_CACHE_KEY, JSON.stringify(cache));
-  } catch { /* sessionStorage unavailable */ }
-}
-
-function getCachedImages(sessionId: string): Record<number, string[]> {
-  try {
-    const raw = sessionStorage.getItem(IMAGE_CACHE_KEY);
-    if (!raw) return {};
-    const cache = JSON.parse(raw) as Record<string, Record<number, string[]>>;
-    return cache[sessionId] ?? {};
-  } catch { return {}; }
-}
-
-// ---------------------------------------------------------------------------
-// SSE event type
-// ---------------------------------------------------------------------------
-
-interface SSEEvent {
-  type: "text" | "text_delta" | "tool_use" | "tool_start" | "tool_result" | "error" | "done";
-  content?: string;
-  sessionId?: string;
-  toolInput?: unknown;
-  toolOutput?: string;
-}
-
-// ---------------------------------------------------------------------------
-// Provider
-// ---------------------------------------------------------------------------
-
-export function AssistantProvider({ children }: { children: ReactNode }) {
-  const [isOpen, setIsOpen] = useState(false);
-  const [isStarting, setIsStarting] = useState(false);
-  const [displayMode, setDisplayMode] = useState<"sidebar" | "dialog">("sidebar");
-  const [worktreePath, setWorktreePath] = useState<string | null>(null);
-
-  // Chat state — lives here so it persists across route changes
-  const [chatMessages, setChatMessages] = useState<ChatMessage[]>([]);
-  const [chatStatus, setChatStatus] = useState<"idle" | "connecting" | "streaming" | "error">("idle");
-  const [isLoadingHistory, setIsLoadingHistory] = useState(false);
-  const msgsRef = useRef<ChatMessage[]>([]);
-  const sessionIdRef = useRef<string | null>(null);
-  const abortRef = useRef<AbortController | null>(null);
-
-  // Session management state
-  const [sessions, setSessions] = useState<AssistantSession[]>([]);
-  const [activeSessionId, setActiveSessionIdState] = useState<string | null>(null);
-  // Track whether the current session record has been created
-  const sessionCreatedRef = useRef(false);
-
-  const flushChat = useCallback(() => {
-    setChatMessages([...msgsRef.current]);
-  }, []);
-
-  // Read config
-  const refreshConfig = useCallback(async () => {
-    const dm = await getConfigValue<string>("assistant.displayMode", "sidebar");
-    setDisplayMode(dm === "dialog" ? "dialog" : "sidebar");
-  }, []);
-
-  useEffect(() => { refreshConfig(); }, [refreshConfig]);
-
-  // Session list from localStorage registry (not SDK — avoids cross-project leakage)
-  const refreshSessions = useCallback(async () => {
-    setSessions(getSessions());
-  }, []);
-
-  // Fetch history messages for a session from SDK via API
-  const loadSessionHistory = useCallback(async (sessionId: string) => {
-    setIsLoadingHistory(true);
-    try {
-      const res = await fetch(
-        `/api/internal/assistant/sessions?sessionId=${encodeURIComponent(sessionId)}`
-      );
-      if (!res.ok) return;
-      const data = await res.json();
-      if (Array.isArray(data.messages)) {
-        msgsRef.current = data.messages;
-        // Restore imageFilenames from sessionStorage cache
-        const imgCache = getCachedImages(sessionId);
-        if (Object.keys(imgCache).length > 0) {
-          let userIdx = 0;
-          msgsRef.current = msgsRef.current.map((m) => {
-            if (m.role === "user") {
-              const filenames = imgCache[userIdx];
-              userIdx++;
-              if (filenames?.length) return { ...m, imageFilenames: filenames };
-            }
-            return m;
-          });
-        }
-        setChatMessages([...msgsRef.current]);
-      }
-    } catch {
-      // Silently fail — user can still send new messages
-    } finally {
-      setIsLoadingHistory(false);
-    }
-  }, []);
-
-  // Load sessions on mount
-  useEffect(() => {
-    refreshSessions();
-    const activeId = getActiveSessionId();
-    if (activeId) {
-      setActiveSessionIdState(activeId);
-      sessionIdRef.current = activeId;
-      loadSessionHistory(activeId);
-    }
-  }, [refreshSessions, loadSessionHistory]);
-
-  const createNewSession = useCallback(() => {
-    abortRef.current?.abort();
-    sessionIdRef.current = null;
-    sessionCreatedRef.current = false;
-    setActiveSessionIdState(null);
-    setActiveSessionId(null);
-    msgsRef.current = [];
-    setChatMessages([]);
-    setChatStatus("idle");
-  }, []);
-
-  const switchSession = useCallback((sessionId: string) => {
-    abortRef.current?.abort();
-    sessionIdRef.current = sessionId;
-    sessionCreatedRef.current = true;
-    setActiveSessionIdState(sessionId);
-    setActiveSessionId(sessionId);
-    // Clear then load history from SDK
-    msgsRef.current = [];
-    setChatMessages([]);
-    setChatStatus("idle");
-    loadSessionHistory(sessionId);
-  }, [loadSessionHistory]);
-
-  const removeSession = useCallback((sessionId: string) => {
-    deleteSession(sessionId);
-    setSessions(getSessions());
-    if (activeSessionId === sessionId) {
-      createNewSession();
-    }
-  }, [activeSessionId, createNewSession]);
-
-  const openAssistant = useCallback(async () => {
-    setIsStarting(true);
-    try {
-      await refreshConfig();
-      setIsOpen(true);
-    } finally {
-      setIsStarting(false);
-    }
-  }, [refreshConfig]);
-
-  const closeAssistant = useCallback(() => {
-    setIsOpen(false);
-    // Abort any in-flight chat request
-    abortRef.current?.abort();
-  }, []);
-
-  const toggleAssistant = useCallback(() => {
-    if (isOpen || isStarting) {
-      closeAssistant();
-    } else {
-      openAssistant();
-    }
-  }, [isOpen, isStarting, closeAssistant, openAssistant]);
-
-  // Keyboard shortcut: Cmd+L / Ctrl+L
-  useEffect(() => {
-    const handleKeyDown = (e: KeyboardEvent) => {
-      if ((e.metaKey || e.ctrlKey) && e.key === "l") {
-        e.preventDefault();
-        toggleAssistant();
-      }
-    };
-    document.addEventListener("keydown", handleKeyDown);
-    return () => document.removeEventListener("keydown", handleKeyDown);
-  }, [toggleAssistant]);
-
-  // -------------------------------------------------------------------------
-  // Chat message sender — lives at provider level for persistence
-  // -------------------------------------------------------------------------
-  const sendChatMessage = useCallback(async (text: string, options?: { imageFilenames?: string[] }) => {
-    if (!text.trim() && !(options?.imageFilenames?.length)) return;
-
-    abortRef.current?.abort();
-    const controller = new AbortController();
-    abortRef.current = controller;
-
-    // Capture the first message text for session title
-    const isFirstMessage = msgsRef.current.length === 0 && !sessionCreatedRef.current;
-    const firstMessageText = isFirstMessage ? text : null;
-
-    const thinkingId = nextId();
-    msgsRef.current = [
-      ...msgsRef.current,
-      {
-        id: nextId(),
-        role: "user" as MessageRole,
-        content: text,
-        imageFilenames: options?.imageFilenames?.length ? options.imageFilenames : undefined,
-      },
-      { id: thinkingId, role: "thinking" as MessageRole, content: "", isStreaming: true },
-    ];
-    flushChat();
-    // Cache imageFilenames so they survive session reload
-    if (options?.imageFilenames?.length && sessionIdRef.current) {
-      const userMsgCount = msgsRef.current.filter((m) => m.role === "user").length - 1;
-      cacheMessageImages(sessionIdRef.current, userMsgCount, options.imageFilenames);
-    }
-    setChatStatus("connecting");
-
-    let assistantMsgId: string | null = null;
-
-    try {
-      const res = await fetch("/api/internal/assistant/chat", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          message: text,
-          sessionId: sessionIdRef.current,
-          imageFilenames: options?.imageFilenames ?? [],
-        }),
-        signal: controller.signal,
-      });
-
-      if (!res.ok || !res.body) throw new Error(`HTTP ${res.status}`);
-      setChatStatus("streaming");
-
-      const reader = res.body.getReader();
-      const decoder = new TextDecoder();
-      let buffer = "";
-
-      while (true) {
-        const { done, value } = await reader.read();
-        if (done) break;
-        buffer += decoder.decode(value, { stream: true });
-        const lines = buffer.split("\n");
-        buffer = lines.pop() ?? "";
-
-        for (const line of lines) {
-          if (!line.startsWith("data: ")) continue;
-          let event: SSEEvent;
-          try { event = JSON.parse(line.slice(6).trim()); } catch { continue; }
-          if (event.sessionId) {
-            const prevSessionId = sessionIdRef.current;
-            sessionIdRef.current = event.sessionId;
-            // Create session record on first sessionId received
-            if (firstMessageText && !sessionCreatedRef.current && event.sessionId !== prevSessionId) {
-              sessionCreatedRef.current = true;
-              const now = new Date().toISOString();
-              const newSession: AssistantSession = {
-                id: event.sessionId,
-                title: buildSessionTitle(firstMessageText),
-                createdAt: now,
-                updatedAt: now,
-              };
-              addSession(newSession);
-              setSessions(getSessions());
-              setActiveSessionIdState(event.sessionId);
-              setActiveSessionId(event.sessionId);
-              // Migrate cached images from the pre-session (null) key to the real sessionId
-              if (options?.imageFilenames?.length) {
-                cacheMessageImages(event.sessionId, 0, options.imageFilenames);
-              }
-            }
-          }
-
-          switch (event.type) {
-            case "text_delta": {
-              // Incremental streaming chunk — append to current assistant message
-              const filtered = msgsRef.current.filter((m) => m.id !== thinkingId);
-              if (assistantMsgId) {
-                msgsRef.current = filtered.map((m) =>
-                  m.id === assistantMsgId
-                    ? { ...m, content: m.content + (event.content ?? ""), isStreaming: true }
-                    : m
-                );
-              } else {
-                assistantMsgId = nextId();
-                msgsRef.current = [...filtered, {
-                  id: assistantMsgId, role: "assistant" as MessageRole,
-                  content: event.content ?? "", isStreaming: true,
-                }];
-              }
-              flushChat();
-              break;
-            }
-            case "text": {
-              // Complete message block — replace/finalize the assistant message
-              const filtered = msgsRef.current.filter((m) => m.id !== thinkingId);
-              if (assistantMsgId) {
-                // If we already have streaming content, finalize it rather than replace
-                msgsRef.current = filtered.map((m) =>
-                  m.id === assistantMsgId
-                    ? { ...m, content: event.content ?? m.content, isStreaming: true }
-                    : m
-                );
-              } else {
-                assistantMsgId = nextId();
-                msgsRef.current = [...filtered, {
-                  id: assistantMsgId, role: "assistant" as MessageRole,
-                  content: event.content ?? "", isStreaming: true,
-                }];
-              }
-              flushChat();
-              break;
-            }
-            case "tool_start": {
-              // Tool call starting — show indicator (streaming)
-              const filtered = msgsRef.current.filter((m) => m.id !== thinkingId);
-              if (assistantMsgId) {
-                msgsRef.current = filtered.map((m) =>
-                  m.id === assistantMsgId ? { ...m, isStreaming: false } : m
-                );
-                assistantMsgId = null;
-              } else {
-                msgsRef.current = filtered;
-              }
-              msgsRef.current = [...msgsRef.current, {
-                id: nextId(), role: "tool" as MessageRole,
-                content: `Calling ${event.content ?? "tool"}...`,
-                toolName: event.content,
-                isStreaming: true,
-              }];
-              flushChat();
-              break;
-            }
-            case "tool_use": {
-              const filtered = msgsRef.current.filter((m) => m.id !== thinkingId);
-              const updated = assistantMsgId
-                ? filtered.map((m) => m.id === assistantMsgId ? { ...m, isStreaming: false } : m)
-                : filtered;
-              assistantMsgId = null;
-              msgsRef.current = [...updated, {
-                id: nextId(), role: "tool" as MessageRole,
-                content: JSON.stringify(event.toolInput ?? {}, null, 2),
-                toolName: event.content,
-              }];
-              flushChat();
-              break;
-            }
-            case "tool_result": {
-              msgsRef.current = [...msgsRef.current, {
-                id: nextId(), role: "tool" as MessageRole,
-                content: String(event.toolOutput ?? ""),
-                toolName: `${event.content ?? "tool"} (result)`,
-              }];
-              flushChat();
-              break;
-            }
-            case "error": {
-              msgsRef.current = [...msgsRef.current.filter((m) => m.id !== thinkingId), {
-                id: nextId(), role: "assistant" as MessageRole,
-                content: `Error: ${event.content ?? "Unknown error"}`,
-              }];
-              flushChat();
-              setChatStatus("error");
-              break;
-            }
-            case "done": {
-              if (assistantMsgId) {
-                msgsRef.current = msgsRef.current.map((m) =>
-                  m.id === assistantMsgId ? { ...m, isStreaming: false } : m
-                );
-              }
-              msgsRef.current = msgsRef.current.filter((m) => m.id !== thinkingId);
-              flushChat();
-              setChatStatus("idle");
-              break;
-            }
-          }
-        }
-      }
-
-      // Final cleanup
-      msgsRef.current = msgsRef.current.filter((m) => m.id !== thinkingId);
-      flushChat();
-      setChatStatus((s) => (s === "streaming" ? "idle" : s));
-      // Refresh session list from SDK (picks up newly created sessions)
-      refreshSessions();
-    } catch (err: unknown) {
-      if ((err as Error).name === "AbortError") return;
-      msgsRef.current = [...msgsRef.current.filter((m) => m.id !== thinkingId), {
-        id: nextId(), role: "assistant" as MessageRole,
-        content: `Connection error: ${(err as Error).message ?? "Unknown error"}`,
-      }];
-      flushChat();
-      setChatStatus("error");
-    }
-  }, [flushChat, refreshSessions]);
-
-  // Cancel in-flight request, remove the last user message + assistant response,
-  // and return the user message text so the UI can restore it to the input box.
-  const cancelChat = useCallback((): string | null => {
-    abortRef.current?.abort();
-    abortRef.current = null;
-
-    // Find the last user message to restore
-    const lastUserMsg = [...msgsRef.current].reverse().find((m) => m.role === "user");
-    const restoredText = lastUserMsg?.content ?? null;
-
-    if (lastUserMsg) {
-      // Remove everything from the last user message onward (user + thinking + assistant partial)
-      const lastUserIdx = msgsRef.current.lastIndexOf(lastUserMsg);
-      msgsRef.current = msgsRef.current.slice(0, lastUserIdx);
-      setChatMessages([...msgsRef.current]);
-    }
-
-    setChatStatus("idle");
-    return restoredText;
-  }, []);
-
-  const lastMsg = chatMessages[chatMessages.length - 1];
-  const isChatThinking =
-    chatStatus === "connecting" || chatStatus === "streaming" ||
-    (lastMsg?.role === "thinking" && lastMsg.isStreaming === true);
-
-  return (
-    <AssistantContext.Provider
-      value={{
-        isOpen, isStarting, displayMode, worktreePath,
-        toggleAssistant, closeAssistant,
-        chatMessages, chatStatus, isChatThinking, isLoadingHistory, sendChatMessage, cancelChat,
-        sessions, activeSessionId, createNewSession, switchSession, removeSession, refreshSessions,
-      }}
-    >
-      {children}
-    </AssistantContext.Provider>
-  );
-}
-
-export function useAssistant(): AssistantContextValue {
-  const ctx = useContext(AssistantContext);
-  if (!ctx) throw new Error("useAssistant must be used within an AssistantProvider");
-  return ctx;
-}

package/src/components/assistant/image-preview-modal.tsx

@@ -1,60 +0,0 @@
-"use client";
-
-import { useState, useEffect } from "react";
-import { X } from "lucide-react";
-import { Dialog, DialogContent, DialogClose } from "@/components/ui/dialog";
-import { Button } from "@/components/ui/button";
-import { useI18n } from "@/lib/i18n";
-
-interface ImagePreviewModalProps {
-  imageUrl: string | null;
-  open: boolean;
-  onOpenChange: (open: boolean) => void;
-}
-
-export function ImagePreviewModal({
-  imageUrl,
-  open,
-  onOpenChange,
-}: ImagePreviewModalProps) {
-  const { t } = useI18n();
-  const [zoomed, setZoomed] = useState(false);
-
-  // Reset zoom when dialog opens/closes
-  useEffect(() => {
-    setZoomed(false);
-  }, [open]);
-
-  return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent
-        showCloseButton={false}
-        className="max-w-[90vw] max-h-[90vh] p-0 overflow-hidden bg-black/90 ring-0"
-      >
-        <DialogClose
-          render={
-            <Button
-              variant="ghost"
-              className="absolute top-2 right-2 z-10 h-8 w-8 p-0 text-white hover:bg-white/20 hover:text-white"
-            />
-          }
-          aria-label={t("assistant.closePreview")}
-        >
-          <X className="h-4 w-4" />
-        </DialogClose>
-        {imageUrl && (
-          <img
-            src={imageUrl}
-            alt=""
-            onClick={() => setZoomed((z) => !z)}
-            className={
-              zoomed
-                ? "w-auto h-auto max-w-none cursor-zoom-out"
-                : "max-w-full max-h-[85vh] object-contain cursor-zoom-in mx-auto"
-            }
-          />
-        )}
-      </DialogContent>
-    </Dialog>
-  );
-}

package/src/components/assistant/image-thumbnail-strip.tsx

@@ -1,94 +0,0 @@
-"use client";
-
-import { AlertCircle, X } from "lucide-react";
-import { useI18n } from "@/lib/i18n";
-import type { PendingImage } from "@/hooks/use-image-upload";
-
-interface ImageThumbnailStripProps {
-  pendingImages: PendingImage[];
-  onRemove: (id: string) => void;
-  onPreview: (image: PendingImage) => void;
-}
-
-export function ImageThumbnailStrip({
-  pendingImages,
-  onRemove,
-  onPreview,
-}: ImageThumbnailStripProps) {
-  const { t } = useI18n();
-
-  if (pendingImages.length === 0) {
-    return null;
-  }
-
-  return (
-    <div className="flex flex-row gap-2 px-4 pt-2 pb-0">
-      {pendingImages.map((image) => (
-        <div
-          key={image.id}
-          className={`relative h-12 w-12 shrink-0 rounded-md overflow-hidden ring-1 ${
-            image.status === "error" ? "ring-destructive" : "ring-border"
-          }`}
-        >
-          {/* Thumbnail image — clickable for preview */}
-          <button
-            type="button"
-            className={`h-full w-full p-0 border-0 bg-transparent ${
-              image.status === "uploading" ? "cursor-wait" : "cursor-pointer"
-            }`}
-            disabled={image.status === "uploading"}
-            aria-label={t("assistant.previewImage")}
-            onClick={() => onPreview(image)}
-          >
-            <img
-              src={image.blobUrl}
-              className="h-full w-full object-cover"
-              alt=""
-            />
-          </button>
-
-          {/* Progress overlay — visible while status === "uploading" */}
-          {image.status === "uploading" && (
-            <div className="absolute inset-0 flex flex-col justify-end bg-black/30">
-              <div
-                role="progressbar"
-                aria-valuenow={image.progress}
-                aria-valuemin={0}
-                aria-valuemax={100}
-                className="h-1 bg-primary transition-all duration-150"
-                style={{ width: `${image.progress}%` }}
-              />
-              <span className="absolute inset-0 flex items-center justify-center text-[10px] font-semibold text-white">
-                {image.progress}%
-              </span>
-            </div>
-          )}
-
-          {/* Error overlay — visible when status === "error" */}
-          {image.status === "error" && (
-            <div className="absolute inset-0 flex items-center justify-center bg-black/30">
-              <AlertCircle className="h-4 w-4 text-white" />
-            </div>
-          )}
-
-          {/* X remove button — always visible */}
-          <button
-            className="absolute top-1 right-1 h-4 w-4 rounded-full bg-black/60 text-white flex items-center justify-center hover:bg-black/80 transition-colors"
-            aria-label={t("assistant.removeImage")}
-            title={
-              image.status === "error"
-                ? t("assistant.uploadFailedRemoveHint")
-                : undefined
-            }
-            onClick={(e) => {
-              e.stopPropagation();
-              onRemove(image.id);
-            }}
-          >
-            <X className="h-2.5 w-2.5" />
-          </button>
-        </div>
-      ))}
-    </div>
-  );
-}