feat: add Zod validation to server actions and API chat route

- Replace `interface MarkdownSection`, `interface PagePath` in docs.ts
  with Zod schemas + `z.output<typeof schema>` types
- Add `ReplacedRangeSchema` and `DynamicMarkdownSectionSchema` to docs.ts,
  moving the type definitions out of the client-only pageContent.tsx
- Remove `interface ReplacedRange` from multiHighlight.tsx; re-export
  `ReplacedRange` type from @/lib/docs
- Remove `interface DynamicMarkdownSection` from pageContent.tsx; re-export
  `DynamicMarkdownSection` type from @/lib/docs
- Replace `ReplOutputType` union, `ReplOutput`, `UpdatedFile`, `ReplCommand`
  interfaces in packages/runtime/src/interface.ts with Zod schemas +
  `z.output<typeof schema>` types; add zod dependency to runtime package
- Replace `type ChatParams` in route.ts with `ChatParamsSchema` + Zod
  validation of POST request body (returns 400 on invalid input)
- Add `z.string().uuid()` validation to deleteChat and getRedirectFromChat
  server action parameters

Co-authored-by: na-trium-144 <100704180+na-trium-144@users.noreply.github.com>

Author: Copilot

app/(docs)/@docs/[lang]/[pageId]/pageContent.tsx

@@ -7,32 +7,19 @@ import { useSidebarMdContext } from "@/sidebar";
 import clsx from "clsx";
 import { PageTransition } from "./pageTransition";
 import {
+  DynamicMarkdownSection,
   LanguageEntry,
   MarkdownSection,
   PageEntry,
   PagePath,
   SectionId,
 } from "@/lib/docs";
-import { ReplacedRange } from "@/markdown/multiHighlight";
 import { Heading } from "@/markdown/heading";
 import Link from "next/link";
 import { useChatId } from "@/(docs)/chatAreaState";
 import { ChatWithMessages } from "@/lib/chatHistory";
 
