@atercates/claude-deck 0.2.1

package/data/projects/queries.ts

@@ -0,0 +1,193 @@
+import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
+import type {
+  ProjectWithRepositories,
+  DetectedDevServer,
+} from "@/lib/projects";
+import { projectKeys } from "./keys";
+import { sessionKeys } from "../sessions/keys";
+
+async function fetchProjects(): Promise<ProjectWithRepositories[]> {
+  const res = await fetch("/api/projects");
+  if (!res.ok) throw new Error("Failed to fetch projects");
+  const data = await res.json();
+  return data.projects || [];
+}
+
+export function useProjectsQuery() {
+  return useQuery({
+    queryKey: projectKeys.list(),
+    queryFn: fetchProjects,
+    staleTime: 30000,
+  });
+}
+
+export function useToggleProject() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({
+      projectId,
+      expanded,
+    }: {
+      projectId: string;
+      expanded: boolean;
+    }) => {
+      const res = await fetch(`/api/projects/${projectId}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ expanded }),
+      });
+      if (!res.ok) throw new Error("Failed to toggle project");
+      return res.json();
+    },
+    onMutate: async ({ projectId, expanded }) => {
+      await queryClient.cancelQueries({ queryKey: projectKeys.list() });
+      const previous = queryClient.getQueryData<ProjectWithRepositories[]>(
+        projectKeys.list()
+      );
+      queryClient.setQueryData<ProjectWithRepositories[]>(
+        projectKeys.list(),
+        (old) => old?.map((p) => (p.id === projectId ? { ...p, expanded } : p))
+      );
+      return { previous };
+    },
+    onError: (_, __, context) => {
+      if (context?.previous) {
+        queryClient.setQueryData(projectKeys.list(), context.previous);
+      }
+    },
+  });
+}
+
+export function useDeleteProject() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (projectId: string) => {
+      const res = await fetch(`/api/projects/${projectId}`, {
+        method: "DELETE",
+      });
+      if (!res.ok) throw new Error("Failed to delete project");
+      return res.json();
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: projectKeys.list() });
+      queryClient.invalidateQueries({ queryKey: sessionKeys.list() });
+    },
+  });
+}
+
+export function useRenameProject() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({
+      projectId,
+      newName,
+    }: {
+      projectId: string;
+      newName: string;
+    }) => {
+      const res = await fetch(`/api/projects/${projectId}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ name: newName }),
+      });
+      if (!res.ok) throw new Error("Failed to rename project");
+      return res.json();
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: projectKeys.list() });
+    },
+  });
+}
+
+export function useUpdateProject() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({
+      projectId,
+      name,
+      workingDirectory,
+      agentType,
+      defaultModel,
+      initialPrompt,
+    }: {
+      projectId: string;
+      name?: string;
+      workingDirectory?: string;
+      agentType?: string;
+      defaultModel?: string;
+      initialPrompt?: string | null;
+    }) => {
+      const res = await fetch(`/api/projects/${projectId}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          name,
+          workingDirectory,
+          agentType,
+          defaultModel,
+          initialPrompt,
+        }),
+      });
+      if (!res.ok) throw new Error("Failed to update project");
+      return res.json();
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: projectKeys.list() });
+    },
+  });
+}
+
+export function useCreateProject() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (data: {
+      name: string;
+      workingDirectory: string;
+      agentType?: string;
+      defaultModel?: string;
+      devServers?: Array<{
+        name: string;
+        type: string;
+        command: string;
+        port?: number;
+        portEnvVar?: string;
+      }>;
+    }) => {
+      const res = await fetch("/api/projects", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(data),
+      });
+      if (!res.ok) {
+        const err = await res.json();
+        throw new Error(err.error || "Failed to create project");
+      }
+      return res.json();
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: projectKeys.list() });
+    },
+  });
+}
+
+export function useDetectDevServers() {
+  return useMutation({
+    mutationFn: async (
+      workingDirectory: string
+    ): Promise<DetectedDevServer[]> => {
+      const res = await fetch("/api/projects/detect", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ workingDirectory }),
+      });
+      if (!res.ok) throw new Error("Failed to detect dev servers");
+      const data = await res.json();
+      return data.detected || [];
+    },
+  });
+}

package/data/repositories/index.ts

@@ -0,0 +1,7 @@
+export { repositoryKeys } from "./keys";
+export {
+  useProjectRepositories,
+  useAddRepository,
+  useUpdateRepository,
+  useDeleteRepository,
+} from "./queries";

package/data/repositories/keys.ts

@@ -0,0 +1,5 @@
+export const repositoryKeys = {
+  all: ["repositories"] as const,
+  list: (projectId: string) =>
+    [...repositoryKeys.all, "list", projectId] as const,
+};

package/data/repositories/queries.ts

@@ -0,0 +1,122 @@
+import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
+import type { ProjectRepository } from "@/lib/db";
+import { repositoryKeys } from "./keys";
+import { projectKeys } from "@/data/projects/keys";
+
+async function fetchProjectRepositories(
+  projectId: string
+): Promise<ProjectRepository[]> {
+  const res = await fetch(`/api/projects/${projectId}/repositories`);
+  if (!res.ok) throw new Error("Failed to fetch repositories");
+  const data = await res.json();
+  return data.repositories || [];
+}
+
+export function useProjectRepositories(projectId: string | undefined) {
+  return useQuery({
+    queryKey: repositoryKeys.list(projectId || ""),
+    queryFn: () => fetchProjectRepositories(projectId!),
+    enabled: !!projectId,
+    staleTime: 30000,
+  });
+}
+
+interface AddRepositoryOptions {
+  projectId: string;
+  name: string;
+  path: string;
+  isPrimary?: boolean;
+}
+
+export function useAddRepository() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (opts: AddRepositoryOptions) => {
+      const res = await fetch(`/api/projects/${opts.projectId}/repositories`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          name: opts.name,
+          path: opts.path,
+          isPrimary: opts.isPrimary,
+        }),
+      });
+      if (!res.ok) throw new Error("Failed to add repository");
+      return res.json();
+    },
+    onSuccess: (_, variables) => {
+      queryClient.invalidateQueries({
+        queryKey: repositoryKeys.list(variables.projectId),
+      });
+      queryClient.invalidateQueries({ queryKey: projectKeys.list() });
+    },
+  });
+}
+
+interface UpdateRepositoryOptions {
+  projectId: string;
+  repoId: string;
+  name?: string;
+  path?: string;
+  isPrimary?: boolean;
+  sortOrder?: number;
+}
+
+export function useUpdateRepository() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (opts: UpdateRepositoryOptions) => {
+      const res = await fetch(
+        `/api/projects/${opts.projectId}/repositories/${opts.repoId}`,
+        {
+          method: "PATCH",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            name: opts.name,
+            path: opts.path,
+            isPrimary: opts.isPrimary,
+            sortOrder: opts.sortOrder,
+          }),
+        }
+      );
+      if (!res.ok) throw new Error("Failed to update repository");
+      return res.json();
+    },
+    onSuccess: (_, variables) => {
+      queryClient.invalidateQueries({
+        queryKey: repositoryKeys.list(variables.projectId),
+      });
+      queryClient.invalidateQueries({ queryKey: projectKeys.list() });
+    },
+  });
+}
+
+interface DeleteRepositoryOptions {
+  projectId: string;
+  repoId: string;
+}
+
+export function useDeleteRepository() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (opts: DeleteRepositoryOptions) => {
+      const res = await fetch(
+        `/api/projects/${opts.projectId}/repositories/${opts.repoId}`,
+        {
+          method: "DELETE",
+        }
+      );
+      if (!res.ok) throw new Error("Failed to delete repository");
+      return res.json();
+    },
+    onSuccess: (_, variables) => {
+      queryClient.invalidateQueries({
+        queryKey: repositoryKeys.list(variables.projectId),
+      });
+      queryClient.invalidateQueries({ queryKey: projectKeys.list() });
+    },
+  });
+}

package/data/sessions/index.ts

@@ -0,0 +1,12 @@
+export { sessionKeys, statusKeys } from "./keys";
+export {
+  useSessionsQuery,
+  useCreateSession,
+  useDeleteSession,
+  useRenameSession,
+  useForkSession,
+  useSummarizeSession,
+  useMoveSessionToGroup,
+  useMoveSessionToProject,
+} from "./queries";
+export type { CreateSessionInput } from "./queries";

package/data/sessions/keys.ts

@@ -0,0 +1,8 @@
+export const sessionKeys = {
+  all: ["sessions"] as const,
+  list: () => [...sessionKeys.all, "list"] as const,
+};
+
+export const statusKeys = {
+  all: ["session-statuses"] as const,
+};

package/data/sessions/queries.ts

@@ -0,0 +1,218 @@
+import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
+import type { Session, Group } from "@/lib/db";
+import type { AgentType } from "@/lib/providers";
+import { sessionKeys } from "./keys";
+
+interface SessionsResponse {
+  sessions: Session[];
+  groups: Group[];
+}
+
+async function fetchSessions(): Promise<SessionsResponse> {
+  const res = await fetch("/api/sessions");
+  if (!res.ok) throw new Error("Failed to fetch sessions");
+  return res.json();
+}
+
+export function useSessionsQuery() {
+  return useQuery({
+    queryKey: sessionKeys.list(),
+    queryFn: fetchSessions,
+    staleTime: 5000,
+    refetchInterval: 10000,
+  });
+}
+
+export function useDeleteSession() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (sessionId: string) => {
+      const res = await fetch(`/api/sessions/${sessionId}`, {
+        method: "DELETE",
+      });
+      if (!res.ok) throw new Error("Failed to delete session");
+      return res.json();
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: sessionKeys.list() });
+    },
+  });
+}
+
+export function useRenameSession() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({
+      sessionId,
+      newName,
+    }: {
+      sessionId: string;
+      newName: string;
+    }) => {
+      const res = await fetch(`/api/sessions/${sessionId}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ name: newName }),
+      });
+      if (!res.ok) throw new Error("Failed to rename session");
+      return res.json();
+    },
+    onMutate: async ({ sessionId, newName }) => {
+      await queryClient.cancelQueries({ queryKey: sessionKeys.list() });
+      const previous = queryClient.getQueryData<SessionsResponse>(
+        sessionKeys.list()
+      );
+      queryClient.setQueryData<SessionsResponse>(sessionKeys.list(), (old) =>
+        old
+          ? {
+              ...old,
+              sessions: old.sessions.map((s) =>
+                s.id === sessionId ? { ...s, name: newName } : s
+              ),
+            }
+          : old
+      );
+      return { previous };
+    },
+    onError: (_, __, context) => {
+      if (context?.previous) {
+        queryClient.setQueryData(sessionKeys.list(), context.previous);
+      }
+    },
+    onSettled: () => {
+      queryClient.invalidateQueries({ queryKey: sessionKeys.list() });
+    },
+  });
+}
+
+export function useForkSession() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (sessionId: string): Promise<Session | null> => {
+      const res = await fetch(`/api/sessions/${sessionId}/fork`, {
+        method: "POST",
+      });
+      const data = await res.json();
+      return data.session || null;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: sessionKeys.list() });
+    },
+  });
+}
+
+export function useSummarizeSession() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (sessionId: string): Promise<Session | null> => {
+      const res = await fetch(`/api/sessions/${sessionId}/summarize`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ createFork: true }),
+      });
+      const data = await res.json();
+      if (data.error) throw new Error(data.error);
+      return data.newSession || null;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: sessionKeys.list() });
+    },
+  });
+}
+
+export function useMoveSessionToGroup() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({
+      sessionId,
+      groupPath,
+    }: {
+      sessionId: string;
+      groupPath: string;
+    }) => {
+      const res = await fetch(`/api/sessions/${sessionId}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ groupPath }),
+      });
+      if (!res.ok) throw new Error("Failed to move session");
+      return res.json();
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: sessionKeys.list() });
+    },
+  });
+}
+
+export function useMoveSessionToProject() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({
+      sessionId,
+      projectId,
+    }: {
+      sessionId: string;
+      projectId: string;
+    }) => {
+      const res = await fetch(`/api/sessions/${sessionId}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ projectId }),
+      });
+      if (!res.ok) throw new Error("Failed to move session");
+      return res.json();
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: sessionKeys.list() });
+    },
+  });
+}
+
+export interface CreateSessionInput {
+  name?: string;
+  workingDirectory: string;
+  projectId: string | null;
+  agentType: AgentType;
+  useWorktree: boolean;
+  featureName: string | null;
+  baseBranch: string | null;
+  autoApprove: boolean;
+  useTmux: boolean;
+  initialPrompt: string | null;
+}
+
+interface CreateSessionResponse {
+  session: Session;
+  initialPrompt?: string;
+  error?: string;
+}
+
+export function useCreateSession() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (
+      input: CreateSessionInput
+    ): Promise<CreateSessionResponse> => {
+      const res = await fetch("/api/sessions", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(input),
+      });
+      const data = await res.json();
+      if (data.error) {
+        throw new Error(data.error);
+      }
+      return data;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: sessionKeys.list() });
+    },
+  });
+}

