@jiggai/kitchen 0.3.1 → 0.3.3

package/src/app/cron-jobs/cron-jobs-client.tsx

@@ -1,243 +0,0 @@
-"use client";
-
-import { useEffect, useMemo, useState } from "react";
-import { useToast } from "@/components/ToastProvider";
-import { DeleteCronJobModal } from "@/components/delete-modals";
-import { errorMessage } from "@/lib/errors";
-import { fetchJson } from "@/lib/fetch-json";
-
-type CronJob = {
-  id: string;
-  name?: string;
-  enabled?: boolean;
-  schedule?: { kind?: string; expr?: string; everyMs?: number; tz?: string };
-  state?: { nextRunAtMs?: number };
-  agentId?: string;
-  sessionTarget?: string;
-  // Optional enrichment from the API (which team/agent it belongs to)
-  scope?: { kind: "team" | "agent"; id: string; label: string; href: string };
-};
-
-function fmtSchedule(s?: CronJob["schedule"]): string {
-  if (!s) return "";
-  if (s.kind === "cron" && s.expr) return s.expr;
-  if (s.kind === "every" && s.everyMs) {
-    const mins = Math.round(s.everyMs / 60000);
-    return mins >= 60 ? `every ${Math.round(mins / 60)}h` : `every ${mins}m`;
-  }
-  return s.kind ?? "";
-}
-
-function isEnabled(j: CronJob): boolean {
-  // Some responses put enabled under state.enabled.
-  return Boolean(j.enabled ?? (j as { state?: { enabled?: unknown } }).state?.enabled);
-}
-
-export default function CronJobsClient() {
-  const toast = useToast();
-  const [loading, setLoading] = useState(false);
-  const [jobs, setJobs] = useState<CronJob[]>([]);
-  const [msg, setMsg] = useState<string>("");
-  const [expandedId, setExpandedId] = useState<string | null>(null);
-
-  const [deleteOpen, setDeleteOpen] = useState(false);
-  const [deleteId, setDeleteId] = useState<string>("");
-  const [deleteLabel, setDeleteLabel] = useState<string>("");
-  const [deleteBusy, setDeleteBusy] = useState(false);
-  const [deleteError, setDeleteError] = useState<string | null>(null);
-
-  const sorted = useMemo(() => {
-    return [...jobs].sort((a, b) => {
-      const ae = isEnabled(a);
-      const be = isEnabled(b);
-      if (ae !== be) return ae ? -1 : 1; // enabled first
-      return String(a.name ?? "").localeCompare(String(b.name ?? ""));
-    });
-  }, [jobs]);
-
-  async function refresh() {
-    setLoading(true);
-    setMsg("");
-    try {
-      const json = await fetchJson<{ jobs?: CronJob[] }>("/api/cron/jobs", { cache: "no-store" });
-      setJobs(json.jobs ?? []);
-      if ((json.jobs ?? []).length === 0) {
-        setMsg("No cron jobs found.");
-      }
-    } catch (e: unknown) {
-      setMsg(errorMessage(e));
-      setJobs([]);
-    } finally {
-      setLoading(false);
-    }
-  }
-
-  useEffect(() => {
-    refresh();
-  }, []);
-
-  async function act(id: string, action: "enable" | "disable" | "run") {
-    setLoading(true);
-    setMsg("");
-    try {
-      await fetchJson("/api/cron/job", {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify({ id, action }),
-      });
-      setMsg(action === "run" ? "Triggered run." : "Updated.");
-      await refresh();
-    } catch (e: unknown) {
-      setMsg(errorMessage(e));
-    } finally {
-      setLoading(false);
-    }
-  }
-
-  function openDelete(job: CronJob) {
-    setDeleteId(job.id);
-    setDeleteLabel(job.name ?? job.id);
-    setDeleteError(null);
-    setDeleteOpen(true);
-  }
-
-  async function confirmDelete() {
-    setDeleteBusy(true);
-    setDeleteError(null);
-    try {
-      const json = await fetchJson<{ ok?: boolean; error?: string }>("/api/cron/delete", {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify({ id: deleteId }),
-      });
-      if (!json.ok) throw new Error(json.error || "Delete failed");
-      toast.push({ kind: "success", message: `Removed cron job: ${deleteLabel}` });
-      setDeleteOpen(false);
-      await refresh();
-    } catch (e: unknown) {
-      const msg = errorMessage(e);
-      setDeleteError(msg);
-      toast.push({ kind: "error", message: msg });
-    } finally {
-      setDeleteBusy(false);
-    }
-  }
-
-  return (
-    <>
-      <div>
-        <div className="ck-glass-strong p-4">
-        <div className="flex items-center justify-between">
-          <div>
-            <h2 className="text-lg font-semibold">All Cron Jobs</h2>
-            <p className="mt-1 text-sm text-[color:var(--ck-text-secondary)]">
-              {jobs.length} job{jobs.length !== 1 ? "s" : ""} total · {jobs.filter((j) => isEnabled(j)).length} enabled
-            </p>
-          </div>
-          <button
-            type="button"
-            onClick={refresh}
-            disabled={loading}
-            className="rounded-[var(--ck-radius-sm)] border border-white/10 bg-white/5 px-3 py-2 text-sm font-medium shadow-[var(--ck-shadow-1)] transition-colors hover:bg-white/10 active:bg-white/15"
-          >
-            Refresh
-          </button>
-        </div>
-      </div>
-
-      {msg ? (
-        <div className="mt-4 rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/20 p-3 text-sm">
-          {msg}
-        </div>
-      ) : null}
-
-      <div className="mt-6 space-y-3">
-        {sorted.map((j) => (
-          <div key={j.id} className="ck-glass px-4 py-3">
-            <div
-              role="button"
-              tabIndex={0}
-              onClick={() => setExpandedId((cur) => (cur === j.id ? null : j.id))}
-              onKeyDown={(e) => {
-                if (e.key === "Enter" || e.key === " ") {
-                  e.preventDefault();
-                  setExpandedId((cur) => (cur === j.id ? null : j.id));
-                }
-              }}
-              className="w-full cursor-pointer text-left"
-            >
-              <div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
-                <div className="min-w-0">
-                  <div className="truncate font-medium">{j.name ?? j.id}</div>
-                  <div className="mt-1 flex flex-wrap gap-x-3 text-xs text-[color:var(--ck-text-secondary)]">
-                    <span>{fmtSchedule(j.schedule)}</span>
-                    <span>{isEnabled(j) ? "✅ enabled" : "⏸ disabled"}</span>
-                    {j.agentId ? <span>agent: {j.agentId}</span> : null}
-                    {j.scope ? (
-                      <span>
-                        {j.scope.kind}: {" "}
-                        <a
-                          className="underline hover:no-underline"
-                          href={j.scope.href}
-                          onClick={(e) => e.stopPropagation()}
-                        >
-                          {j.scope.label}
-                        </a>
-                      </span>
-                    ) : null}
-                    {j.sessionTarget ? <span>target: {j.sessionTarget}</span> : null}
-                    {j.state?.nextRunAtMs ? <span>next: {new Date(j.state.nextRunAtMs).toLocaleString()}</span> : null}
-                  </div>
-                </div>
-
-                <div className="flex gap-2" onClick={(e) => e.stopPropagation()}>
-                  <button
-                    type="button"
-                    onClick={() => act(j.id, isEnabled(j) ? "disable" : "enable")}
-                    disabled={loading}
-                    className="rounded-[var(--ck-radius-sm)] border border-white/10 bg-white/5 px-3 py-2 text-sm font-medium transition-colors hover:bg-white/10"
-                  >
-                    {isEnabled(j) ? "Disable" : "Enable"}
-                  </button>
-                  <button
-                    type="button"
-                    onClick={() => act(j.id, "run")}
-                    disabled={loading}
-                    className="rounded-[var(--ck-radius-sm)] bg-[var(--ck-accent-red)] px-3 py-2 text-sm font-medium text-white transition-colors hover:bg-[var(--ck-accent-red-hover)] active:bg-[var(--ck-accent-red-active)]"
-                  >
-                    Run now
-                  </button>
-                  <button
-                    type="button"
-                    title={isEnabled(j) ? "Disable this job before deleting." : "Delete cron job"}
-                    onClick={() => openDelete(j)}
-                    disabled={loading || isEnabled(j)}
-                    className="rounded-[var(--ck-radius-sm)] border border-[color:rgba(255,59,48,0.45)] bg-[color:rgba(255,59,48,0.08)] px-3 py-2 text-sm font-medium text-[color:var(--ck-accent-red)] transition-colors hover:bg-[color:rgba(255,59,48,0.12)] disabled:opacity-40"
-                  >
-                    Delete
-                  </button>
-                </div>
-              </div>
-            </div>
-
-            {expandedId === j.id ? (
-              <pre className="mt-3 overflow-x-auto rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 p-3 text-xs text-[color:var(--ck-text-primary)]">
-                {JSON.stringify(j, null, 2)}
-              </pre>
-            ) : null}
-          </div>
-        ))}
-      </div>
-    </div>
-
-      <DeleteCronJobModal
-        open={deleteOpen}
-        jobLabel={deleteLabel}
-        busy={deleteBusy}
-        error={deleteError}
-        onClose={() => setDeleteOpen(false)}
-        onConfirm={confirmDelete}
-      />
-    </>
-  );
-}

