tower-studio 0.1.2 → 0.1.5

package/.next/standalone/tower/src/components/board/kanban-board.tsx

@@ -1,169 +0,0 @@
-"use client";
-
-import { useState, useCallback, useEffect } from "react";
-import { TaskCardContextMenu } from "./task-card-context-menu";
-import {
-  DndContext,
-  DragOverlay,
-  closestCorners,
-  PointerSensor,
-  useSensor,
-  useSensors,
-  type DragStartEvent,
-  type DragEndEvent,
-} from "@dnd-kit/core";
-import { BoardColumn } from "./board-column";
-import { TaskCard } from "./task-card";
-import { BOARD_COLUMNS } from "@/lib/constants";
-import type { TaskStatus } from "@prisma/client";
-import type { TaskWithLabels } from "@/types";
-
-interface KanbanBoardProps {
-  initialTasks: TaskWithLabels[];
-  onTaskMove?: (taskId: string, newStatus: TaskStatus) => void;
-  onTaskClick?: (task: TaskWithLabels) => void;
-  onEditTask?: (task: TaskWithLabels) => void;
-  onAddTask?: (status: TaskStatus) => void;
-  onDeleteTask?: (taskId: string) => void;
-  onTogglePin?: (taskId: string) => void;
-  onContextMenuStatusChange?: (taskId: string, status: TaskStatus) => void;
-  onContextMenuLaunch?: (taskId: string) => void;
-  workspaceId?: string;
-}
-
-export function KanbanBoard({
-  initialTasks,
-  onTaskMove,
-  onTaskClick,
-  onEditTask,
-  onAddTask,
-  onDeleteTask,
-  onTogglePin,
-  onContextMenuStatusChange,
-  onContextMenuLaunch,
-  workspaceId,
-}: KanbanBoardProps) {
-  // Local tasks state for optimistic drag updates
-  const [tasks, setTasks] = useState<TaskWithLabels[]>(initialTasks);
-  const [activeTask, setActiveTask] = useState<TaskWithLabels | null>(null);
-  const [contextMenu, setContextMenu] = useState<{
-    task: TaskWithLabels;
-    x: number;
-    y: number;
-  } | null>(null);
-
-  // Sync with server data when props change
-  useEffect(() => {
-    setTasks(initialTasks);
-  }, [initialTasks]);
-
-  const sensors = useSensors(
-    useSensor(PointerSensor, {
-      activationConstraint: { distance: 8 },
-    })
-  );
-
-  const handleContextMenu = useCallback((task: TaskWithLabels, x: number, y: number) => {
-    setContextMenu({ task, x, y });
-  }, []);
-
-  const handleDragStart = useCallback(
-    (event: DragStartEvent) => {
-      const task = tasks.find((t) => t.id === event.active.id);
-      if (task) setActiveTask(task);
-    },
-    [tasks]
-  );
-
-  const handleDragEnd = useCallback(
-    (event: DragEndEvent) => {
-      const { active, over } = event;
-      setActiveTask(null);
-
-      if (!over) return;
-
-      const activeId = active.id as string;
-      const overId = over.id as string;
-
-      // Determine target column
-      const isOverColumn = BOARD_COLUMNS.some((col) => col.id === overId);
-      let targetStatus: TaskStatus | undefined;
-
-      if (isOverColumn) {
-        targetStatus = overId as TaskStatus;
-      } else {
-        // Dropped on another task — use that task's column
-        const overTask = tasks.find((t) => t.id === overId);
-        targetStatus = overTask?.status;
-      }
-
-      if (targetStatus) {
-        // Optimistic update
-        setTasks((prev) =>
-          prev.map((t) =>
-            t.id === activeId ? { ...t, status: targetStatus! } : t
-          )
-        );
-        // Persist to server
-        onTaskMove?.(activeId, targetStatus);
-      }
-    },
-    [tasks, onTaskMove]
-  );
-
-  return (
-    <DndContext
-      id="kanban-board"
-      sensors={sensors}
-      collisionDetection={closestCorners}
-      onDragStart={handleDragStart}
-      onDragEnd={handleDragEnd}
-    >
-      <div className="mx-2 flex h-full overflow-x-auto rounded-xl border border-border bg-card/50">
-        {BOARD_COLUMNS.map((column) => (
-          <BoardColumn
-            key={column.id}
-            id={column.id}
-            label={column.label}
-            color={column.color}
-            tasks={tasks.filter((t) => t.status === column.id)}
-            onTaskClick={onTaskClick}
-            onEditTask={onEditTask}
-            onAddTask={() => onAddTask?.(column.id)}
-            onDeleteTask={onDeleteTask}
-            onTogglePin={onTogglePin}
-            onContextMenu={handleContextMenu}
-          />
-        ))}
-      </div>
-
-      <DragOverlay>
-        {activeTask ? (
-          <div className="rotate-3 scale-105">
-            <TaskCard task={activeTask} />
-          </div>
-        ) : null}
-      </DragOverlay>
-
-      {contextMenu && (
-        <TaskCardContextMenu
-          x={contextMenu.x}
-          y={contextMenu.y}
-          taskId={contextMenu.task.id}
-          currentStatus={contextMenu.task.status}
-          hasExecutions={((contextMenu.task as any)._count?.executions ?? 0) > 0}
-          workspaceId={workspaceId ?? ""}
-          onClose={() => setContextMenu(null)}
-          onStatusChange={(taskId, status) => {
-            onContextMenuStatusChange?.(taskId, status);
-            setContextMenu(null);
-          }}
-          onLaunch={(taskId) => {
-            onContextMenuLaunch?.(taskId);
-            setContextMenu(null);
-          }}
-        />
-      )}
-    </DndContext>
-  );
-}

