@sureshdsk/devflow-mcp 3.0.0 → 3.0.1

package/.next/standalone/src/components/ui/button.tsx

@@ -1,56 +1,51 @@
-import * as React from "react";
-import { Slot } from "@radix-ui/react-slot";
-import { cva, type VariantProps } from "class-variance-authority";
-import { cn } from "@/lib/utils";
+import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
+import { cva, type VariantProps } from 'class-variance-authority';
+import { cn } from '@/lib/utils';
 
 const buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap text-sm font-bold uppercase tracking-wide border-3 border-black transition-all focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 active:translate-x-1 active:translate-y-1 active:shadow-none",
+  'inline-flex items-center justify-center gap-2 whitespace-nowrap text-sm font-bold uppercase tracking-wide border-3 border-black transition-all focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 active:translate-x-1 active:translate-y-1 active:shadow-none',
   {
     variants: {
       variant: {
         default:
-          "bg-[--color-primary] text-black neubrutalism-shadow hover:translate-x-0.5 hover:translate-y-0.5",
+          'bg-[--color-primary] text-black neubrutalism-shadow hover:translate-x-0.5 hover:translate-y-0.5',
         destructive:
-          "bg-[--color-accent] text-black neubrutalism-shadow hover:translate-x-0.5 hover:translate-y-0.5",
+          'bg-[--color-accent] text-black neubrutalism-shadow hover:translate-x-0.5 hover:translate-y-0.5',
         outline:
-          "border-3 border-black bg-white neubrutalism-shadow hover:translate-x-0.5 hover:translate-y-0.5",
+          'border-3 border-black bg-white neubrutalism-shadow hover:translate-x-0.5 hover:translate-y-0.5',
         secondary:
-          "bg-[--color-secondary] text-black neubrutalism-shadow hover:translate-x-0.5 hover:translate-y-0.5",
-        ghost: "border-0 shadow-none hover:bg-gray-200",
-        link: "border-0 shadow-none text-black underline-offset-4 hover:underline",
+          'bg-[--color-secondary] text-black neubrutalism-shadow hover:translate-x-0.5 hover:translate-y-0.5',
+        ghost: 'border-0 shadow-none hover:bg-gray-200',
+        link: 'border-0 shadow-none text-black underline-offset-4 hover:underline',
       },
       size: {
-        default: "h-10 px-6 py-2",
-        sm: "h-8 px-4 text-xs",
-        lg: "h-12 px-8 text-base",
-        icon: "h-10 w-10",
+        default: 'h-10 px-6 py-2',
+        sm: 'h-8 px-4 text-xs',
+        lg: 'h-12 px-8 text-base',
+        icon: 'h-10 w-10',
       },
     },
     defaultVariants: {
-      variant: "default",
-      size: "default",
+      variant: 'default',
+      size: 'default',
     },
-  }
+  },
 );
 
 export interface ButtonProps
-  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
-    VariantProps<typeof buttonVariants> {
+  extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
   asChild?: boolean;
 }
 
 const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
-    const Comp = asChild ? Slot : "button";
+    const Comp = asChild ? Slot : 'button';
     return (
-      <Comp
-        className={cn(buttonVariants({ variant, size, className }))}
-        ref={ref}
-        {...props}
-      />
+      <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />
     );
-  }
+  },
 );
-Button.displayName = "Button";
+Button.displayName = 'Button';
 
 export { Button, buttonVariants };

package/.next/standalone/src/components/ui/card.tsx

@@ -1,75 +1,55 @@
-import * as React from "react";
-import { cn } from "@/lib/utils";
+import * as React from 'react';
+import { cn } from '@/lib/utils';
 
-const Card = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn(
-      "border-3 border-black bg-white neubrutalism-shadow",
-      className
-    )}
-    {...props}
-  />
-));
-Card.displayName = "Card";
+const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div
+      ref={ref}
+      className={cn('border-3 border-black bg-white neubrutalism-shadow', className)}
+      {...props}
+    />
+  ),
+);
+Card.displayName = 'Card';
 