package/data/statuses/index.ts

@@ -0,0 +1 @@
+export { useSessionStatusesQuery } from "./queries";

package/data/statuses/queries.ts

@@ -0,0 +1,69 @@
+import { useQuery } from "@tanstack/react-query";
+import { useEffect } from "react";
+import type { Session } from "@/lib/db";
+import type { SessionStatus } from "@/components/views/types";
+import { statusKeys } from "../sessions/keys";
+
+interface StatusResponse {
+  statuses: Record<string, SessionStatus>;
+}
+
+async function fetchStatuses(): Promise<StatusResponse> {
+  const res = await fetch("/api/sessions/status");
+  if (!res.ok) throw new Error("Failed to fetch statuses");
+  return res.json();
+}
+
+interface UseSessionStatusesOptions {
+  sessions: Session[];
+  activeSessionId?: string | null;
+  checkStateChanges: (
+    states: Array<{
+      id: string;
+      name: string;
+      status: SessionStatus["status"];
+    }>,
+    activeSessionId?: string | null
+  ) => void;
+}
+
+export function useSessionStatusesQuery({
+  sessions,
+  activeSessionId,
+  checkStateChanges,
+}: UseSessionStatusesOptions) {
+  const query = useQuery({
+    queryKey: statusKeys.all,
+    queryFn: fetchStatuses,
+    staleTime: 2000,
+    refetchInterval: (query) => {
+      const statuses = query.state.data?.statuses;
+      if (!statuses) return 5000;
+
+      const hasActive = Object.values(statuses).some(
+        (s) => s.status === "running" || s.status === "waiting"
+      );
+
+      return hasActive ? 5000 : 30000;
+    },
+  });
+
+  useEffect(() => {
+    if (!query.data?.statuses) return;
+
+    const statuses = query.data.statuses;
+
+    const sessionStates = sessions.map((s) => ({
+      id: s.id,
+      name: s.name,
+      status: (statuses[s.id]?.status || "dead") as SessionStatus["status"],
+    }));
+    checkStateChanges(sessionStates, activeSessionId);
+    // Note: claude_session_id is now updated server-side in /api/sessions/status
+  }, [query.data, sessions, activeSessionId, checkStateChanges]);
+
+  return {
+    sessionStatuses: query.data?.statuses ?? {},
+    isLoading: query.isLoading,
+  };
+}