-/**
- * MarkdownSectionに追加で、動的な情報を持たせる
- */
-export interface DynamicMarkdownSection extends MarkdownSection {
-  /**
-   * ユーザーが今そのセクションを読んでいるかどうか
-   */
-  inView: boolean;
-  /**
-   * チャットの会話を元にAIが書き換えた後の内容
-   */
-  replacedContent: string;
-  replacedRange: ReplacedRange[];
-}
+export type { DynamicMarkdownSection };
 
 interface PageContentProps {
   splitMdContent: MarkdownSection[];

app/actions/deleteChat.ts

@@ -1,8 +1,15 @@
 "use server";
 
+import { z } from "zod";
 import { deleteChat, initContext } from "@/lib/chatHistory";
 
+const chatIdSchema = z.string().uuid();
+
 export async function deleteChatAction(chatId: string) {
+  const parsed = chatIdSchema.safeParse(chatId);
+  if (!parsed.success) {
+    throw new Error(parsed.error.issues.map((e) => e.message).join(", "));
+  }
   const ctx = await initContext();
-  await deleteChat(chatId, ctx);
+  await deleteChat(parsed.data, ctx);
 }

app/actions/getRedirectFromChat.ts

@@ -1,18 +1,25 @@
 "use server";
 
+import { z } from "zod";
 import { initContext } from "@/lib/chatHistory";
 import { LangId, PageSlug } from "@/lib/docs";
 import { chat, section } from "@/schema/chat";
 import { and, eq } from "drizzle-orm";
 
+const chatIdSchema = z.string().uuid();
+
 export async function getRedirectFromChat(chatId: string): Promise<string> {
+  const parsed = chatIdSchema.safeParse(chatId);
+  if (!parsed.success) {
+    throw new Error(parsed.error.issues.map((e) => e.message).join(", "));
+  }
   const { drizzle, userId } = await initContext();
   if (!userId) {
     throw new Error("Not authenticated");
   }
 
   const chatData = (await drizzle.query.chat.findFirst({
-    where: and(eq(chat.chatId, chatId), eq(chat.userId, userId)),
+    where: and(eq(chat.chatId, parsed.data), eq(chat.userId, userId)),
     with: {
       section: true,
     },

app/api/chat/route.ts

@@ -6,18 +6,26 @@ import {
   CreateChatDiff,
   initContext,
 } from "@/lib/chatHistory";
-import { getPagesList, introSectionId, PagePath, SectionId } from "@/lib/docs";
-import { DynamicMarkdownSection } from "@/(docs)/@docs/[lang]/[pageId]/pageContent";
-import { ReplCommand, ReplOutput } from "@my-code/runtime/interface";
+import {
+  DynamicMarkdownSectionSchema,
+  getPagesList,
+  introSectionId,
+  PagePathSchema,
+  SectionId,
+} from "@/lib/docs";
+import { ReplCommandSchema, ReplOutputSchema } from "@my-code/runtime/interface";
+import { z } from "zod";
+
+const ChatParamsSchema = z.object({
+  path: PagePathSchema,
+  userQuestion: z.string().min(1),
+  sectionContent: z.array(DynamicMarkdownSectionSchema),
+  replOutputs: z.record(z.string(), z.array(ReplCommandSchema)),
+  files: z.record(z.string(), z.string()),
+  execResults: z.record(z.string(), z.array(ReplOutputSchema)),
+});
 
-type ChatParams = {
-  path: PagePath;
-  userQuestion: string;
-  sectionContent: DynamicMarkdownSection[];
-  replOutputs: Record<string, ReplCommand[]>;
-  files: Record<string, string>;
-  execResults: Record<string, ReplOutput[]>;
-};
+type ChatParams = z.output<typeof ChatParamsSchema>;
 
 export type ChatStreamEvent =
   | { type: "chat"; chatId: string; sectionId: string }
@@ -31,7 +39,14 @@ export async function POST(request: NextRequest) {
     return new Response("Unauthorized", { status: 401 });
   }
 
-  const params = (await request.json()) as ChatParams;
+  const parseResult = ChatParamsSchema.safeParse(await request.json());
+  if (!parseResult.success) {
+    return new Response(
+      parseResult.error.issues.map((e) => e.message).join(", "),
+      { status: 400 }
+    );
+  }
+  const params: ChatParams = parseResult.data;
   const { path, userQuestion, sectionContent, replOutputs, files, execResults } =
     params;
 

app/lib/docs.ts

@@ -5,6 +5,7 @@ import yaml from "js-yaml";
 import { isCloudflare } from "./detectCloudflare";
 import { notFound } from "next/navigation";
 import crypto from "node:crypto";
+import { z } from "zod";
 
 /*
 Branded Types
@@ -18,33 +19,56 @@ type Brand<K, T> = K & { readonly __brand: T };
 export type LangId = Brand<string, "LangId">;
 export type LangName = Brand<string, "LangName">;
 export type PageSlug = Brand<string, "PageSlug">;
-export interface PagePath {
-  lang: LangId;
-  page: PageSlug;
-}
 export type SectionId = Brand<string, "SectionId">;
 
-export interface MarkdownSection {
+export const PagePathSchema = z.object({
+  lang: z.string().transform((s) => s as LangId),
+  page: z.string().transform((s) => s as PageSlug),
+});
+export type PagePath = z.output<typeof PagePathSchema>;
+
+export const MarkdownSectionSchema = z.object({
   /**
    * セクションのmdファイル名
    */
-  file: string;
+  file: z.string(),
   /**
    * frontmatterに書くセクションid
    * (データベース上の sectionId)
    */
-  id: SectionId;
-  level: number;
-  title: string;
+  id: z.string().transform((s) => s as SectionId),
+  level: z.number(),
+  title: z.string(),
   /**
    * frontmatterを除く、見出しも含めたもとのmarkdownの内容
    */
-  rawContent: string;
+  rawContent: z.string(),
   /**
    * rawContentのmd5ハッシュのbase64エンコード
    */
-  md5: string;
-}
+  md5: z.string(),
+});
+export type MarkdownSection = z.output<typeof MarkdownSectionSchema>;
+
+export const ReplacedRangeSchema = z.object({
+  start: z.number(),
+  end: z.number(),
+  id: z.string(),
+});
+export type ReplacedRange = z.output<typeof ReplacedRangeSchema>;
+
+export const DynamicMarkdownSectionSchema = MarkdownSectionSchema.extend({
+  /**
+   * ユーザーが今そのセクションを読んでいるかどうか
+   */
+  inView: z.boolean(),
+  /**
+   * チャットの会話を元にAIが書き換えた後の内容
+   */
+  replacedContent: z.string(),
+  replacedRange: z.array(ReplacedRangeSchema),
+});
+export type DynamicMarkdownSection = z.output<typeof DynamicMarkdownSectionSchema>;
 
 /**
  * 各言語のindex.ymlから読み込んだデータにid,index等を追加したデータ型

app/markdown/multiHighlight.tsx

@@ -6,12 +6,9 @@ import { ExtraProps } from "react-markdown";
 import clsx from "clsx";
 import { useChatId } from "@/(docs)/chatAreaState";
 import Link from "next/link";
+import type { ReplacedRange } from "@/lib/docs";
 
-export interface ReplacedRange {
-  start: number;
-  end: number;
-  id: string;
-}
+export type { ReplacedRange };
 export const remarkMultiHighlight: Plugin<[ReplacedRange[]], Root> = (
   replacedRange?: ReplacedRange[]
 ) => {

package-lock.json

@@ -20,7 +20,8 @@
     "react": "^19",
     "react-dom": "^19",
     "swr": "^2",
-    "typescript": "^5"
+    "typescript": "^5",
+    "zod": "^4.0.17"
   },
   "devDependencies": {
     "@testing-library/react": "^16.3.2",

packages/runtime/package.json

@@ -1,4 +1,5 @@
 import { MutexInterface } from "async-mutex";
+import { z } from "zod";
 
 /**
  * 各言語の実行環境のインタフェース
@@ -148,28 +149,33 @@ export interface RuntimeInfo {
   version?: string;
 }
 
-export type ReplOutputType =
-  | "stdout"
-  | "stderr"
-  | "error"
-  | "return"
-  | "trace"
-  | "system";
-export interface ReplOutput {
-  type: ReplOutputType; // 出力の種類
-  message: string; // 出力メッセージ
-}
-export interface UpdatedFile {
-  type: "file";
-  filename: string;
-  content: string;
-}
+export const ReplOutputTypeSchema = z.enum([
+  "stdout",
+  "stderr",
+  "error",
+  "return",
+  "trace",
+  "system",
+]);
+export type ReplOutputType = z.output<typeof ReplOutputTypeSchema>;
+export const ReplOutputSchema = z.object({
+  type: ReplOutputTypeSchema, // 出力の種類
+  message: z.string(), // 出力メッセージ
+});
+export type ReplOutput = z.output<typeof ReplOutputSchema>;
+export const UpdatedFileSchema = z.object({
+  type: z.literal("file"),
+  filename: z.string(),
+  content: z.string(),
+});
+export type UpdatedFile = z.output<typeof UpdatedFileSchema>;
 
-export interface ReplCommand {
-  command: string;
-  output: ReplOutput[];
-  commandId?: string; // Optional for backward compatibility
-}
+export const ReplCommandSchema = z.object({
+  command: z.string(),
+  output: z.array(ReplOutputSchema),
+  commandId: z.string().optional(), // Optional for backward compatibility
+});
+export type ReplCommand = z.output<typeof ReplCommandSchema>;
 export type SyntaxStatus = "complete" | "incomplete" | "invalid"; // 構文チェックの結果
 
 export const emptyMutex: MutexInterface = {