package/src/app/cron-jobs/page.tsx

@@ -1,34 +0,0 @@
-import CronJobsClient from "./cron-jobs-client";
-import Link from "next/link";
-
-export default function CronJobsPage() {
-  return (
-    <div className="ck-glass w-full p-6 sm:p-8">
-      <div className="flex items-baseline justify-between gap-4">
-        <h1 className="text-2xl font-semibold tracking-tight">Cron Jobs (recipe-installed)</h1>
-        <div className="flex gap-3">
-          <Link
-            href="/settings"
-            className="text-sm font-medium text-[color:var(--ck-text-secondary)] transition-colors hover:text-[color:var(--ck-text-primary)]"
-          >
-            Settings
-          </Link>
-          <Link
-            href="/"
-            className="text-sm font-medium text-[color:var(--ck-text-secondary)] transition-colors hover:text-[color:var(--ck-text-primary)]"
-          >
-            Home
-          </Link>
-        </div>
-      </div>
-      <p className="mt-2 text-sm text-[color:var(--ck-text-secondary)]">
-        This page only shows cron jobs installed by recipes (based on the scaffold mapping file
-        <code className="ml-1">notes/cron-jobs.json</code> in the team workspace).
-      </p>
-
-      <div className="mt-6">
-        <CronJobsClient />
-      </div>
-    </div>
-  );
-}