package/hooks/useCopyToClipboard.ts

@@ -0,0 +1,48 @@
+import { useState, useCallback } from "react";
+
+interface UseCopyToClipboardOptions {
+  /** Duration to show copied feedback (ms). Default: 1500 */
+  feedbackDuration?: number;
+}
+
+interface UseCopyToClipboardReturn {
+  /** Whether the copy was successful (shows feedback) */
+  copied: boolean;
+  /** Copy text to clipboard */
+  copy: (text: string) => Promise<boolean>;
+}
+
+/**
+ * Hook for copying text to clipboard with visual feedback.
+ *
+ * @example
+ * const { copied, copy } = useCopyToClipboard();
+ * <button onClick={() => copy(text)}>
+ *   {copied ? <Check /> : <Copy />}
+ * </button>
+ */
+export function useCopyToClipboard(
+  options: UseCopyToClipboardOptions = {}
+): UseCopyToClipboardReturn {
+  const { feedbackDuration = 1500 } = options;
+  const [copied, setCopied] = useState(false);
+
+  const copy = useCallback(
+    async (text: string): Promise<boolean> => {
+      if (!text) return false;
+
+      try {
+        await navigator.clipboard.writeText(text);
+        setCopied(true);
+        setTimeout(() => setCopied(false), feedbackDuration);
+        return true;
+      } catch {
+        // Clipboard API failed or unavailable
+        return false;
+      }
+    },
+    [feedbackDuration]
+  );
+
+  return { copied, copy };
+}