tower-studio 0.1.3 → 0.1.6

package/src/components/board/board-column.tsx

@@ -1,115 +0,0 @@
-"use client";
-
-import { useState } from "react";
-import { useDroppable } from "@dnd-kit/core";
-import { SortableContext, verticalListSortingStrategy } from "@dnd-kit/sortable";
-import { Plus, LayoutGrid } from "lucide-react";
-import { TaskCard } from "./task-card";
-import { ColumnTasksDialog } from "./column-tasks-dialog";
-import { Button } from "@/components/ui/button";
-import { ScrollArea } from "@/components/ui/scroll-area";
-import { useI18n } from "@/lib/i18n";
-import type { TaskWithLabels } from "@/types";
-
-interface BoardColumnProps {
-  id: string;
-  label: string;
-  color: string;
-  tasks: TaskWithLabels[];
-  onTaskClick?: (task: TaskWithLabels) => void;
-  onEditTask?: (task: TaskWithLabels) => void;
-  onAddTask?: () => void;
-  onDeleteTask?: (taskId: string) => void;
-  onTogglePin?: (taskId: string) => void;
-  onContextMenu?: (task: TaskWithLabels, x: number, y: number) => void;
-}
-
-export function BoardColumn({
-  id,
-  label,
-  color,
-  tasks,
-  onTaskClick,
-  onEditTask,
-  onAddTask,
-  onDeleteTask,
-  onTogglePin,
-  onContextMenu,
-}: BoardColumnProps) {
-  const { setNodeRef, isOver } = useDroppable({ id });
-  const [viewAllOpen, setViewAllOpen] = useState(false);
-  const { t } = useI18n();
-
-  return (
-    <div
-      className={`flex w-0 min-w-[220px] flex-1 flex-col min-h-0 border-r border-border/50 last:border-r-0 transition-colors ${
-        isOver ? "bg-primary/[0.06]" : ""
-      }`}
-    >
-      {/* Column Header */}
-      <div className="flex items-center justify-between px-3 py-2.5 border-b border-border/30">
-        <div className="flex items-center gap-2">
-          <div className={`h-2 w-2 rounded-full ${color}`} />
-          <span className="text-xs font-semibold tracking-wide text-secondary-foreground">{label}</span>
-          <span className="rounded-md bg-muted px-1.5 py-0.5 text-[10px] font-mono font-medium text-muted-foreground">
-            {tasks.length}
-          </span>
-        </div>
-        <div className="flex items-center gap-0.5">
-          <Button
-            variant="ghost"
-            size="icon-xs"
-            onClick={() => setViewAllOpen(true)}
-            className="text-muted-foreground"
-            aria-label={t("board.viewAll")}
-          >
-            <LayoutGrid className="h-3.5 w-3.5" />
-          </Button>
-          <Button
-            variant="ghost"
-            size="icon-xs"
-            onClick={onAddTask}
-            className="text-muted-foreground"
-            aria-label="add"
-          >
-            <Plus className="h-3.5 w-3.5" />
-          </Button>
-        </div>
-      </div>
-
-      <ColumnTasksDialog
-        open={viewAllOpen}
-        onOpenChange={setViewAllOpen}
-        columnLabel={label}
-        columnColor={color}
-        tasks={tasks}
-        onTaskClick={onTaskClick}
-      />
-
-      {/* Task List */}
-      <ScrollArea className="flex-1 min-h-0">
-        <div
-          ref={setNodeRef}
-          className="flex flex-col gap-2 p-2"
-        >
-          <SortableContext
-            items={tasks.map((t) => t.id)}
-            strategy={verticalListSortingStrategy}
-          >
-            {tasks.map((task) => (
-              <TaskCard
-                key={task.id}
-                task={task}
-                onClick={() => onTaskClick?.(task)}
-                onEdit={onEditTask}
-                onDelete={onDeleteTask}
-                onTogglePin={onTogglePin}
-                onContextMenu={onContextMenu}
-              />
-            ))}
-          </SortableContext>
-        </div>
-      </ScrollArea>
-    </div>
-  );
-}

