7.8 일반 게시판 공용 폼/라우트 템플릿 생성 o

src/app/components/PostForm.tsx

@@ -0,0 +1,44 @@
+"use client";
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import { useToast } from "@/app/components/ui/ToastProvider";
+import { UploadButton } from "@/app/components/UploadButton";
+
+type Values = { title: string; content: string };
+
+export function PostForm({
+  initial,
+  onSubmit,
+  submitText = "등록",
+}: {
+  initial?: Partial<Values>;
+  onSubmit: (values: Values) => Promise<{ id: string } | void>;
+  submitText?: string;
+}) {
+  const router = useRouter();
+  const { show } = useToast();
+  const [form, setForm] = useState<Values>({ title: initial?.title ?? "", content: initial?.content ?? "" });
+  const [loading, setLoading] = useState(false);
+  async function handleSubmit() {
+    try {
+      setLoading(true);
+      const res = await onSubmit(form);
+      show("저장되었습니다");
+      if (res && res.id) router.push(`/posts/${res.id}`);
+    } catch (e) {
+      show("저장 실패");
+    } finally {
+      setLoading(false);
+    }
+  }
+  return (
+    <div style={{ display: "flex", flexDirection: "column", gap: 12 }}>
+      <input placeholder="제목" value={form.title} onChange={(e) => setForm({ ...form, title: e.target.value })} />
+      <textarea placeholder="내용" value={form.content} onChange={(e) => setForm({ ...form, content: e.target.value })} rows={12} />
+      <UploadButton onUploaded={(url) => setForm((f) => ({ ...f, content: `${f.content}\n![image](${url})` }))} />
+      <button disabled={loading} onClick={handleSubmit}>{loading ? "저장 중..." : submitText}</button>
+    </div>
+  );
+}
+
+