agent-canvas 0.2.0 → 0.6.0

package/daemon/client/ShareDialog.tsx

@@ -1,27 +1,16 @@
-import React, { useState, useEffect, useCallback } from "react";
-
-export interface ShareEntry {
-  shareId: string;
-  url: string;
-  revision: number;
-  createdAt: string;
-  ownerToken?: string;
-  expiresAt?: string;
-  lastFeedbackAt?: string;
-  /** Present iff the share is end-to-end encrypted; the URL itself
-   *  carries the key in the `#k=...` fragment. */
-  encryptionKey?: string;
-}
+import { useCallback, useEffect, useState } from 'react'
+import { shareCreatedResponseSchema, type ShareEntry, shareRevokedResponseSchema } from './apiSchemas'
+import { errorMessage } from './errorMessage'
 
 interface ShareDialogProps {
-  sessionId: string;
-  revision: number;
-  open: boolean;
-  shareEnabled: boolean;
-  existingShares: ShareEntry[];
-  onClose: () => void;
-  onShareCreated: (share: ShareEntry) => void;
-  onShareRevoked: (shareId: string) => void;
+	sessionId: string
+	revision: number
+	open: boolean
+	shareEnabled: boolean
+	existingShares: ShareEntry[]
+	onClose: () => void
+	onShareCreated: (share: ShareEntry) => void
+	onShareRevoked: (shareId: string) => void
 }
 
 /**
@@ -36,207 +25,217 @@ interface ShareDialogProps {
  * stored ownerToken.
  */
 export function ShareDialog({
-  sessionId,
-  revision,
-  open,
-  shareEnabled,
-  existingShares,
-  onClose,
-  onShareCreated,
-  onShareRevoked,
+	sessionId,
+	revision,
+	open,
+	shareEnabled,
+	existingShares,
+	onClose,
+	onShareCreated,
+	onShareRevoked,
 }: ShareDialogProps) {
-  const [loading, setLoading] = useState(false);
-  const [revoking, setRevoking] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-  const [copied, setCopied] = useState(false);
+	const [loading, setLoading] = useState(false)
+	const [revoking, setRevoking] = useState(false)
+	const [error, setError] = useState<string | null>(null)
+	const [copied, setCopied] = useState(false)
 
-  const shareForRev = existingShares.find((s) => s.revision === revision);
+	const shareForRev = existingShares.find((s) => s.revision === revision)
 
-  useEffect(() => {
-    if (!open) {
-      setLoading(false);
-      setRevoking(false);
-      setError(null);
-      setCopied(false);
-    }
-  }, [open]);
+	useEffect(() => {
+		if (!open) {
+			setLoading(false)
+			setRevoking(false)
+			setError(null)
+			setCopied(false)
+		}
+	}, [open])
 
-  const createShare = useCallback(async () => {
-    setLoading(true);
-    setError(null);
-    try {
-      const res = await fetch(`/api/session/${sessionId}/revision/${revision}/share`, {
-        method: "POST",
-      });
-      const data = await res.json() as any;
-      if (!res.ok || !data.ok) {
-        throw new Error(data.error || `HTTP ${res.status}`);
-      }
-      onShareCreated(data.share as ShareEntry);
-    } catch (e: any) {
-      setError(e.message || String(e));
-    } finally {
-      setLoading(false);
-    }
-  }, [sessionId, revision, onShareCreated]);
+	const createShare = useCallback(async () => {
+		setLoading(true)
+		setError(null)
+		try {
+			const res = await fetch(`/api/session/${sessionId}/revision/${revision}/share`, {
+				method: 'POST',
+			})
+			const data = shareCreatedResponseSchema.parse(await res.json())
+			if (!data.ok) throw new Error(data.error || `HTTP ${res.status}`)
+			if (!res.ok) throw new Error(`HTTP ${res.status}`)
+			onShareCreated(data.share)
+		} catch (e) {
+			setError(errorMessage(e))
+		} finally {
+			setLoading(false)
+		}
+	}, [sessionId, revision, onShareCreated])
 
-  const revoke = useCallback(async (shareId: string) => {
-    if (!window.confirm("Revoke this share link? Reviewers will no longer be able to view or comment.")) return;
-    setRevoking(true);
-    setError(null);
-    try {
-      const res = await fetch(`/api/session/${sessionId}/shares/${shareId}/revoke`, {
-        method: "POST",
-      });
-      const data = await res.json() as any;
-      if (!res.ok || !data.ok) {
-        throw new Error(data.error || `HTTP ${res.status}`);
-      }
-      onShareRevoked(shareId);
-    } catch (e: any) {
-      setError(e.message || String(e));
-    } finally {
-      setRevoking(false);
-    }
-  }, [sessionId, onShareRevoked]);
+	const revoke = useCallback(async (shareId: string) => {
+		if (!window.confirm('Revoke this share link? Reviewers will no longer be able to view or comment.')) return
+		setRevoking(true)
+		setError(null)
+		try {
+			const res = await fetch(`/api/session/${sessionId}/shares/${shareId}/revoke`, {
+				method: 'POST',
+			})
+			const data = shareRevokedResponseSchema.parse(await res.json())
+			if (!data.ok) throw new Error(data.error || `HTTP ${res.status}`)
+			if (!res.ok) throw new Error(`HTTP ${res.status}`)
+			onShareRevoked(shareId)
+		} catch (e) {
+			setError(errorMessage(e))
+		} finally {
+			setRevoking(false)
+		}
+	}, [sessionId, onShareRevoked])
 
-  const copyUrl = useCallback((url: string) => {
-    navigator.clipboard.writeText(url).then(() => {
-      setCopied(true);
-      setTimeout(() => setCopied(false), 1500);
-    });
-  }, []);
+	const copyUrl = useCallback((url: string) => {
+		navigator.clipboard.writeText(url).then(() => {
+			setCopied(true)
+			setTimeout(() => setCopied(false), 1500)
+		})
+	}, [])
 
-  if (!open) return null;
+	if (!open) return null
 
-  return (
-    <div
-      className="fixed inset-0 z-50 flex items-center justify-center bg-black/50"
-      onClick={onClose}
-    >
-      <div
-        className="bg-bg-surface border border-border-medium rounded-lg shadow-xl w-full max-w-md mx-4 p-5"
-        onClick={(e) => e.stopPropagation()}
-      >
-        <div className="flex items-center justify-between mb-3">
-          <h2 className="text-sm font-medium text-text-primary font-body">
-            Share this revision
-          </h2>
-          <button
-            onClick={onClose}
-            className="w-6 h-6 flex items-center justify-center rounded text-text-tertiary hover:text-text-secondary hover:bg-bg-elevated transition-colors"
-          >
-            <span className="text-xs">&#x2715;</span>
-          </button>
-        </div>
+	return (
+		<div
+			className="fixed inset-0 z-50 flex items-center justify-center bg-black/50"
+			onClick={onClose}
+		>
+			<div
+				className="bg-bg-surface border border-border-medium rounded-lg shadow-xl w-full max-w-md mx-4 p-5"
+				onClick={(e) => e.stopPropagation()}
+			>
+				<div className="flex items-center justify-between mb-3">
+					<h2 className="text-sm font-medium text-text-primary font-body">
+						Share this revision
+					</h2>
+					<button
+						onClick={onClose}
+						className="w-6 h-6 flex items-center justify-center rounded text-text-tertiary hover:text-text-secondary hover:bg-bg-elevated transition-colors"
+					>
+						<span className="text-xs">&#x2715;</span>
+					</button>
+				</div>
 
-        {!shareEnabled ? (
-          <div className="text-[13px] text-text-secondary font-body space-y-2">
-            <p>Canvas sharing is not configured.</p>
-            <p className="text-text-tertiary">
-              Set <code className="px-1 py-0.5 rounded bg-bg-elevated text-text-primary text-[11px]">CANVAS_SHARE_ENDPOINT</code> to the URL of a deployed{" "}
-              <code className="px-1 py-0.5 rounded bg-bg-elevated text-text-primary text-[11px]">canvas-share</code> worker and restart the daemon.
-            </p>
-          </div>
-        ) : shareForRev ? (
-          <div className="space-y-3">
-            <p className="text-[13px] text-text-secondary font-body">
-              This revision is shared:
-            </p>
-            <div className="flex gap-2">
-              <input
-                type="text"
-                readOnly
-                value={shareForRev.url}
-                className="flex-1 px-2 py-1.5 text-[12px] font-mono bg-bg-input border border-border-medium rounded text-text-primary"
-                onFocus={(e) => e.currentTarget.select()}
-              />
-              <button
-                onClick={() => copyUrl(shareForRev.url)}
-                className="px-3 py-1.5 text-[12px] font-body font-medium rounded bg-accent-blue text-white hover:opacity-90 transition-opacity whitespace-nowrap"
-              >
-                {copied ? "Copied!" : "Copy"}
-              </button>
-            </div>
-            {shareForRev.expiresAt && (
-              <p className="text-[11px] text-text-tertiary font-body">
-                Expires {new Date(shareForRev.expiresAt).toLocaleDateString()}.
-              </p>
-            )}
-            {shareForRev.encryptionKey && (
-              <p className="text-[11px] text-accent-green font-body flex items-center gap-1.5">
-                <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
-                  <rect x="3" y="11" width="18" height="11" rx="2" ry="2"/>
-                  <path d="M7 11V7a5 5 0 0 1 10 0v4"/>
-                </svg>
-                End-to-end encrypted — the key is part of the link and never leaves your browser.
-              </p>
-            )}
-            <p className="text-[11px] text-text-tertiary font-body">
-              Anyone with this link can view and leave feedback. Reviewer
-              feedback will appear in your annotation sidebar within seconds.
-            </p>
-            <div className="flex items-center justify-between pt-1">
-              <button
-                onClick={createShare}
-                disabled={loading || revoking}
-                className="text-[11px] text-text-tertiary hover:text-text-secondary font-body underline disabled:opacity-50"
-              >
-                {loading ? "Creating..." : "Create a new link"}
-              </button>
-              {shareForRev.ownerToken && (
-                <button
-                  onClick={() => revoke(shareForRev.shareId)}
-                  disabled={loading || revoking}
-                  className="text-[11px] text-accent-red hover:opacity-80 font-body underline disabled:opacity-50"
-                >
-                  {revoking ? "Revoking..." : "Revoke link"}
-                </button>
-              )}
-            </div>
-          </div>
-        ) : (
-          <div className="space-y-3">
-            <p className="text-[13px] text-text-secondary font-body">
-              Create a public link to this revision. Anyone with the link can
-              view the canvas and leave feedback. Reviewer feedback will sync
-              back here automatically.
-            </p>
-            <button
-              onClick={createShare}
-              disabled={loading}
-              className="w-full px-3 py-2 text-[13px] font-body font-medium rounded bg-accent-blue text-white hover:opacity-90 transition-opacity disabled:opacity-50"
-            >
-              {loading ? "Creating share link..." : "Create share link"}
-            </button>
-          </div>
-        )}
+				{!shareEnabled
+					? (
+						<div className="text-[13px] text-text-secondary font-body space-y-2">
+							<p>Canvas sharing is not configured.</p>
+							<p className="text-text-tertiary">
+								Set <code className="px-1 py-0.5 rounded bg-bg-elevated text-text-primary text-[11px]">CANVAS_SHARE_ENDPOINT</code> to the URL of a deployed
+								{' '}
+								<code className="px-1 py-0.5 rounded bg-bg-elevated text-text-primary text-[11px]">canvas-share</code> worker and restart the daemon.
+							</p>
+						</div>
+					)
+					: shareForRev
+					? (
+						<div className="space-y-3">
+							<p className="text-[13px] text-text-secondary font-body">
+								This revision is shared:
+							</p>
+							<div className="flex gap-2">
+								<input
+									type="text"
+									readOnly
+									value={shareForRev.url}
+									className="flex-1 px-2 py-1.5 text-[12px] font-mono bg-bg-input border border-border-medium rounded text-text-primary"
+									onFocus={(e) => e.currentTarget.select()}
+								/>
+								<button
+									onClick={() => copyUrl(shareForRev.url)}
+									className="px-3 py-1.5 text-[12px] font-body font-medium rounded bg-accent-blue text-white hover:opacity-90 transition-opacity whitespace-nowrap"
+								>
+									{copied ? 'Copied!' : 'Copy'}
+								</button>
+							</div>
+							{shareForRev.expiresAt && (
+								<p className="text-[11px] text-text-tertiary font-body">
+									Expires {new Date(shareForRev.expiresAt).toLocaleDateString()}.
+								</p>
+							)}
+							{shareForRev.encryptionKey && (
+								<p className="text-[11px] text-accent-green font-body flex items-center gap-1.5">
+									<svg
+										width="11"
+										height="11"
+										viewBox="0 0 24 24"
+										fill="none"
+										stroke="currentColor"
+										strokeWidth="2"
+										strokeLinecap="round"
+										strokeLinejoin="round"
+									>
+										<rect x="3" y="11" width="18" height="11" rx="2" ry="2" />
+										<path d="M7 11V7a5 5 0 0 1 10 0v4" />
+									</svg>
+									End-to-end encrypted — the key is part of the link and never leaves your browser.
+								</p>
+							)}
+							<p className="text-[11px] text-text-tertiary font-body">
+								Anyone with this link can view and leave feedback. Reviewer feedback will appear in your annotation sidebar within seconds.
+							</p>
+							<div className="flex items-center justify-between pt-1">
+								<button
+									onClick={createShare}
+									disabled={loading || revoking}
+									className="text-[11px] text-text-tertiary hover:text-text-secondary font-body underline disabled:opacity-50"
+								>
+									{loading ? 'Creating...' : 'Create a new link'}
+								</button>
+								{shareForRev.ownerToken && (
+									<button
+										onClick={() => revoke(shareForRev.shareId)}
+										disabled={loading || revoking}
+										className="text-[11px] text-accent-red hover:opacity-80 font-body underline disabled:opacity-50"
+									>
+										{revoking ? 'Revoking...' : 'Revoke link'}
+									</button>
+								)}
+							</div>
+						</div>
+					)
+					: (
+						<div className="space-y-3">
+							<p className="text-[13px] text-text-secondary font-body">
+								Create a public link to this revision. Anyone with the link can view the canvas and leave feedback. Reviewer feedback will sync back here
+								automatically.
+							</p>
+							<button
+								onClick={createShare}
+								disabled={loading}
+								className="w-full px-3 py-2 text-[13px] font-body font-medium rounded bg-accent-blue text-white hover:opacity-90 transition-opacity disabled:opacity-50"
+							>
+								{loading ? 'Creating share link...' : 'Create share link'}
+							</button>
+						</div>
+					)}
 
-        {error && (
-          <div className="mt-3 px-3 py-2 rounded bg-accent-red/10 border border-accent-red/20 text-[12px] text-accent-red font-body">
-            {error}
-          </div>
-        )}
-      </div>
-    </div>
-  );
+				{error && (
+					<div className="mt-3 px-3 py-2 rounded bg-accent-red/10 border border-accent-red/20 text-[12px] text-accent-red font-body">
+						{error}
+					</div>
+				)}
+			</div>
+		</div>
+	)
 }
 
 /** Small share icon button for toolbar use. */