package/src/app/global-error.tsx

@@ -1,50 +0,0 @@
-"use client";
-
-import { useEffect } from "react";
-
-// NOTE: Next.js renders this when the root layout (or anything above the segment
-// error boundary) throws. Keep it dependency-light: no AppShell / no router hooks.
-export default function GlobalError({
-  error,
-  reset,
-}: {
-  error: Error & { digest?: string };
-  reset: () => void;
-}) {
-  useEffect(() => {
-    console.error("Global error:", error);
-  }, [error]);
-
-  return (
-    <html lang="en">
-      <body className="min-h-screen bg-[color:var(--ck-bg)] text-[color:var(--ck-text-primary)]">
-        <div className="mx-auto max-w-2xl px-6 py-16">
-          <h1 className="text-xl font-semibold">Something went wrong</h1>
-          <p className="mt-2 text-sm text-[color:var(--ck-text-secondary)]">
-            An unexpected error occurred.
-          </p>
-
-          <pre className="mt-6 overflow-auto rounded-md border border-[color:var(--ck-border-subtle)] bg-[color:var(--ck-bg-glass)] p-4 text-xs text-[color:var(--ck-text-secondary)]">
-            {String(error?.stack || error)}
-          </pre>
-
-          {error?.digest ? (
-            <p className="mt-3 text-xs text-[color:var(--ck-text-secondary)]">
-              Digest: {error.digest}
-            </p>
-          ) : null}
-
-          <div className="mt-6 flex gap-3">
-            <button
-              type="button"
-              onClick={() => reset()}
-              className="rounded-[var(--ck-radius-sm)] bg-[var(--ck-accent-red)] px-4 py-2 text-sm font-medium text-white"
-            >
-              Try again
-            </button>
-          </div>
-        </div>
-      </body>
-    </html>
-  );
-}

package/src/app/globals.css