package/src/components/board/board-filters.tsx

@@ -1,42 +0,0 @@
-"use client";
-
-import { Plus, Search } from "lucide-react";
-import { Button } from "@/components/ui/button";
-import { useI18n } from "@/lib/i18n";
-
-interface BoardFiltersProps {
-  searchQuery: string;
-  onSearchChange: (query: string) => void;
-  onCreateTask: () => void;
-}
-
-export function BoardFilters({
-  searchQuery,
-  onSearchChange,
-  onCreateTask,
-}: BoardFiltersProps) {
-  const { t } = useI18n();
-  return (
-    <div className="flex items-center gap-2 px-6 py-2">
-      <div className="relative flex-1 max-w-xs">
-        <Search className="absolute left-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" />
-        <input
-          type="text"
-          value={searchQuery}
-          onChange={(e) => onSearchChange(e.target.value)}
-          placeholder={t("board.searchPlaceholder")}
-          className="h-8 w-full rounded-lg border border-border bg-background pl-8 pr-3 text-xs text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-primary"
-        />
-      </div>
-      <Button
-        data-tour="create-task"
-        variant="outline"
-        className="ml-auto gap-1.5 border-border text-xs text-muted-foreground hover:border-primary/30 hover:text-primary"
-        onClick={onCreateTask}
-      >
-        <Plus className="h-3.5 w-3.5" />
-        {t("board.newTask")}
-      </Button>
-    </div>
-  );
-}

package/src/components/board/board-stats.tsx