package/.next/standalone/tower/src/components/board/project-tabs.tsx

@@ -1,93 +0,0 @@
-"use client";
-
-import { useRef, useState, useEffect } from "react";
-import { ChevronLeft, ChevronRight } from "lucide-react";
-
-interface ProjectTabsProps {
-  projects: Array<{ id: string; name: string; alias: string | null }>;
-  activeProjectId: string;
-  onSelect: (projectId: string) => void;
-}
-
-export function ProjectTabs({ projects, activeProjectId, onSelect }: ProjectTabsProps) {
-  const scrollRef = useRef<HTMLDivElement>(null);
-  const [showLeftArrow, setShowLeftArrow] = useState(false);
-  const [showRightArrow, setShowRightArrow] = useState(false);
-
-  const checkOverflow = () => {
-    const el = scrollRef.current;
-    if (!el) return;
-    setShowLeftArrow(el.scrollLeft > 0);
-    setShowRightArrow(el.scrollLeft < el.scrollWidth - el.clientWidth - 1);
-  };
-
-  useEffect(() => {
-    checkOverflow();
-    const el = scrollRef.current;
-    if (el) {
-      el.addEventListener("scroll", checkOverflow);
-      const observer = new ResizeObserver(checkOverflow);
-      observer.observe(el);
-      return () => {
-        el.removeEventListener("scroll", checkOverflow);
-        observer.disconnect();
-      };
-    }
-  }, [projects]);
-
-  const scroll = (direction: "left" | "right") => {
-    const el = scrollRef.current;
-    if (!el) return;
-    el.scrollBy({ left: direction === "left" ? -150 : 150, behavior: "smooth" });
-  };
-
-  return (
-    <div className="relative flex items-center">
-      {showLeftArrow && (
-        <button
-          onClick={() => scroll("left")}
-          className="absolute left-0 z-10 flex h-8 w-8 items-center justify-center rounded-md bg-background/90 text-muted-foreground shadow-sm ring-1 ring-border backdrop-blur-sm transition-colors hover:text-foreground"
-        >
-          <ChevronLeft className="h-4 w-4" />
-        </button>
-      )}
-
-      <div
-        ref={scrollRef}
-        className="flex items-center gap-1.5 overflow-x-auto scrollbar-none px-1 py-1"
-        style={{ scrollbarWidth: "none", msOverflowStyle: "none" }}
-      >
-        {projects.map((p) => {
-          const isActive = activeProjectId === p.id;
-          return (
-            <button
-              key={p.id}
-              onClick={() => { if (!isActive) onSelect(p.id); }}
-              className={`shrink-0 rounded-lg border-b-2 px-4 py-2 text-sm font-medium transition-colors ${
-                isActive
-                  ? "border-primary bg-primary/10 text-primary ring-1 ring-primary/20 cursor-default"
-                  : "border-transparent text-muted-foreground hover:bg-accent hover:text-foreground cursor-pointer"
-              }`}
-            >
-              <span>{p.name}</span>
-              {p.alias && (
-                <span className="ml-1.5 text-xs text-muted-foreground font-normal">
-                  {p.alias}
-                </span>
-              )}
-            </button>
-          );
-        })}
-      </div>
-
-      {showRightArrow && (
-        <button
-          onClick={() => scroll("right")}
-          className="absolute right-0 z-10 flex h-8 w-8 items-center justify-center rounded-md bg-background/90 text-muted-foreground shadow-sm ring-1 ring-border backdrop-blur-sm transition-colors hover:text-foreground"
-        >
-          <ChevronRight className="h-4 w-4" />
-        </button>
-      )}
-    </div>
-  );
-}