@@ -1,153 +0,0 @@
-@import "tailwindcss";
-
-/*
-  Claw Kitchen UI tokens
-  Goal: macOS Mission Control vibe — frosted glass surfaces, subtle depth,
-  and system-red accents.
-
-  Default theme: LIGHT (per ticket 0024).
-  Dark theme is opt-in via [data-theme="dark"].
-*/
-:root {
-  /* Base colors (light) */
-  --ck-bg-base: #f6f7fb;
-  --ck-bg-glass: rgba(255, 255, 255, 0.70);
-  --ck-bg-glass-strong: rgba(255, 255, 255, 0.86);
-
-  /* Toasts (barely transparent in light mode) */
-  --ck-toast-bg: rgba(255, 255, 255, 0.94);
-  --ck-toast-border: rgba(10, 12, 16, 0.16);
-
-  --ck-border-subtle: rgba(10, 12, 16, 0.10);
-  --ck-border-strong: rgba(10, 12, 16, 0.16);
-
-  --ck-text-primary: rgba(10, 12, 16, 0.92);
-  --ck-text-secondary: rgba(10, 12, 16, 0.64);
-  --ck-text-tertiary: rgba(10, 12, 16, 0.48);
-
-  /* Accent (macOS-ish system red) */
-  --ck-accent-red: #ff3b30;
-  --ck-accent-red-hover: #ff5a52;
-  --ck-accent-red-active: #e6372d;
-
-  /* Focus ring */
-  --ck-focus-ring: rgba(255, 59, 48, 0.55);
-
-  /* Radii */
-  --ck-radius-sm: 10px;
-  --ck-radius-md: 14px;
-  --ck-radius-lg: 18px;
-
-  /* Elevation (lighter shadows) */
-  --ck-shadow-1: 0 10px 30px rgba(10, 12, 16, 0.12);
-  --ck-shadow-2: 0 18px 50px rgba(10, 12, 16, 0.18);
-
-  /* Glass */
-  --ck-glass-blur: 18px;
-  --ck-glass-saturation: 1.15;
-
-  /* Legacy mappings (Next starter defaults) */
-  --background: var(--ck-bg-base);
-  --foreground: var(--ck-text-primary);
-}
-
-[data-theme="dark"] {
-  --ck-bg-base: #0b0c10;
-  --ck-bg-glass: rgba(24, 25, 31, 0.72);
-  --ck-bg-glass-strong: rgba(24, 25, 31, 0.88);
-
-  /* Toasts (barely transparent in dark mode) */
-  --ck-toast-bg: rgba(24, 25, 31, 0.92);
-  --ck-toast-border: rgba(255, 255, 255, 0.18);
-
-  --ck-border-subtle: rgba(255, 255, 255, 0.10);
-  --ck-border-strong: rgba(255, 255, 255, 0.16);
-
-  --ck-text-primary: rgba(255, 255, 255, 0.92);
-  --ck-text-secondary: rgba(255, 255, 255, 0.66);
-  --ck-text-tertiary: rgba(255, 255, 255, 0.50);
-
-  --ck-focus-ring: rgba(255, 59, 48, 0.70);
-
-  --ck-shadow-1: 0 10px 30px rgba(0, 0, 0, 0.35);
-  --ck-shadow-2: 0 18px 50px rgba(0, 0, 0, 0.45);
-
-  --ck-glass-saturation: 1.25;
-}
-
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --font-sans: var(--font-geist-sans);
-  --font-mono: var(--font-geist-mono);
-}
-
-html,
-body {
-  height: 100%;
-}
-
-body {
-  background: var(--ck-bg-base);
-  color: var(--ck-text-primary);
-  font-family: var(--font-geist-sans), system-ui, -apple-system, Segoe UI, Roboto,
-    Arial, Helvetica, sans-serif;
-}
-
-/* Wallpaper-like backdrop (kept subtle; readability first) */
-body::before {
-  content: "";
-  position: fixed;
-  inset: 0;
-  z-index: -1;
-  background:
-    radial-gradient(1200px 700px at 20% 15%, rgba(255, 59, 48, 0.10), transparent 60%),
-    radial-gradient(900px 600px at 75% 25%, rgba(10, 12, 16, 0.05), transparent 55%),
-    radial-gradient(1100px 700px at 55% 80%, rgba(120, 140, 255, 0.10), transparent 60%),
-    linear-gradient(180deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0));
-}
-
-[data-theme="dark"] body::before {
-  background:
-    radial-gradient(1200px 700px at 20% 15%, rgba(255, 59, 48, 0.14), transparent 60%),
-    radial-gradient(900px 600px at 75% 25%, rgba(255, 255, 255, 0.08), transparent 55%),
-    radial-gradient(1100px 700px at 55% 80%, rgba(120, 140, 255, 0.10), transparent 60%),
-    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(0, 0, 0, 0));
-}
-
-/* Universal focus ring: ensures keyboard nav remains obvious on glass. */
-:where(a, button, input, textarea, select, summary, [role="button"], [tabindex]):focus-visible {
-  outline: 2px solid var(--ck-focus-ring);
-  outline-offset: 2px;
-}
-
-/* Glass surface utility classes (fallback-first) */
-.ck-glass {
-  background: var(--ck-bg-glass);
-  border: 1px solid var(--ck-border-subtle);
-  border-radius: var(--ck-radius-md);
-  box-shadow: var(--ck-shadow-1);
-  transition: background-color 160ms ease-out, box-shadow 180ms ease-out, border-color 160ms ease-out;
-}
-
-@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
-  .ck-glass {
-    -webkit-backdrop-filter: blur(var(--ck-glass-blur)) saturate(var(--ck-glass-saturation));
-    backdrop-filter: blur(var(--ck-glass-blur)) saturate(var(--ck-glass-saturation));
-  }
-}
-
-.ck-glass-strong {
-  background: var(--ck-bg-glass-strong);
-  border: 1px solid var(--ck-border-strong);
-  border-radius: var(--ck-radius-md);
-  box-shadow: var(--ck-shadow-2);
-  transition: background-color 160ms ease-out, box-shadow 180ms ease-out, border-color 160ms ease-out;
-}
-
-@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
-  .ck-glass-strong {
-    -webkit-backdrop-filter: blur(calc(var(--ck-glass-blur) + 4px)) saturate(var(--ck-glass-saturation));
-    backdrop-filter: blur(calc(var(--ck-glass-blur) + 4px)) saturate(var(--ck-glass-saturation));
-  }
-}

