feat: add LLM-powered file generator tool

Add a new file-generator tool that allows LLMs to create and save downloadable files. The tool supports various file formats including CSV, JSON, XML, code files, and more.

Features:
- Generate 1-5 files per invocation with custom content
- Automatic MIME type inference from file extensions
- Upload to S3/Vercel Blob storage with presigned URLs
- Clean UI component with file metadata display
- Download functionality with proper filenames
- Supports multiple file formats (CSV, JSON, XML, YAML, code files, etc.)

Implementation follows the existing image-manager tool pattern:
- Server-side file generation and upload
- Streaming of download URLs to client
- Custom tool invocation UI component
- Integration with existing file storage infrastructure

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>

Author: mrjasonroy

src/app/api/chat/route.ts

@@ -48,7 +48,8 @@ import { getSession } from "auth/server";
 import { colorize } from "consola/utils";
 import { generateUUID } from "lib/utils";
 import { nanoBananaTool, openaiImageTool } from "lib/ai/tools/image";
-import { ImageToolName } from "lib/ai/tools";
+import { fileGeneratorTool } from "lib/ai/tools/file-generator";
+import { ImageToolName, FileGeneratorToolName } from "lib/ai/tools";
 import { buildCsvIngestionPreviewParts } from "@/lib/ai/ingest/csv-ingest";
 import { serverFileStorage } from "lib/file-storage";
 
@@ -283,9 +284,13 @@ export async function POST(request: Request) {
                   : openaiImageTool,
             }
           : {};