-const CardHeader = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn("flex flex-col space-y-1.5 p-6", className)}
-    {...props}
-  />
-));
-CardHeader.displayName = "CardHeader";
+const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn('flex flex-col space-y-1.5 p-6', className)} {...props} />
+  ),
+);
+CardHeader.displayName = 'CardHeader';
 
-const CardTitle = React.forwardRef<
-  HTMLParagraphElement,
-  React.HTMLAttributes<HTMLHeadingElement>
->(({ className, ...props }, ref) => (
-  <h3
-    ref={ref}
-    className={cn("font-bold uppercase tracking-wide leading-none", className)}
-    {...props}
-  />
-));
-CardTitle.displayName = "CardTitle";
+const CardTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
+  ({ className, ...props }, ref) => (
+    <h3
+      ref={ref}
+      className={cn('font-bold uppercase tracking-wide leading-none', className)}
+      {...props}
+    />
+  ),
+);
+CardTitle.displayName = 'CardTitle';
 
 const CardDescription = React.forwardRef<
   HTMLParagraphElement,
   React.HTMLAttributes<HTMLParagraphElement>
 >(({ className, ...props }, ref) => (
-  <p
-    ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
-    {...props}
-  />
+  <p ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />
 ));
-CardDescription.displayName = "CardDescription";
+CardDescription.displayName = 'CardDescription';
 
-const CardContent = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
-));
-CardContent.displayName = "CardContent";
+const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn('p-6 pt-0', className)} {...props} />
+  ),
+);
+CardContent.displayName = 'CardContent';
 
-const CardFooter = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn("flex items-center p-6 pt-0", className)}
-    {...props}
-  />
-));
-CardFooter.displayName = "CardFooter";
+const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn('flex items-center p-6 pt-0', className)} {...props} />
+  ),
+);
+CardFooter.displayName = 'CardFooter';
 
 export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };

package/.next/standalone/src/components/ui/dialog.tsx

@@ -1,9 +1,9 @@
-"use client";
+'use client';
 
-import * as React from "react";
-import * as DialogPrimitive from "@radix-ui/react-dialog";
-import { X } from "lucide-react";
-import { cn } from "@/lib/utils";
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { X } from 'lucide-react';
+import { cn } from '@/lib/utils';
 
 const Dialog = DialogPrimitive.Root;
 const DialogTrigger = DialogPrimitive.Trigger;
@@ -17,8 +17,8 @@ const DialogOverlay = React.forwardRef<
   <DialogPrimitive.Overlay
     ref={ref}
     className={cn(
-      "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className
+      'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
+      className,
     )}
     {...props}
   />
@@ -34,8 +34,8 @@ const DialogContent = React.forwardRef<
     <DialogPrimitive.Content
       ref={ref}
       className={cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border-4 border-black bg-white p-6 neubrutalism-shadow-xl duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
-        className
+        'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border-4 border-black bg-white p-6 neubrutalism-shadow-xl duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]',
+        className,
       )}
       {...props}
     >
@@ -49,33 +49,18 @@ const DialogContent = React.forwardRef<
 ));
 DialogContent.displayName = DialogPrimitive.Content.displayName;
 
-const DialogHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn(
-      "flex flex-col space-y-1.5 text-center sm:text-left",
-      className
-    )}
-    {...props}
-  />
+const DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
+  <div className={cn('flex flex-col space-y-1.5 text-center sm:text-left', className)} {...props} />
 );
-DialogHeader.displayName = "DialogHeader";
+DialogHeader.displayName = 'DialogHeader';
 
-const DialogFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+const DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
-    className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
-    )}
+    className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}
     {...props}
   />
 );
-DialogFooter.displayName = "DialogFooter";
+DialogFooter.displayName = 'DialogFooter';
 
 const DialogTitle = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Title>,
@@ -83,10 +68,7 @@ const DialogTitle = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <DialogPrimitive.Title
     ref={ref}