package/.next/standalone/tower/src/components/board/task-card-context-menu.tsx

@@ -1,121 +0,0 @@
-"use client";
-
-import { useEffect, useRef } from "react";
-import { createPortal } from "react-dom";
-import { useRouter } from "next/navigation";
-import { Check } from "lucide-react";
-import type { TaskStatus } from "@prisma/client";
-import { useI18n } from "@/lib/i18n";
-import { BOARD_COLUMNS } from "@/lib/constants";
-
-interface TaskCardContextMenuProps {
-  x: number;
-  y: number;
-  taskId: string;
-  currentStatus: TaskStatus;
-  hasExecutions: boolean;
-  workspaceId: string;
-  onClose: () => void;
-  onStatusChange: (taskId: string, status: TaskStatus) => void;
-  onLaunch: (taskId: string) => void;
-}
-
-export function TaskCardContextMenu({
-  x,
-  y,
-  taskId,
-  currentStatus,
-  hasExecutions,
-  workspaceId,
-  onClose,
-  onStatusChange,
-  onLaunch,
-}: TaskCardContextMenuProps) {
-  const { t } = useI18n();
-  const router = useRouter();
-  const menuRef = useRef<HTMLDivElement>(null);
-
-  useEffect(() => {
-    const handleMouseDown = (e: MouseEvent) => {
-      if (menuRef.current && !menuRef.current.contains(e.target as Node)) {
-        onClose();
-      }
-    };
-    const handleKeyDown = (e: KeyboardEvent) => {
-      if (e.key === "Escape") {
-        onClose();
-      }
-    };
-    document.addEventListener("mousedown", handleMouseDown);
-    document.addEventListener("keydown", handleKeyDown);
-    return () => {
-      document.removeEventListener("mousedown", handleMouseDown);
-      document.removeEventListener("keydown", handleKeyDown);
-    };
-  }, [onClose]);
-
-  const itemClass =
-    "flex items-center px-3 py-1.5 text-xs cursor-pointer hover:bg-accent rounded-sm w-full text-left";
-
-  const menu = (
-    <div
-      ref={menuRef}
-      style={{ position: "fixed", top: y, left: x, zIndex: 9999 }}
-      className="bg-popover border border-border rounded-md shadow-md py-1 min-w-[180px]"
-    >
-      <div className="px-3 py-1 text-[10px] text-muted-foreground uppercase tracking-wider">
-        {t("board.contextMenu.changeStatus")}
-      </div>
-      {BOARD_COLUMNS.map((col) => (
-        <button
-          key={col.id}
-          type="button"
-          className={itemClass}
-          onClick={() => {
-            onStatusChange(taskId, col.id);
-            onClose();
-          }}
-        >
-          {currentStatus === col.id ? (
-            <Check className="h-3 w-3 mr-2 flex-shrink-0" />
-          ) : (
-            <span className="w-5 flex-shrink-0" />
-          )}
-          {col.label}
-        </button>
-      ))}
-      <hr className="my-1 border-border" />
-      <button
-        type="button"
-        className={`${itemClass} ${hasExecutions ? "opacity-50 cursor-not-allowed" : ""}`}
-        disabled={hasExecutions}
-        onClick={() => {
-          if (!hasExecutions) {
-            onLaunch(taskId);
-            onClose();
-          }
-        }}
-      >
-        {t("board.contextMenu.launch")}
-      </button>
-      {currentStatus !== "DONE" && currentStatus !== "CANCELLED" && (
-        <>
-          <hr className="my-1 border-border" />
-          <button
-            type="button"
-            className={itemClass}
-            onClick={() => {
-              router.push(`/workspaces/${workspaceId}/tasks/${taskId}`);
-              onClose();
-            }}
-          >
-            {t("board.contextMenu.goToDetail")}
-          </button>
-        </>
-      )}
-    </div>
-  );
-
-  if (typeof document === "undefined") return null;
-  return createPortal(menu, document.body);
-}