+        const FILE_GENERATOR_TOOL: Record<string, Tool> = {
+          [FileGeneratorToolName]: fileGeneratorTool,
+        };
         const vercelAITooles = safe({
           ...MCP_TOOLS,
           ...WORKFLOW_TOOLS,
+          ...FILE_GENERATOR_TOOL,
         })
           .map((t) => {
             const bindingTools =

src/components/message-parts.tsx

@@ -51,7 +51,11 @@ import {
   VercelAIWorkflowToolStreamingResultTag,
 } from "app-types/workflow";
 import { Avatar, AvatarFallback, AvatarImage } from "ui/avatar";
-import { DefaultToolName, ImageToolName } from "lib/ai/tools";
+import {
+  DefaultToolName,
+  ImageToolName,
+  FileGeneratorToolName,
+} from "lib/ai/tools";
 import {
   Shortcut,
   getShortcutKeyList,
@@ -726,6 +730,17 @@ const ImageGeneratorToolInvocation = dynamic(
   },
 );
 
+const FileGeneratorToolInvocation = dynamic(
+  () =>
+    import("./tool-invocation/file-generator").then(
+      (mod) => mod.FileGeneratorToolInvocation,
+    ),
+  {
+    ssr: false,
+    loading,
+  },
+);
+
 // Local shortcuts for tool invocation approval/rejection
 const approveToolInvocationShortcut: Shortcut = {
   description: "approveToolInvocation",
@@ -880,6 +895,10 @@ export const ToolMessagePart = memo(
         return <ImageGeneratorToolInvocation part={part} />;
       }
 
+      if (toolName === FileGeneratorToolName) {
+        return <FileGeneratorToolInvocation part={part} />;
+      }
+
       if (toolName === DefaultToolName.JavascriptExecution) {
         return (
           <CodeExecutor

src/components/tool-invocation/file-generator.tsx

@@ -0,0 +1,159 @@
+"use client";
+
+import { ToolUIPart } from "ai";
+import equal from "lib/equal";
+import { FileIcon, Download } from "lucide-react";
+import { memo, useMemo } from "react";
+import { TextShimmer } from "ui/text-shimmer";
+import { Button } from "ui/button";
+import { Badge } from "ui/badge";
+
+interface FileGeneratorToolInvocationProps {
+  part: ToolUIPart;
+}
+
+interface FileGeneratorResult {
+  files: {
+    url: string;
+    filename: string;
+    mimeType: string;
+    size: number;
+  }[];
+  description?: string;
+}
+
+function formatFileSize(bytes: number): string {
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+
+function PureFileGeneratorToolInvocation({
+  part,
+}: FileGeneratorToolInvocationProps) {
+  const isGenerating = useMemo(() => {
+    return !part.state.startsWith("output");
+  }, [part.state]);
+
+  const result = useMemo(() => {
+    if (!part.state.startsWith("output")) return null;
+    return part.output as FileGeneratorResult;
+  }, [part.state, part.output]);
+
+  const files = useMemo(() => {
+    return result?.files || [];
+  }, [result]);
+
+  const hasError = useMemo(() => {
+    return (
+      part.state === "output-error" ||
+      (part.state === "output-available" && result?.files.length === 0)
+    );
+  }, [part.state, result]);
+
+  // Loading state
+  if (isGenerating) {
+    return (
+      <div className="flex flex-col gap-3">
+        <TextShimmer>Generating file...</TextShimmer>
+        <div className="bg-muted/30 border border-border/50 rounded-lg p-6 flex items-center justify-center">
+          <div className="flex items-center gap-3 text-muted-foreground">
+            <FileIcon className="size-5 animate-pulse" />
+            <span className="text-sm">Creating your file...</span>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-col gap-4">
+      <div className="flex items-center gap-2">
+        {!hasError && <FileIcon className="size-4" />}
+        <span className="text-sm font-semibold">
+          {hasError
+            ? "File generation failed"
+            : files.length === 1
+              ? "File generated"
+              : `${files.length} files generated`}
+        </span>
+      </div>
+
+      {hasError ? (
+        <div className="bg-card text-muted-foreground p-6 rounded-lg text-xs border border-border/20">
+          {part.errorText ?? "Failed to generate file. Please try again."}
+        </div>
+      ) : (
+        <div className="flex flex-col gap-3">
+          {result?.description && (
+            <p className="text-sm text-muted-foreground">
+              {result.description}
+            </p>
+          )}
+          <div className="flex flex-col gap-2">
+            {files.map((file, index) => {
+              const fileExtension =
+                file.filename.split(".").pop()?.toUpperCase() || "FILE";
+
+              return (
+                <div
+                  key={index}
+                  className="bg-muted/60 border border-border/80 rounded-xl p-4 hover:border-primary/50 transition-all shadow-sm hover:shadow-md group"
+                >
+                  <div className="flex items-center gap-4">
+                    <div className="flex-shrink-0 rounded-lg bg-muted p-3">
+                      <FileIcon className="size-6 text-muted-foreground" />
+                    </div>
+                    <div className="flex-1 min-w-0 space-y-1">
+                      <p
+                        className="text-sm font-medium line-clamp-1"
+                        title={file.filename}
+                      >
+                        {file.filename}
+                      </p>
+                      <div className="flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
+                        <Badge
+                          variant="outline"
+                          className="uppercase tracking-wide px-2 py-0.5"
+                        >
+                          {fileExtension}
+                        </Badge>
+                        <span>{formatFileSize(file.size)}</span>
+                        {file.mimeType && (
+                          <span
+                            className="truncate max-w-[10rem]"
+                            title={file.mimeType}
+                          >
+                            {file.mimeType}
+                          </span>
+                        )}
+                      </div>
+                    </div>
+                    <Button
+                      asChild
+                      size="sm"
+                      variant="outline"
+                      className="flex-shrink-0 hover:bg-primary hover:text-primary-foreground transition-colors"
+                    >
+                      <a href={file.url} download={file.filename}>
+                        <Download className="size-4 mr-2" />
+                        Download
+                      </a>
+                    </Button>
+                  </div>
+                </div>
+              );
+            })}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
+
+export const FileGeneratorToolInvocation = memo(
+  PureFileGeneratorToolInvocation,
+  (prev, next) => {
+    return equal(prev.part, next.part);
+  },
+);

src/lib/ai/tools/file-generator/index.ts

@@ -0,0 +1,117 @@
+import { tool as createTool } from "ai";
+import { serverFileStorage } from "lib/file-storage";
+import z from "zod";
+import { FileGeneratorToolName } from "..";
+import logger from "logger";
+
+export type FileGeneratorToolResult = {
+  files: {
+    url: string;
+    filename: string;
+    mimeType: string;
+    size: number;
+  }[];
+  description?: string;
+};
+
+export const fileGeneratorTool = createTool({
+  name: FileGeneratorToolName,
+  description: `Create and save files with specified content. Use this tool when the user requests downloadable files such as:
+- Data files: CSV, JSON, XML, YAML
+- Documents: Markdown, text files, configuration files
+- Code files: Python, JavaScript, HTML, CSS, etc.
+- Structured data exports
+
+The tool will generate the file, upload it to storage, and provide a download link. Do not use this for images (use image-manager instead) or for simple text responses that don't need to be downloaded.`,
+  inputSchema: z.object({
+    files: z
+      .array(
+        z.object({
+          filename: z
+            .string()
+            .describe(
+              "The name of the file including extension (e.g., data.csv, script.py)",
+            ),
+          content: z.string().describe("The complete content of the file"),
+          mimeType: z
+            .string()
+            .optional()
+            .describe(
+              "MIME type (e.g., 'text/csv', 'application/json', 'text/plain'). If not provided, will be inferred from filename.",
+            ),
+        }),
+      )
+      .min(1)
+      .max(5)
+      .describe("Array of files to generate (1-5 files)"),
+    description: z
+      .string()
+      .optional()
+      .describe(
+        "Optional description of what the files contain or how to use them",
+      ),
+  }),
+  execute: async ({ files, description }) => {
+    try {
+      const uploadedFiles = await Promise.all(
+        files.map(async (file) => {
+          // Convert content to Buffer
+          const buffer = Buffer.from(file.content, "utf-8");
+
+          // Infer MIME type from filename if not provided
+          let mimeType = file.mimeType;
+          if (!mimeType) {
+            const extension = file.filename.split(".").pop()?.toLowerCase();
+            const mimeTypeMap: Record<string, string> = {
+              csv: "text/csv",
+              json: "application/json",
+              xml: "application/xml",
+              yaml: "text/yaml",
+              yml: "text/yaml",
+              txt: "text/plain",
+              md: "text/markdown",
+              html: "text/html",
+              css: "text/css",
+              js: "text/javascript",
+              ts: "text/typescript",
+              py: "text/x-python",
+              sh: "application/x-sh",
+              sql: "application/sql",
+              env: "text/plain",
+              log: "text/plain",
+            };
+            mimeType = mimeTypeMap[extension || ""] || "text/plain";
+          }
+
+          // Upload to storage (same pattern as image tool)
+          const uploaded = await serverFileStorage.upload(buffer, {
+            filename: file.filename,
+            contentType: mimeType,
+          });
+
+          // Get presigned URL for private buckets if available
+          const downloadUrl = serverFileStorage.getDownloadUrl
+            ? await serverFileStorage.getDownloadUrl(uploaded.key)
+            : uploaded.sourceUrl;
+
+          return {
+            url: downloadUrl || uploaded.sourceUrl,
+            filename: uploaded.metadata.filename || file.filename,
+            mimeType: uploaded.metadata.contentType || mimeType,
+            size: uploaded.metadata.size || buffer.length,
+          };
+        }),
+      );
+
+      return {
+        files: uploadedFiles,
+        description,
+      };
+    } catch (e) {
+      logger.error(e);
+      throw new Error(
+        "File generation was successful, but file upload failed. Please check your file upload configuration and try again.",
+      );
+    }
+  },
+});

src/lib/ai/tools/index.ts

@@ -20,3 +20,5 @@ export enum DefaultToolName {
 export const SequentialThinkingToolName = "sequential-thinking";
 
 export const ImageToolName = "image-manager";
+
+export const FileGeneratorToolName = "file-generator";