-    className={cn(
-      "text-2xl font-bold uppercase tracking-wide leading-none",
-      className
-    )}
+    className={cn('text-2xl font-bold uppercase tracking-wide leading-none', className)}
     {...props}
   />
 ));
@@ -98,7 +80,7 @@ const DialogDescription = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <DialogPrimitive.Description
     ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
+    className={cn('text-sm text-muted-foreground', className)}
     {...props}
   />
 ));

package/.next/standalone/src/db/index.ts

@@ -1,12 +1,12 @@
-import { createClient } from "@libsql/client";
-import { drizzle } from "drizzle-orm/libsql";
-import * as schema from "./schema";
-import { mkdirSync } from "fs";
-import { join } from "path";
-import { homedir } from "os";
+import { createClient } from '@libsql/client';
+import { drizzle } from 'drizzle-orm/libsql';
+import * as schema from './schema';
+import { mkdirSync } from 'fs';
+import { join } from 'path';
+import { homedir } from 'os';
 
-const DB_DIR = join(homedir(), ".devflow");
-const DB_PATH = join(DB_DIR, "devflow.db");
+const DB_DIR = join(homedir(), '.devflow');
+const DB_PATH = join(DB_DIR, 'devflow.db');
 
 // Ensure the directory exists
 function ensureDbDir() {
@@ -28,8 +28,8 @@ export async function getDb() {
     url: `file:${DB_PATH}`,
   });
 
-  await client.execute("PRAGMA journal_mode = WAL");
-  await client.execute("PRAGMA foreign_keys = ON");
+  await client.execute('PRAGMA journal_mode = WAL');
+  await client.execute('PRAGMA foreign_keys = ON');
 
   dbInstance = drizzle(client, { schema });
 

package/.next/standalone/src/db/schema.ts

@@ -1,61 +1,61 @@
-import { sqliteTable, text, integer } from "drizzle-orm/sqlite-core";
-import { sql } from "drizzle-orm";
+import { sqliteTable, text, integer } from 'drizzle-orm/sqlite-core';
+import { sql } from 'drizzle-orm';
 
 // Projects - Top level organization