@@ -1,52 +0,0 @@
-"use client";
-
-import { ClipboardList, Zap, Lightbulb } from "lucide-react";
-import { useI18n } from "@/lib/i18n";
-
-interface BoardStatsProps {
-  totalTasks: number;
-  runningTasks: number;
-}
-
-export function BoardStats({ totalTasks, runningTasks }: BoardStatsProps) {
-  const { t } = useI18n();
-  return (
-    <div className="grid grid-cols-3 gap-3 px-6 py-4">
-      <div className="rounded-xl border border-border bg-card p-4">
-        <div className="flex items-center gap-3">
-          <div className="rounded-lg bg-sky-500/10 p-2 ring-1 ring-sky-500/20">
-            <ClipboardList className="h-4 w-4 text-sky-400" />
-          </div>
-          <div>
-            <p className="text-[11px] font-medium uppercase tracking-wider text-muted-foreground">{t("board.overview")}</p>
-            <p className="text-2xl font-bold font-mono tracking-tight text-foreground">{totalTasks}</p>
-          </div>
-        </div>
-      </div>
-
-      <div className="rounded-xl border border-border bg-card p-4">
-        <div className="flex items-center gap-3">
-          <div className="rounded-lg bg-primary/10 p-2 ring-1 ring-primary/20">
-            <Zap className="h-4 w-4 text-primary" />
-          </div>
-          <div>
-            <p className="text-[11px] font-medium uppercase tracking-wider text-muted-foreground">{t("board.running")}</p>
-            <p className="text-2xl font-bold font-mono tracking-tight text-foreground">{runningTasks}</p>
-          </div>
-        </div>
-      </div>
-
-      <div className="rounded-xl border border-border bg-card p-4">
-        <div className="flex items-center gap-3">
-          <div className="rounded-lg bg-emerald-500/10 p-2 ring-1 ring-emerald-500/20">
-            <Lightbulb className="h-4 w-4 text-emerald-400" />
-          </div>
-          <div>
-            <p className="text-[11px] font-medium uppercase tracking-wider text-muted-foreground">{t("board.tip")}</p>
-            <p className="text-xs font-medium text-foreground/80">{t("board.tipText")}</p>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}

package/src/components/board/column-tasks-dialog.tsx

@@ -1,100 +0,0 @@
-"use client";
-
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
-import { Badge } from "@/components/ui/badge";
-import { ScrollArea } from "@/components/ui/scroll-area";
-import { PRIORITY_CONFIG } from "@/lib/constants";
-import { useI18n } from "@/lib/i18n";
-import type { TaskWithLabels } from "@/types";
-
-interface ColumnTasksDialogProps {
-  open: boolean;
-  onOpenChange: (open: boolean) => void;
-  columnLabel: string;
-  columnColor: string;
-  tasks: TaskWithLabels[];
-  onTaskClick?: (task: TaskWithLabels) => void;
-}
-
-export function ColumnTasksDialog({
-  open,
-  onOpenChange,
-  columnLabel,
-  columnColor,
-  tasks,
-  onTaskClick,
-}: ColumnTasksDialogProps) {
-  const { t } = useI18n();
-
-  return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-w-4xl max-h-[80vh]">
-        <DialogHeader>
-          <DialogTitle className="flex items-center gap-2">
-            <div className={`h-2.5 w-2.5 rounded-full ${columnColor}`} />
-            <span>{columnLabel}</span>
-            <span className="rounded-md bg-muted px-1.5 py-0.5 text-xs font-mono font-medium text-muted-foreground">
-              {tasks.length}
-            </span>
-          </DialogTitle>
-        </DialogHeader>
-        <ScrollArea className="max-h-[calc(80vh-80px)]">
-          <div className="grid grid-cols-3 gap-3 pr-3">
-            {tasks.map((task) => {
-              const priorityConfig = PRIORITY_CONFIG[task.priority];
-              return (
-                <div
-                  key={task.id}
-                  className="cursor-pointer rounded-lg border border-border bg-card p-3 transition-all hover:border-primary/20 hover:bg-accent/50"
-                  onClick={() => {
-                    onTaskClick?.(task);
-                    onOpenChange(false);
-                  }}
-                >
-                  <h4 className="text-sm font-medium text-foreground line-clamp-2">
-                    {task.title}
-                  </h4>
-                  {task.description && (
-                    <p className="mt-1.5 line-clamp-2 text-xs leading-relaxed text-muted-foreground">
-                      {task.description}
-                    </p>
-                  )}
-                  <div className="mt-2 flex items-center gap-1.5 flex-wrap">
-                    <Badge
-                      variant="secondary"
-                      className={`text-[10px] font-semibold ${priorityConfig.color}`}
-                    >
-                      {priorityConfig.label}
-                    </Badge>
-                    {task.labels?.map((tl) => (
-                      <span
-                        key={tl.label.id}
-                        className="rounded-full px-1.5 py-0.5 text-[10px] font-medium"
-                        style={{
-                          backgroundColor: tl.label.color + "20",
-                          color: tl.label.color,
-                        }}
-                      >
-                        {tl.label.name}
-                      </span>
-                    ))}
-                  </div>
-                </div>
-              );
-            })}
-            {tasks.length === 0 && (
-              <div className="col-span-3 py-8 text-center text-sm text-muted-foreground">
-                {t("board.noTasks")}
-              </div>
-            )}
-          </div>
-        </ScrollArea>
-      </DialogContent>
-    </Dialog>
-  );
-}

package/src/components/board/create-task-dialog.tsx