package/src/app/goals/[id]/goal-editor.tsx

@@ -1,162 +0,0 @@
-"use client";
-
-import Link from "next/link";
-import { GoalFormCard, GoalFormFields } from "@/components/GoalFormFields";
-import { errorMessage } from "@/lib/errors";
-import { fetchJson } from "@/lib/fetch-json";
-import { type GoalFrontmatter, type GoalStatus, useGoalFormState } from "@/lib/goals-client";
-import { useRouter } from "next/navigation";
-import { useCallback, useEffect, useState } from "react";
-
-export default function GoalEditor({ goalId }: { goalId: string }) {
-  const router = useRouter();
-  const [loading, setLoading] = useState(true);
-  const [saving, setSaving] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-  const [updatedAt, setUpdatedAt] = useState<string | null>(null);
-
-  const { formState, tags, teams } = useGoalFormState();
-  const { setTitle, setStatus, setTagsRaw, setTeamsRaw, setBody } = formState;
-
-  const loadGoal = useCallback(async () => {
-    setLoading(true);
-    setError(null);
-    try {
-      const data = await fetchJson<{ goal: GoalFrontmatter; body: string }>(
-        `/api/goals/${encodeURIComponent(goalId)}`,
-        { cache: "no-store" }
-      );
-      const g = data.goal;
-      setTitle(g.title ?? "");
-      setStatus((g.status as GoalStatus) ?? "planned");
-      setTagsRaw((g.tags ?? []).join(", "));
-      setTeamsRaw((g.teams ?? []).join(", "));
-      setBody(data.body ?? "");
-      setUpdatedAt(g.updatedAt ?? null);
-    } catch (e: unknown) {
-      setError(errorMessage(e));
-    } finally {
-      setLoading(false);
-    }
-  }, [goalId, setTitle, setStatus, setTagsRaw, setTeamsRaw, setBody]);
-
-  useEffect(() => {
-    void loadGoal();
-  }, [loadGoal]);
-
-  async function save() {
-    setSaving(true);
-    setError(null);
-    try {
-      const data = await fetchJson<{ goal: GoalFrontmatter }>(
-        `/api/goals/${encodeURIComponent(goalId)}`,
-        {
-          method: "PUT",
-          headers: { "content-type": "application/json" },
-          body: JSON.stringify({
-            title: formState.title,
-            status: formState.status,
-            tags,
-            teams,
-            body: formState.body,
-          }),
-        }
-      );
-      setUpdatedAt(data.goal.updatedAt ?? null);
-      router.push("/goals");
-    } catch (e: unknown) {
-      setError(errorMessage(e));
-    } finally {
-      setSaving(false);
-    }
-  }
-
-  async function promoteToInbox() {
-    setSaving(true);
-    setError(null);
-    try {
-      await fetchJson(`/api/goals/${encodeURIComponent(goalId)}/promote`, {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify({}),
-      });
-      await loadGoal();
-    } catch (e: unknown) {
-      setError(errorMessage(e));
-    } finally {
-      setSaving(false);
-    }
-  }
-
-  async function deleteThisGoal() {
-    const ok = window.confirm(`Delete goal \"${goalId}\"? This will delete the markdown file.`);
-    if (!ok) return;
-
-    setSaving(true);
-    setError(null);
-    try {
-      await fetchJson(`/api/goals/${encodeURIComponent(goalId)}`, { method: "DELETE" });
-      router.push("/goals");
-    } catch (e: unknown) {
-      setError(errorMessage(e));
-    } finally {
-      setSaving(false);
-    }
-  }
-
-  return (
-    <div className="space-y-4">
-      <div className="flex items-center justify-between gap-3">
-        <Link href="/goals" className="text-sm font-medium hover:underline">
-          ← Back
-        </Link>
-        <div className="text-xs text-[color:var(--ck-text-tertiary)] font-mono">{goalId}</div>
-      </div>
-
-      <GoalFormCard
-        error={error}
-        actions={
-        <div className="flex flex-wrap items-center gap-3">
-          <button
-            onClick={() => void save()}
-            disabled={saving || loading}
-            className="rounded-[var(--ck-radius-sm)] bg-[var(--ck-accent-red)] px-3 py-2 text-sm font-medium text-white disabled:opacity-50"
-          >
-            {saving ? "Saving…" : "Save"}
-          </button>
-          <button
-            onClick={() => void loadGoal()}
-            disabled={saving}
-            className="rounded-[var(--ck-radius-sm)] border border-[color:var(--ck-border-subtle)] px-3 py-2 text-sm"
-          >
-            Reload
-          </button>
-          <button
-            onClick={() => void promoteToInbox()}
-            disabled={saving || loading}
-            className="rounded-[var(--ck-radius-sm)] border border-[color:var(--ck-border-subtle)] px-3 py-2 text-sm font-medium"
-          >
-            Promote to inbox
-          </button>
-          <button
-            onClick={() => void deleteThisGoal()}
-            disabled={saving || loading}
-            className="rounded-[var(--ck-radius-sm)] border border-[color:rgba(255,59,48,0.45)] bg-[color:rgba(255,59,48,0.08)] px-3 py-2 text-sm font-medium text-[color:var(--ck-accent-red)] transition-colors hover:bg-[color:rgba(255,59,48,0.12)]"
-          >
-            Delete
-          </button>
-        </div>
-        }
-      >
-        <GoalFormFields formState={formState} updatedAt={updatedAt} />
-      </GoalFormCard>
-
-      <div className="ck-glass p-6">
-        <div className="text-sm font-medium">Preview</div>
-        <pre className="mt-2 whitespace-pre-wrap break-words text-sm leading-6 text-[color:var(--ck-text-primary)]">{formState.body}</pre>
-      </div>
-
-      {loading ? <div className="text-sm text-[color:var(--ck-text-secondary)]">Loading…</div> : null}
-    </div>
-  );
-}

package/src/app/goals/[id]/page.tsx

@@ -1,6 +0,0 @@
-import GoalEditor from "./goal-editor";
-
-export default async function GoalDetailPage({ params }: { params: Promise<{ id: string }> }) {
-  const { id } = await params;
-  return <GoalEditor goalId={id} />;
-}