Server: support handlerRequest()

Author: fuma-nama

.changeset/quiet-dodos-kneel.md

@@ -0,0 +1,7 @@
+---
+"@fuma-comment/server": minor
+"@fuma-comment/react": minor
+"@fuma-comment/next": minor
+---
+
+Move method handlers of `CustomComment()` to `.methods`

apps/docs/content/docs/hono.mdx

@@ -18,4 +18,4 @@ HonoComment({
     storage: // storage adapter
     auth: // auth adapter
 });
-```
+```

apps/docs/content/docs/image-upload.mdx

@@ -50,7 +50,7 @@ const storage: StorageContext = {
       {
         method: "POST",
         body,
-      }
+      },
     );
 
     if (res.ok) {

apps/docs/content/docs/index.mdx

@@ -203,7 +203,7 @@ const app = new Elysia()
         // or other prefix if you wanted
         prefix: "/api/comments",
       },
-    })
+    }),
   )
   .listen(8080);
 

packages/next/package.json

@@ -7,9 +7,7 @@
 	"author": "Fuma Nama",
 	"homepage": "https://fuma-comment.vercel.app",
 	"repository": "https://github.com/fuma-nama/fuma-comment",
-	"files": [
-		"./dist"
-	],
+	"files": ["./dist"],
 	"license": "MIT",
 	"scripts": {
 		"lint": "biome lint .",

packages/react/package.json

@@ -6,10 +6,7 @@
 	"author": "Fuma Nama",
 	"homepage": "https://fuma-comment.vercel.app",
 	"repository": "https://github.com/fuma-nama/fuma-comment",
-	"files": [
-		"./dist",
-		"./css"
-	],
+	"files": ["./dist", "./css"],
 	"license": "MIT",
 	"type": "module",
 	"exports": {

packages/react/src/components/comment/content-renderer.tsx

@@ -195,7 +195,10 @@ export function ContentRenderer({
 function CodeBlock({
 	language,
 	content,
-}: { language: string; content: string }) {
+}: {
+	language: string;
+	content: string;
+}) {
 	const tree = lowlight.highlight(
 		lowlight.registered(language) ? language : "plaintext",
 		content,

packages/react/src/components/editor/image-upload.tsx

@@ -18,7 +18,9 @@ import { ImageIcon } from "lucide-react";
 
 export default function UploadImageButton({
 	editor,
-}: { editor: Editor }): React.ReactElement {
+}: {
+	editor: Editor;
+}): React.ReactElement {
 	useHookUpdate(editor);
 	const [isOpen, setIsOpen] = useState(false);
 

packages/react/src/components/timestamp.tsx

@@ -4,7 +4,9 @@ import { toLocalString } from "../utils/date";
 
 export function Timestamp({
 	timestamp,
-}: { timestamp: Date | string }): React.ReactNode {
+}: {
+	timestamp: Date | string;
+}): React.ReactNode {
 	const [str, setStr] = useState("");
 
 	useLayoutEffect(() => {

packages/server/examples/tanstack.ts

@@ -0,0 +1,59 @@
+import { createServerRoute } from "@tanstack/react-start/server";
+import type { CustomCommentOptions, CustomRequest } from "../src/custom";
+import { CustomComment } from "../src/custom";
+import { mockAdapter } from "../test/utils";
+
+// Define the request type for Tanstack Start
+export type TanstackRequest = CustomRequest & {
+	// Optionally, you can add Tanstack-specific context here if needed
+};
+
+export type TanstackCommentOptions = CustomCommentOptions<TanstackRequest>;
+
+const comment = CustomComment<TanstackRequest>({
+    storage: mockAdapter,
+    auth: {
+        getSession() {
+            return null
+        },
+    }
+});
+
+async function endpoint({
+	request,
+	params,
+}: { request: Request; params: Record<string, string> }) {
+	const res = await comment.handleRequest(
+		request.method,
+		params._splat,
+		(params) => ({
+			method: request.method,
+			body() {
+				return request.json();
+			},
+			headers: request.headers,
+			params,
+			queryParams: new URL(request.url).searchParams,
+		}),
+	);
+
+	if (!res) {
+		return new Response("Not Found", {
+			status: 404,
+		});
+	}
+
+	if (res.type === "success") {
+		return Response.json(res.data);
+	}
+
+	return Response.json(res.data, { status: res.status });
+}
+
+export const ServerRoute = createServerRoute("/api/comments/$").methods({
+	GET: endpoint,
+	DELETE: endpoint,
+	POST: endpoint,
+	PATCH: endpoint,
+	PUT: endpoint,
+});