@@ -1,362 +0,0 @@
-"use client";
-
-import { useState, useEffect } from "react";
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogFooter,
-} from "@/components/ui/dialog";
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-import { Textarea } from "@/components/ui/textarea";
-import { Label } from "@/components/ui/label";
-import { GitBranch, Check, ChevronsUpDown } from "lucide-react";
-import {
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-} from "@/components/ui/popover";
-import {
-  Command,
-  CommandEmpty,
-  CommandGroup,
-  CommandInput,
-  CommandItem,
-  CommandList,
-} from "@/components/ui/command";
-import { useI18n } from "@/lib/i18n";
-import { getProjectBranches, fetchRemoteBranches, getCurrentBranch } from "@/actions/git-actions";
-import type { Task, Priority, TaskStatus } from "@prisma/client";
-
-interface LabelOption {
-  id: string;
-  name: string;
-  color: string;
-  isBuiltin: boolean;
-}
-
-interface CreateTaskDialogProps {
-  open: boolean;
-  onOpenChange: (open: boolean) => void;
-  onSubmit: (data: {
-    title: string;
-    description: string;
-    priority: Priority;
-    status: TaskStatus;
-    labelIds: string[];
-    baseBranch?: string;
-    subPath?: string;
-  }) => void;
-  onUpdate?: (taskId: string, data: {
-    title: string;
-    description: string;
-    priority: Priority;
-    labelIds: string[];
-    subPath?: string;
-  }) => void;
-  defaultStatus?: TaskStatus;
-  editTask?: Task | null;
-  editTaskLabelIds?: string[];
-  labels: LabelOption[];
-  projectType?: string;
-  projectLocalPath?: string | null;
-}
-
-export function CreateTaskDialog({
-  open,
-  onOpenChange,
-  onSubmit,
-  onUpdate,
-  defaultStatus = "TODO",
-  editTask,
-  editTaskLabelIds,
-  labels,
-  projectType: _projectType,
-  projectLocalPath,
-}: CreateTaskDialogProps) {
-  const [title, setTitle] = useState("");
-  const [description, setDescription] = useState("");
-  const [priority, setPriority] = useState<Priority>("MEDIUM");
-  const [subPath, setSubPath] = useState("");
-  const [selectedLabelIds, setSelectedLabelIds] = useState<string[]>([]);
-  const [branches, setBranches] = useState<string[]>([]);
-  const [branchesLoading, setBranchesLoading] = useState(false);
-  const [selectedBranch, setSelectedBranch] = useState<string>("");
-  const [branchOpen, setBranchOpen] = useState(false);
-  const [useWorktree, setUseWorktree] = useState(true);
-  const { t } = useI18n();
-
-  const isEditing = !!editTask;
-  const isGitProject = !!projectLocalPath;
-
-  // Pre-fill when editing
-  useEffect(() => {
-    if (editTask) {
-      setTitle(editTask.title);
-      setDescription(editTask.description ?? "");
-      setPriority(editTask.priority);
-      setSubPath(editTask.subPath ?? "");
-      setSelectedLabelIds(editTaskLabelIds ?? []);
-    } else {
-      setTitle("");
-      setDescription("");
-      setPriority("MEDIUM");
-      setSubPath("");
-      setSelectedLabelIds([]);
-    }
-  }, [editTask, editTaskLabelIds]);
-
-  // Reset when dialog closes
-  useEffect(() => {
-    if (!open && !editTask) {
-      setTitle("");
-      setDescription("");
-      setPriority("MEDIUM");
-      setSubPath("");
-      setSelectedLabelIds([]);
-      setBranches([]);
-      setSelectedBranch("");
-      setBranchOpen(false);
-    }
-  }, [open, editTask]);
-
-  // Load branches instantly from cache, then refresh after background fetch
-  useEffect(() => {
-    if (!open || !isGitProject || editTask) return;
-    setBranchesLoading(true);
-    // 1. Load cached branches + current branch immediately (no network)
-    Promise.all([
-      getProjectBranches(projectLocalPath!),
-      getCurrentBranch(projectLocalPath!),
-    ]).then(([list, current]) => {
-      setBranches(list);
-      // Default to current active branch, fallback to first
-      setSelectedBranch(current && list.includes(current) ? current : list[0] ?? "");
-      setBranchesLoading(false);
-      // 2. Trigger background git fetch, then refresh list
-      fetchRemoteBranches(projectLocalPath!).then(() => {
-        // Wait a moment for fetch to complete, then reload
-        setTimeout(() => {
-          getProjectBranches(projectLocalPath!).then((updated) => {
-            setBranches(updated);
-            // Keep selection if still valid, otherwise pick first
-            setSelectedBranch((prev) => updated.includes(prev) ? prev : updated[0] ?? "");
-          }).catch(() => {});
-        }, 3000);
-      });
-    }).catch(() => {
-      setBranches([]);
-      setSelectedBranch("");
-      setBranchesLoading(false);
-    });
-  }, [open, isGitProject, projectLocalPath, editTask]);
-
-  const handleSubmit = () => {
-    if (!title.trim()) return;
-    if (isEditing && onUpdate) {
-      onUpdate(editTask.id, { title, description, priority, labelIds: selectedLabelIds, subPath: subPath.trim() || "" });
-    } else {
-      onSubmit({
-        title,
-        description,
-        priority,
-        status: defaultStatus,
-        labelIds: selectedLabelIds,
-        ...(isGitProject && useWorktree && selectedBranch ? { baseBranch: selectedBranch } : {}),
-        ...(subPath.trim() ? { subPath: subPath.trim() } : {}),
-      });
-    }
-    setTitle("");
-    setDescription("");
-    setPriority("MEDIUM");
-    setSubPath("");
-    setSelectedLabelIds([]);
-    setBranches([]);
-    setSelectedBranch("");
-    setUseWorktree(true);
-    onOpenChange(false);
-  };
-
-  return (
-    <Dialog open={open} onOpenChange={onOpenChange} disablePointerDismissal>
-      <DialogContent className="sm:max-w-md">
-        <DialogHeader>
-          <DialogTitle>{isEditing ? t("task.edit") : t("task.create")}</DialogTitle>
-        </DialogHeader>
-        <div className="space-y-4 py-2">
-          <div className="space-y-2">
-            <Label htmlFor="title">{t("task.title")}</Label>
-            <Input
-              id="title"
-              data-testid="task-title"
-              placeholder={t("task.titlePlaceholder")}
-              value={title}
-              onChange={(e) => setTitle(e.target.value)}
-              onKeyDown={(e) => e.key === "Enter" && e.preventDefault()}
-            />
-          </div>
-          <div className="space-y-2">
-            <Label htmlFor="description">{t("task.description")}</Label>
-            <Textarea
-              id="description"
-              placeholder={t("task.descPlaceholder")}
-              rows={4}
-              value={description}
-              onChange={(e) => setDescription(e.target.value)}
-              className="max-h-[200px] overflow-y-auto"
-            />
-          </div>
-          <div className="space-y-2">
-            <Label htmlFor="subPath">{t("task.subPath")}</Label>
-            <Input
-              id="subPath"
-              placeholder={t("task.subPathPlaceholder")}
-              value={subPath}
-              onChange={(e) => setSubPath(e.target.value)}
-            />
-            <p className="text-xs text-muted-foreground">{t("task.subPathHint")}</p>
-          </div>
-          {/* Priority - Button Group instead of Select */}
-          <div className="space-y-2">
-            <Label>{t("task.priority")}</Label>
-            <div className="flex gap-1.5">
-              {(["LOW", "MEDIUM", "HIGH", "CRITICAL"] as const).map((p) => {
-                const config = {
-                  LOW: { label: t("task.priorityLow"), style: "text-slate-300 border-slate-500/30 bg-slate-500/10" },
-                  MEDIUM: { label: t("task.priorityMedium"), style: "text-amber-300 border-amber-500/30 bg-amber-500/10" },
-                  HIGH: { label: t("task.priorityHigh"), style: "text-orange-300 border-orange-500/30 bg-orange-500/10" },
-                  CRITICAL: { label: t("task.priorityCritical"), style: "text-rose-300 border-rose-500/30 bg-rose-500/10" },
-                }[p];
-                return (
-                  <button
-                    key={p}
-                    type="button"
-                    onClick={() => setPriority(p)}
-                    className={`rounded-lg border px-3 py-1.5 text-xs font-medium transition-all ${
-                      priority === p
-                        ? `${config.style} ring-1 ring-current/20`
-                        : "border-border text-muted-foreground hover:bg-accent"
-                    }`}
-                  >
-                    {config.label}
-                  </button>
-                );
-              })}
-            </div>
-          </div>
-          {/* Base Branch Selector - only for GIT projects in create mode */}
-          {isGitProject && !isEditing && (
-            <div className="space-y-2">
-              <Label>{t("task.baseBranch")}</Label>
-              {branchesLoading ? (
-                <div className="text-sm text-muted-foreground">{t("task.branchLoading")}</div>
-              ) : branches.length > 0 ? (
-                <Popover open={branchOpen} onOpenChange={setBranchOpen}>
-                  <PopoverTrigger
-                    className="flex w-full items-center gap-2 rounded-md border border-input bg-background px-3 py-2 text-sm font-mono transition-colors hover:bg-accent focus:outline-none focus:ring-1 focus:ring-ring"
-                    data-testid="branch-selector"
-                  >
-                    <GitBranch className="h-3.5 w-3.5 text-muted-foreground shrink-0" />
-                    <span className="flex-1 truncate text-left text-xs">{selectedBranch || t("task.branchNone")}</span>
-                    <ChevronsUpDown className="h-3.5 w-3.5 shrink-0 opacity-50" />
-                  </PopoverTrigger>
-                  <PopoverContent className="p-0" align="start">
-                    <Command>
-                      <CommandInput placeholder={t("task.branchSearch")} />
-                      <CommandList>
-                        <CommandEmpty>{t("task.branchNone")}</CommandEmpty>
-                        <CommandGroup>
-                          {branches.map((branch) => (
-                            <CommandItem
-                              key={branch}
-                              value={branch}
-                              onSelect={() => { setSelectedBranch(branch); setBranchOpen(false); }}
-                            >
-                              <GitBranch className="h-3 w-3 text-muted-foreground shrink-0 mr-2" />
-                              <span className="flex-1 truncate font-mono">{branch}</span>
-                              {branch === selectedBranch && <Check className="h-3 w-3 text-primary shrink-0 ml-auto" />}
-                            </CommandItem>
-                          ))}
-                        </CommandGroup>
-                      </CommandList>
-                    </Command>
-                  </PopoverContent>
-                </Popover>
-              ) : (
-                <div className="text-sm text-muted-foreground">{t("task.branchNone")}</div>
-              )}
-              {/* Worktree toggle */}
-              <div className="mt-3 flex items-center gap-2">
-                <Label className="text-xs text-muted-foreground">{t("task.worktreeLabel")}</Label>
-                <div className="flex gap-1">
-                  {([true, false] as const).map((val) => (
-                    <button
-                      key={String(val)}
-                      type="button"
-                      onClick={() => setUseWorktree(val)}
-                      className={`rounded-md px-3 py-1 text-xs font-medium transition-colors ${
-                        useWorktree === val
-                          ? "bg-primary text-primary-foreground"
-                          : "bg-muted text-muted-foreground hover:text-foreground"
-                      }`}
-                    >
-                      {val ? t("task.worktreeYes") : t("task.worktreeNo")}
-                    </button>
-                  ))}
-                </div>
-              </div>
-            </div>
-          )}
-          {/* Labels */}
-          {labels.length > 0 && (
-            <div className="space-y-2">
-              <Label>{t("task.labels")}</Label>
-              <div className="flex flex-wrap gap-1.5">
-                {labels.map((label) => {
-                  const isSelected = selectedLabelIds.includes(label.id);
-                  return (
-                    <button
-                      key={label.id}
-                      type="button"
-                      onClick={() => {
-                        setSelectedLabelIds((prev) =>
-                          isSelected ? prev.filter((id) => id !== label.id) : [...prev, label.id]
-                        );
-                      }}
-                      className={`rounded-full px-2.5 py-1 text-xs font-medium transition-all ${
-                        isSelected
-                          ? "ring-1 ring-current/30"
-                          : "opacity-50 hover:opacity-80"
-                      }`}
-                      style={{
-                        backgroundColor: label.color + "20",
-                        color: label.color,
-                        borderColor: isSelected ? label.color + "40" : "transparent",
-                        borderWidth: "1px",
-                      }}
-                    >
-                      {label.name}
-                    </button>
-                  );
-                })}
-              </div>
-            </div>
-          )}
-        </div>
-        <DialogFooter>
-          <Button variant="outline" onClick={() => onOpenChange(false)}>
-            {t("common.cancel")}
-          </Button>
-          <Button
-            onClick={handleSubmit}
-            className="bg-primary/10 text-primary ring-1 ring-primary/20 hover:bg-primary/15"
-          >
-            {isEditing ? t("common.save") : t("common.create")}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}