-export const projects = sqliteTable("projects", {
-  id: text("id").primaryKey(),
-  name: text("name").notNull(),
-  description: text("description"),
-  status: text("status").notNull().default("active"), // active, archived, completed
-  createdAt: integer("created_at", { mode: "timestamp" })
+export const projects = sqliteTable('projects', {
+  id: text('id').primaryKey(),
+  name: text('name').notNull(),
+  description: text('description'),
+  status: text('status').notNull().default('active'), // active, archived, completed
+  createdAt: integer('created_at', { mode: 'timestamp' })
     .notNull()
     .default(sql`(unixepoch())`),
-  updatedAt: integer("updated_at", { mode: "timestamp" })
+  updatedAt: integer('updated_at', { mode: 'timestamp' })
     .notNull()
     .default(sql`(unixepoch())`),
 });
 
 // Tasks - Individual work items
-export const tasks = sqliteTable("tasks", {
-  id: text("id").primaryKey(),
-  projectId: text("project_id").references(() => projects.id, { onDelete: "cascade" }),
-  specName: text("spec_name"), // string ref to spec folder name, no FK
-  title: text("title").notNull(),
-  body: text("body"),
-  status: text("status").notNull().default("backlog"), // backlog, todo, in_progress, interrupted, done
-  priority: text("priority").notNull().default("medium"), // low, medium, high, urgent
-  assignedAgent: text("assigned_agent"),
-  order: integer("order").notNull().default(0),
-  createdAt: integer("created_at", { mode: "timestamp" })
+export const tasks = sqliteTable('tasks', {
+  id: text('id').primaryKey(),
+  projectId: text('project_id').references(() => projects.id, { onDelete: 'cascade' }),
+  specName: text('spec_name'), // string ref to spec folder name, no FK
+  title: text('title').notNull(),
+  body: text('body'),
+  status: text('status').notNull().default('backlog'), // backlog, todo, in_progress, interrupted, done
+  priority: text('priority').notNull().default('medium'), // low, medium, high, urgent
+  assignedAgent: text('assigned_agent'),
+  order: integer('order').notNull().default(0),
+  createdAt: integer('created_at', { mode: 'timestamp' })
     .notNull()
     .default(sql`(unixepoch())`),
-  updatedAt: integer("updated_at", { mode: "timestamp" })
+  updatedAt: integer('updated_at', { mode: 'timestamp' })
     .notNull()
     .default(sql`(unixepoch())`),
 });
 
-export const agentActivity = sqliteTable("agent_activity", {
-  id: text("id").primaryKey(),
-  taskId: text("task_id").references(() => tasks.id, { onDelete: "cascade" }),
-  agentName: text("agent_name").notNull(),
-  action: text("action").notNull(), // check_in, check_out, update, comment
-  details: text("details"),
-  timestamp: integer("timestamp", { mode: "timestamp" })
+export const agentActivity = sqliteTable('agent_activity', {
+  id: text('id').primaryKey(),
+  taskId: text('task_id').references(() => tasks.id, { onDelete: 'cascade' }),
+  agentName: text('agent_name').notNull(),
+  action: text('action').notNull(), // check_in, check_out, update, comment
+  details: text('details'),
+  timestamp: integer('timestamp', { mode: 'timestamp' })
     .notNull()
     .default(sql`(unixepoch())`),
 });
 
 // Specs - Planning artifacts per project
-export const specs = sqliteTable("specs", {
-  name: text("name").primaryKey(), // matches folder name, e.g. "add-oauth"
-  projectId: text("project_id")
+export const specs = sqliteTable('specs', {
+  name: text('name').primaryKey(), // matches folder name, e.g. "add-oauth"
+  projectId: text('project_id')
     .notNull()
-    .references(() => projects.id, { onDelete: "cascade" }),
-  title: text("title").notNull(),
-  description: text("description"),
-  schema: text("schema").notNull().default("spec-driven"),
-  status: text("status").notNull().default("active"), // active | archived
-  createdAt: integer("created_at", { mode: "timestamp" })
+    .references(() => projects.id, { onDelete: 'cascade' }),
+  title: text('title').notNull(),
+  description: text('description'),
+  schema: text('schema').notNull().default('spec-driven'),
+  status: text('status').notNull().default('active'), // active | archived
+  createdAt: integer('created_at', { mode: 'timestamp' })
     .notNull()
     .default(sql`(unixepoch())`),
 });

package/.next/standalone/src/hooks/use-queries.ts

@@ -0,0 +1,81 @@
+'use client';
+
+import { useQuery, useQueryClient } from '@tanstack/react-query';
+import { Task, Project } from '@/db/schema';
+
+async function fetchJson<T>(url: string): Promise<T> {
+  const res = await fetch(url);
+  if (!res.ok) throw new Error(`Failed to fetch ${url}`);
+  return res.json();
+}
+
+export function useProjects() {
+  return useQuery<Project[]>({
+    queryKey: ['projects'],
+    queryFn: () => fetchJson('/api/projects'),
+    refetchInterval: 5000,
+  });
+}
+
+export function useTasks() {
+  return useQuery<Task[]>({
+    queryKey: ['tasks'],
+    queryFn: () => fetchJson('/api/tasks'),
+    refetchInterval: 5000,
+  });
+}
+
+export function useSpec(name: string) {
+  return useQuery({
+    queryKey: ['spec', name],
+    queryFn: () => fetchJson<Record<string, unknown>>(`/api/specs/${name}`),
+    refetchInterval: 3000,
+    enabled: !!name,
+  });
+}
+
+export function useSpecs() {
+  return useQuery({
+    queryKey: ['specs'],
+    queryFn: async () => {
+      const specs =
+        await fetchJson<Array<{ name: string; title: string; createdAt: string }>>('/api/specs');
+      // Fetch statuses for each spec in parallel
+      const withStatuses = await Promise.all(
+        specs.map(async (spec) => {
+          try {
+            const detail = await fetchJson<Record<string, unknown>>(`/api/specs/${spec.name}`);
+            return { ...spec, statuses: detail.statuses };
+          } catch {
+            return spec;
+          }
+        }),
+      );
+      return withStatuses;
+    },
+    refetchInterval: 5000,
+  });
+}
+
+export function useArtifact(specName: string, artifactType: string) {
+  return useQuery({
+    queryKey: ['artifact', specName, artifactType],
+    queryFn: () =>
+      fetchJson<{ content: string | null }>(`/api/specs/${specName}/artifacts/${artifactType}`),
+    refetchInterval: 3000,
+    enabled: !!specName && !!artifactType,
+  });
+}
+
+export function useInvalidate() {
+  const queryClient = useQueryClient();
+  return {
+    invalidateTasks: () => queryClient.invalidateQueries({ queryKey: ['tasks'] }),
+    invalidateProjects: () => queryClient.invalidateQueries({ queryKey: ['projects'] }),
+    invalidateSpec: (name: string) => queryClient.invalidateQueries({ queryKey: ['spec', name] }),
+    invalidateSpecs: () => queryClient.invalidateQueries({ queryKey: ['specs'] }),
+    invalidateArtifact: (specName: string, artifactType: string) =>
+      queryClient.invalidateQueries({ queryKey: ['artifact', specName, artifactType] }),
+    invalidateAll: () => queryClient.invalidateQueries(),
+  };
+}

package/.next/standalone/src/hooks/use-websocket.ts

@@ -0,0 +1,74 @@
+'use client';
+
+import { useEffect, useRef } from 'react';
+import { useQueryClient } from '@tanstack/react-query';
+
+export function useWebSocket() {
+  const queryClient = useQueryClient();
+  const wsRef = useRef<WebSocket | null>(null);
+
+  useEffect(() => {
+    let isUnmounted = false;
+    let reconnectTimeout: ReturnType<typeof setTimeout>;
+
+    function connect() {
+      if (isUnmounted) return;
+
+      try {
+        const ws = new WebSocket(
+          `ws://localhost:${process.env.NEXT_PUBLIC_DEVFLOW_WS_PORT || '3001'}`,
+        );
+        wsRef.current = ws;
+
+        ws.onmessage = (event) => {
+          const data = JSON.parse(event.data);
+          if (data.type === 'agent_count') return;
+
+          // Invalidate relevant queries based on event type
+          if (data.type?.includes('project')) {
+            queryClient.invalidateQueries({ queryKey: ['projects'] });
+          }
+
+          if (data.type?.includes('task') || data.type?.includes('promote')) {
+            queryClient.invalidateQueries({ queryKey: ['tasks'] });
+          }
+
+          if (data.type?.includes('spec') || data.type?.includes('artifact')) {
+            queryClient.invalidateQueries({ queryKey: ['specs'] });
+            if (data.specName) {
+              queryClient.invalidateQueries({ queryKey: ['spec', data.specName] });
+              if (data.artifactType) {
+                queryClient.invalidateQueries({
+                  queryKey: ['artifact', data.specName, data.artifactType],
+                });
+              }
+            }
+          }
+
+          // For any task event, also refresh tasks
+          queryClient.invalidateQueries({ queryKey: ['tasks'] });
+        };
+
+        ws.onerror = () => {};
+
+        ws.onclose = () => {
+          if (!isUnmounted) {
+            reconnectTimeout = setTimeout(connect, 3000);
+          }
+        };
+      } catch {
+        if (!isUnmounted) {
+          reconnectTimeout = setTimeout(connect, 3000);
+        }
+      }
+    }
+
+    connect();
+
+    return () => {
+      isUnmounted = true;
+      clearTimeout(reconnectTimeout);
+      wsRef.current?.close();
+    };
+  }, [queryClient]);
+}