663bc77afe
Bundles in-flight ECHODO work with the Coolify deployment configuration: App - New routes: ai, forms, planner, settings (templates/types), teams, doc detail, whiteboard detail - New components: app shell rework (icon-rail, top-header), forms builder/renderer/responses, types manager, objects creation dialog, card primitive, form + overview views - New tRPC routers: favorites, forms, types, workspaces; updates to health and objects routers - Markdown backlog sync (packages/database) + cursor-sync schema/migrations - Schema additions: forms, types, favorites, markdown_backlog, cursor_sync - Initial Drizzle migrations checked in Deployment - docker/docker-compose.coolify.yml: drops bundled Postgres/Redis (uses CT 102 shared services), removes host port mappings, adds Coolify SERVICE_FQDN_* magic vars for web + collab - .env.example rewritten as the full ECHODO/Coolify variable manifest - NextAuth gains an Authentik OIDC provider (gated on env presence) - Root layout injects Umami tracking script when configured; metadata title flipped to ECHODO Security - .gitignore expanded to exclude AGENT-DEPLOY.md, .env.*, secrets/, credentials.*, *.key, *.crt, *.pem, ssh keys Made-with: Cursor
100 lines
3.6 KiB
TypeScript
100 lines
3.6 KiB
TypeScript
"use client";
|
|
|
|
import { useParams, useRouter } from "next/navigation";
|
|
import { Plus, PenTool, Loader2 } from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
import { api } from "@/lib/trpc";
|
|
|
|
export default function WhiteboardsPage() {
|
|
const params = useParams();
|
|
const router = useRouter();
|
|
const workspaceSlug = params.workspaceSlug as string;
|
|
|
|
const { data, isLoading } = api.objects.list.useQuery(
|
|
{ workspaceId: workspaceSlug, type: "whiteboard", limit: 200 },
|
|
{ enabled: Boolean(workspaceSlug) },
|
|
);
|
|
|
|
const createMutation = api.objects.create.useMutation({
|
|
onSuccess: (newObj) => {
|
|
router.push(`/${workspaceSlug}/whiteboards/${newObj.id}`);
|
|
},
|
|
});
|
|
|
|
const whiteboards = data?.objects ?? [];
|
|
|
|
return (
|
|
<div className="flex h-full flex-col">
|
|
<div className="flex shrink-0 items-center justify-between border-b px-6 py-4">
|
|
<div className="flex items-center gap-3">
|
|
<div className="flex h-9 w-9 items-center justify-center rounded-lg bg-primary/10">
|
|
<PenTool className="size-5 text-primary" />
|
|
</div>
|
|
<h1 className="text-lg font-semibold">Whiteboards</h1>
|
|
</div>
|
|
<Button
|
|
size="sm"
|
|
className="gap-1.5"
|
|
onClick={() =>
|
|
createMutation.mutate({
|
|
type: "whiteboard",
|
|
title: "Untitled Whiteboard",
|
|
workspaceId: workspaceSlug,
|
|
})
|
|
}
|
|
disabled={createMutation.isPending}
|
|
>
|
|
<Plus className="size-4" />
|
|
New Whiteboard
|
|
</Button>
|
|
</div>
|
|
|
|
<div className="flex-1 overflow-y-auto p-6">
|
|
{isLoading ? (
|
|
<div className="flex items-center justify-center py-20">
|
|
<Loader2 className="size-6 animate-spin text-muted-foreground" />
|
|
</div>
|
|
) : whiteboards.length === 0 ? (
|
|
<div className="flex flex-col items-center justify-center gap-3 rounded-lg border border-dashed py-20 text-muted-foreground">
|
|
<PenTool className="size-10 opacity-40" />
|
|
<p className="text-sm">No whiteboards yet</p>
|
|
<Button
|
|
variant="outline"
|
|
size="sm"
|
|
className="gap-1.5"
|
|
onClick={() =>
|
|
createMutation.mutate({
|
|
type: "whiteboard",
|
|
title: "Untitled Whiteboard",
|
|
workspaceId: workspaceSlug,
|
|
})
|
|
}
|
|
>
|
|
<Plus className="size-4" />
|
|
Create your first whiteboard
|
|
</Button>
|
|
</div>
|
|
) : (
|
|
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
|
|
{whiteboards.map((wb) => (
|
|
<button
|
|
key={wb.id}
|
|
type="button"
|
|
onClick={() => router.push(`/${workspaceSlug}/whiteboards/${wb.id}`)}
|
|
className="group flex flex-col gap-2 rounded-lg border bg-card p-4 text-left transition-colors hover:border-primary/40 hover:bg-accent/50"
|
|
>
|
|
<div className="flex h-32 w-full items-center justify-center rounded-md bg-muted">
|
|
<PenTool className="size-8 text-muted-foreground/40" />
|
|
</div>
|
|
<p className="truncate text-sm font-medium">{wb.title || "Untitled"}</p>
|
|
<p className="text-xs text-muted-foreground">
|
|
{new Date(wb.updatedAt ?? wb.createdAt).toLocaleDateString()}
|
|
</p>
|
|
</button>
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|