package/.next/standalone/tower/src/components/board/task-card.tsx

@@ -1,135 +0,0 @@
-"use client";
-
-import { useSortable } from "@dnd-kit/sortable";
-import { CSS } from "@dnd-kit/utilities";
-import { MoreHorizontal, Pencil, Trash2, Pin } from "lucide-react";
-import { Badge } from "@/components/ui/badge";
-import { Button } from "@/components/ui/button";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
-import { PRIORITY_CONFIG } from "@/lib/constants";
-import { useI18n } from "@/lib/i18n";
-import type { TaskWithLabels } from "@/types";
-
-interface TaskCardProps {
-  task: TaskWithLabels;
-  onClick?: () => void;
-  onEdit?: (task: TaskWithLabels) => void;
-  onDelete?: (taskId: string) => void;
-  onTogglePin?: (taskId: string) => void;
-  onContextMenu?: (task: TaskWithLabels, x: number, y: number) => void;
-}
-
-export function TaskCard({ task, onClick, onEdit, onDelete, onTogglePin, onContextMenu }: TaskCardProps) {
-  const { t } = useI18n();
-  const {
-    attributes,
-    listeners,
-    setNodeRef,
-    transform,
-    transition,
-    isDragging,
-  } = useSortable({ id: task.id, data: { type: "task", task } });
-
-  const style = {
-    transform: CSS.Transform.toString(transform),
-    transition,
-    opacity: isDragging ? 0.4 : 1,
-  };
-
-  const priorityConfig = PRIORITY_CONFIG[task.priority];
-
-  return (
-    <div
-      ref={setNodeRef}
-      style={style}
-      {...attributes}
-      {...listeners}
-      className="group cursor-grab rounded-lg border border-border bg-card p-3 transition-all hover:border-primary/20 hover:bg-accent/50 active:cursor-grabbing"
-      onClick={onClick}
-      onContextMenu={(e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        onContextMenu?.(task, e.clientX, e.clientY);
-      }}
-      data-testid="task-card"
-    >
-      <div className="flex items-start justify-between">
-        <h4 className="text-sm font-medium text-foreground">{task.title}</h4>
-        <div className="flex items-center gap-0.5 shrink-0">
-          <Button
-            variant="ghost"
-            size="icon-xs"
-            className={`transition-all ${
-              task.pinned
-                ? "text-primary opacity-100"
-                : "text-muted-foreground opacity-0 group-hover:opacity-100"
-            }`}
-            onClick={(e) => { e.stopPropagation(); onTogglePin?.(task.id); }}
-            aria-label={task.pinned ? t("board.unpin") : t("board.pin")}
-          >
-            <Pin className={`h-3.5 w-3.5 ${task.pinned ? "-rotate-45" : ""}`} />
-          </Button>
-        <DropdownMenu>
-          <DropdownMenuTrigger
-            render={
-              <button
-                className="rounded-md p-0.5 text-muted-foreground opacity-0 transition-all hover:bg-background hover:text-foreground group-hover:opacity-100"
-                onClick={(e) => e.stopPropagation()}
-              />
-            }
-          >
-            <MoreHorizontal className="h-4 w-4" />
-          </DropdownMenuTrigger>
-          <DropdownMenuContent align="end">
-            <DropdownMenuItem onClick={(e) => { e.stopPropagation(); onEdit?.(task); }}>
-              <Pencil className="mr-2 h-3.5 w-3.5" />
-              {t("common.edit")}
-            </DropdownMenuItem>
-            <DropdownMenuItem
-              className="text-rose-400"
-              onClick={(e) => { e.stopPropagation(); onDelete?.(task.id); }}
-            >
-              <Trash2 className="mr-2 h-3.5 w-3.5" />
-              {t("common.delete")}
-            </DropdownMenuItem>
-          </DropdownMenuContent>
-        </DropdownMenu>
-        </div>
-      </div>
-
-      {task.description && (
-        <p className="mt-1.5 line-clamp-3 text-xs leading-relaxed text-muted-foreground">
-          {task.description}
-        </p>
-      )}
-
-      <div className="mt-2.5">
-        <Badge variant="secondary" className={`text-[10px] font-semibold ${priorityConfig.color}`}>
-          {priorityConfig.label}
-        </Badge>
-      </div>
-
-      {task.labels && task.labels.length > 0 && (
-        <div className="mt-1.5 flex flex-wrap gap-1">
-          {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>
-  );
-}