Initial Mebbling hub implementation

app/dashboard/page.tsx

@@ -0,0 +1,3 @@
+import { redirect } from "next/navigation"; import { getSession } from "@/lib/auth"; import { db } from "@/lib/db"; import { PublishForm } from "./publish-form"; import { WebhookControl } from "./webhook-control";
+export const dynamic="force-dynamic";
+export default async function Dashboard({searchParams}:{searchParams:Promise<{error?:string;source?:string}>}){const query=await searchParams;const user=await getSession();if(!user)redirect('/login');const sources=db.prepare('SELECT s.id,s.name,s.base_url,s.sync_status,s.last_synced_at,s.last_error,s.webhook_secret_hash,s.last_webhook_at,s.user_id AS owner_id FROM sources s JOIN source_members sm ON sm.source_id=s.id WHERE sm.user_id=? ORDER BY s.id DESC').all(user.id) as any[];return <><h1>控制台</h1>{query.error&&<p className="error">{query.error}</p>}{query.source==='shared'?<p>你已加入既有的共享 Memos 來源，不會重複同步貼文。</p>:query.source&&<p>來源已連接，首次同步已排入佇列。</p>}<section className="card"><h2>發佈到自己的 Memos</h2>{sources.length?<PublishForm sources={sources}/>:<p className="muted">請先連接一個 Memos 來源。</p>}</section><section className="card"><h2>連接 Memos</h2><form action="/api/sources" method="post"><label>顯示名稱<input name="name" required placeholder="我的 Memos"/></label><label>Memos 網址<input name="baseUrl" type="url" required placeholder="https://memos.example.com"/></label><label>Personal Access Token<input name="token" type="password" required/></label><button>驗證並連接</button></form><p className="muted">Token 會使用伺服器金鑰加密保存。同一個 Memos 帳號與網址會自動共用來源，不會建立重複貼文。</p></section><section><h2>已連接來源</h2>{sources.map(s=><article className="card" key={s.id}><div className="space"><strong>{s.name}</strong><span className="tag">{s.sync_status}</span></div><p className="meta">來源 ID：{s.id}<br/>{s.base_url}<br/>上次同步：{s.last_synced_at||'尚未完成'}<br/>Webhook：{s.webhook_secret_hash?(s.last_webhook_at?`最近收到：${new Date(s.last_webhook_at+'Z').toLocaleString('zh-TW')}`:'已建立 URL，尚未收到呼叫'):'尚未建立 URL'}{s.last_error&&<><br/><span className="error">{s.last_error}</span></>}</p>{s.owner_id===user.id?<WebhookControl sourceId={s.id} configured={Boolean(s.webhook_secret_hash)}/>:<p className="meta">這是共享來源；只有建立者可以管理 webhook。</p>}<form action="/api/sync" method="post"><input type="hidden" name="sourceId" value={s.id}/><button>立即同步</button></form></article>)}</section></>}

app/dashboard/publish-form.tsx

@@ -0,0 +1,34 @@
+"use client";
+
+import { FormEvent, useState } from "react";
+
+type Source = { id: number; name: string };
+
+export function PublishForm({ sources }: { sources: Source[] }) {
+  const [error, setError] = useState("");
+  const [submitting, setSubmitting] = useState(false);
+
+  async function submit(event: FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+    setSubmitting(true); setError("");
+    try {
+      const response = await fetch("/api/posts", { method: "POST", body: new FormData(event.currentTarget), headers: { Accept: "application/json" } });
+      const result = await response.json();
+      if (!response.ok) throw new Error(result.error || "發佈失敗");
+      window.location.assign(`/posts/${result.id}`);
+    } catch (reason) {
+      setError(reason instanceof Error ? reason.message : "發佈失敗");
+      setSubmitting(false);
+    }
+  }
+
+  return <form onSubmit={submit} encType="multipart/form-data">
+    <label>內容（Markdown）<textarea name="content" required /></label>
+    <label>標籤（逗號分隔）<input name="tags" placeholder="旅行, 想法" /></label>
+    <label>可見性<select name="visibility" defaultValue="PUBLIC"><option value="PUBLIC">公開</option><option value="PROTECTED">受保護</option><option value="PRIVATE">私人</option></select></label>
+    <label>發佈來源<select name="sourceId" required>{sources.map((source) => <option key={source.id} value={source.id}>{source.name}</option>)}</select></label>
+    <label>圖片或附件（每檔最多 10 MB）<input name="attachments" type="file" multiple /></label>
+    {error && <p className="error">{error}</p>}
+    <button disabled={submitting}>{submitting ? "發佈中…" : "發佈並同步"}</button>
+  </form>;
+}

app/dashboard/webhook-control.tsx

@@ -0,0 +1,20 @@
+"use client";
+
+import { useState } from "react";
+
+export function WebhookControl({ sourceId, configured }: { sourceId: number; configured: boolean }) {
+  const [url, setUrl] = useState(""); const [error, setError] = useState(""); const [busy, setBusy] = useState(false);
+  async function generate() {
+    setBusy(true); setError("");
+    try {
+      const response = await fetch(`/api/sources/${sourceId}/webhook`, { method: "POST", headers: { Accept: "application/json" } });
+      const body = await response.json(); if (!response.ok) throw new Error(body.error || "無法產生 webhook URL"); setUrl(body.url);
+    } catch (reason) { setError(reason instanceof Error ? reason.message : "無法產生 webhook URL"); }
+    finally { setBusy(false); }
+  }
+  async function copy() { if (url) await navigator.clipboard.writeText(url); }
+  return <div className="webhook-control"><p className="meta">Webhook：{configured ? "已設定" : "尚未設定"}</p>
+    {url ? <><label className="sr-only" htmlFor={`webhook-${sourceId}`}>Webhook URL</label><input id={`webhook-${sourceId}`} readOnly value={url} onFocus={(event) => event.currentTarget.select()} /><div className="row"><button type="button" onClick={copy}>複製 URL</button><button type="button" className="danger" onClick={generate} disabled={busy}>重新產生</button></div><p className="meta">請立即複製到 Memos；重新整理後完整密鑰不會再顯示。</p></> : <button type="button" onClick={generate} disabled={busy}>{busy ? "產生中…" : configured ? "重新產生 webhook URL" : "產生 webhook URL"}</button>}
+    {error && <p className="error">{error}</p>}
+  </div>;
+}