Documentation
Documentation
Introduction

Getting Started

Getting StartedInstallationQuick StartProject Structure

Architecture

Architecture OverviewTech StacktRPC MiddlewareDesign Principles

Patterns

Code Patterns & ConventionsFeature ModulesError HandlingType Safety

Database

DatabaseSchema DefinitionDatabase OperationsMigrationsCaching

API

tRPCProceduresRouterstRPC Proxy Setup
APIsOpenAPIREST Endpoints

Auth & Access

AuthenticationConfigurationOAuth ProvidersRolesSession Management
AuthorizationUser RolesPermissions

Routing & i18n

RoutingDeclarative RoutingNavigation
InternationalizationTranslationsLocale Routing

Components & UI

ComponentsButtonsFormsNavigationDialogs
StylesTailwind CSSThemingTypography

Storage

StorageConfigurationUsageBuckets

Configuration

ConfigurationEnvironment VariablesFeature Flags

Templates

Template GuidesCreate New FeatureCreate New PageCreate Database TableCreate tRPC RouterAdd Translations

Development

DevelopmentCommandsAI AgentsBest Practices

Buckets

Configure storage buckets for different file types

Bucket Configuration

Buckets are defined in src/lib/storage/types.ts:

export const StorageBuckets = {
  avatars: {
    maxSize: 5 * 1024 * 1024, // 5MB
    accept: ["image/jpeg", "image/png", "image/webp"],
    prefix: "avatars",
  },
  documents: {
    maxSize: 10 * 1024 * 1024, // 10MB
    accept: ["application/pdf", "text/plain"],
    prefix: "documents",
  },
  attachments: {
    maxSize: 25 * 1024 * 1024, // 25MB
    accept: ["*/*"],
    prefix: "attachments",
  },
} as const;

export type UploadBuckets = keyof typeof StorageBuckets;

Adding a New Bucket

  1. Add the bucket configuration to StorageBuckets:
export const StorageBuckets = {
  // ... existing buckets

  videos: {
    maxSize: 100 * 1024 * 1024, // 100MB
    accept: ["video/mp4", "video/webm"],
    prefix: "videos",
  },
} as const;
  1. The bucket is now available for use:
<FileUpload bucket="videos" />

Bucket Properties

PropertyTypeDescription
maxSizenumberMaximum file size in bytes
acceptstring[]Allowed MIME types
prefixstringPath prefix in storage

Path Generation

File paths are automatically generated to ensure uniqueness and organization:

{prefix}/{userId}/{timestamp}-{randomId}.{extension}

Example: avatars/usr_abc123/1703456789-def456.jpg

Validation

The isValidBucket utility validates bucket names:

import { isValidBucket } from "@/lib/storage";

if (!isValidBucket(bucketName)) {
  throw new Error("Invalid bucket");
}

MIME Type Helpers

Get accepted file types for a bucket:

import { getBucketAccept } from "@/lib/storage";

const accept = getBucketAccept("avatars");
// Returns: "image/jpeg,image/png,image/webp"

On this page

Bucket Configuration
Adding a New Bucket
Bucket Properties
Path Generation
Validation
MIME Type Helpers