Usage
Upload and manage files in your application
FileUpload Component
The FileUpload component provides a complete upload experience with drag-and-drop support.
import { FileUpload } from "@/forms/file/file-upload";
<FileUpload
bucket="avatars"
accept="image/*"
maxSize={5 * 1024 * 1024} // 5MB
onUpload={(path) => {
console.log("Uploaded to:", path);
}}
/>;Props
| Prop | Type | Description |
|---|---|---|
bucket | UploadBuckets | Target storage bucket |
accept | string | Accepted MIME types |
maxSize | number | Max file size in bytes |
onUpload | (path: string) => void | Callback after successful upload |
disabled | boolean | Disable the upload |
useFileUpload Hook
For custom upload UI, use the useFileUpload hook:
import { useFileUpload } from "@/forms/file/use-file-upload";
function CustomUploader() {
const { upload, isUploading, progress } = useFileUpload({
bucket: "documents",
});
const handleFile = async (file: File) => {
const path = await upload(file);
console.log("File uploaded to:", path);
};
return (
<div>
<input type="file" onChange={(e) => handleFile(e.target.files[0])} />
{isUploading && <p>Uploading... {progress}%</p>}
</div>
);
}Server-Side Operations
Upload a File
import { storage } from "@/lib/storage/server";
const buffer = Buffer.from(fileContent);
await storage.upload("path/to/file.pdf", buffer, "application/pdf");Get a Signed URL
// For reading (download link)
const downloadUrl = await storage.getSignedUrl("path/to/file.pdf", "read");
// For writing (upload link)
const uploadUrl = await storage.getSignedUrl("path/to/file.pdf", "write");Delete a File
await storage.delete("path/to/file.pdf");Check if File Exists
const exists = await storage.exists("path/to/file.pdf");API Routes
The storage system includes API routes for file operations:
POST /api/files/upload- Request upload URLGET /api/files/get-url- Get signed download URLGET /api/files/view- Stream file content
Security
- All uploads require authentication
- File paths include user/organization IDs for isolation
- Signed URLs expire after a configurable duration
- MIME type validation prevents malicious uploads