-export function ShareButton({ onClick, title = "Share this revision", hasShare }: { onClick: () => void; title?: string; hasShare?: boolean }) {
-  return (
-    <button
-      onClick={onClick}
-      className={`group p-1.5 transition-colors ${hasShare ? "text-accent-blue hover:opacity-80" : "text-text-tertiary hover:text-text-secondary"}`}
-      title={title}
-    >
-      <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
-        <circle cx="18" cy="5" r="3"/>
-        <circle cx="6" cy="12" r="3"/>
-        <circle cx="18" cy="19" r="3"/>
-        <line x1="8.59" y1="13.51" x2="15.42" y2="17.49"/>
-        <line x1="15.41" y1="6.51" x2="8.59" y2="10.49"/>
-      </svg>
-    </button>
-  );
+export function ShareButton({ onClick, title = 'Share this revision', hasShare }: { onClick: () => void; title?: string; hasShare?: boolean }) {
+	return (
+		<button
+			onClick={onClick}
+			className={`group p-1.5 transition-colors ${hasShare ? 'text-accent-blue hover:opacity-80' : 'text-text-tertiary hover:text-text-secondary'}`}
+			title={title}
+		>
+			<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+				<circle cx="18" cy="5" r="3" />
+				<circle cx="6" cy="12" r="3" />
+				<circle cx="18" cy="19" r="3" />
+				<line x1="8.59" y1="13.51" x2="15.42" y2="17.49" />
+				<line x1="15.41" y1="6.51" x2="8.59" y2="10.49" />
+			</svg>
+		</button>
+	)
 }

package/daemon/client/apiSchemas.ts

@@ -0,0 +1,78 @@
+import { annotationAuthorSchema, annotationSchema } from '@fabrika/annotations/schemas'
+import { z } from 'zod'
+
+export const shareEntrySchema = z.object({
+	shareId: z.string(),
+	url: z.string(),
+	revision: z.number(),
+	createdAt: z.string(),
+	ownerToken: z.string().optional(),
+	expiresAt: z.string().optional(),
+	lastFeedbackAt: z.string().optional(),
+	/** Present iff the share is end-to-end encrypted; the URL itself
+	 *  carries the key in the `#k=...` fragment. */
+	encryptionKey: z.string().optional(),
+})
+
+export type ShareEntry = z.infer<typeof shareEntrySchema>
+
+const revisionInfoSchema = z.object({
+	revision: z.number(),
+	label: z.string().optional(),
+	canvasFiles: z.array(z.object({
+		filename: z.string(),
+		diffStats: z.object({ added: z.number(), removed: z.number() }).optional(),
+	})),
+	createdAt: z.string(),
+	hasFeedback: z.boolean(),
+	feedbackConsumed: z.boolean(),
+	response: z.string().optional(),
+}).passthrough()
+
+/** Served by the daemon for a session and by the share worker for a share, which leaves `projectRoot` out. */
+export const sessionMetaSchema = z.object({
+	encryption: z.object({ alg: z.literal('AES-GCM'), v: z.literal(1) }).optional(),
+	origin: z.object({
+		sessionId: z.string().optional(),
+		label: z.string().optional(),
+		revision: z.number().optional(),
+		createdAt: z.string().optional(),
+	}).optional(),
+	currentRevision: z.number().optional(),
+	revisions: z.array(revisionInfoSchema).optional(),
+	canvasFiles: z.array(z.string()).optional(),
+	projectRoot: z.string().optional(),
+	shares: z.array(shareEntrySchema).optional(),
+	shareEnabled: z.boolean().optional(),
+}).passthrough()
+
+export type SessionMeta = z.infer<typeof sessionMetaSchema>
+
+export const treeResponseSchema = z.object({
+	entries: z.array(z.object({ name: z.string(), type: z.enum(['file', 'dir']) })),
+})
+
+/** Mirrors the daemon's RemoteFeedbackEntry. */
+export const remoteFeedbackEntrySchema = z.object({
+	id: z.string(),
+	shareId: z.string(),
+	revision: z.number(),
+	submittedAt: z.string(),
+	author: annotationAuthorSchema,
+	annotations: z.array(annotationSchema.omit({ source: true, author: true })),
+	generalNote: z.string().optional(),
+})
+
+export type RemoteFeedbackEntry = z.infer<typeof remoteFeedbackEntrySchema>
+
+export const remoteFeedbackResponseSchema = z.object({ entries: z.array(remoteFeedbackEntrySchema) })
+
+export const shareCreatedResponseSchema = z.union([
+	z.object({ ok: z.literal(true), share: shareEntrySchema }),
+	z.object({ ok: z.literal(false).optional(), error: z.string().optional() }),
+])
+
+export const shareRevokedResponseSchema = z.union([
+	z.object({ ok: z.literal(true) }),
+	z.object({ ok: z.literal(false).optional(), error: z.string().optional() }),
+])

package/daemon/client/canvas-runtime.ts

@@ -1 +1 @@
-export * from "@fabrika/canvas-kernel/runtime";
+export * from '@fabrika/canvas-kernel/runtime'