Integrations

Use these patterns when the content model depends on a supporting capability outside ordinary text and relationships. These are usually the patterns that connect your content schema to media handling, storage, or other infrastructure-backed features.

In self-hosted Dyrected, your app owns storage and image-processing infrastructure. Use these patterns with the storage adapter, bucket, and deployment model your runtime controls.

Create a media upload collection

Problem: editors need a proper place to upload and manage files instead of scattering media fields across unrelated documents.

This pattern creates a dedicated upload collection with file rules and supporting metadata fields. It is the usual starting point for image libraries, downloadable assets, and any project where media needs to be reused across multiple records.

Example implementation

import { defineCollection, defineTextField, defineTextareaField } from "@dyrected/core";

export const Media = defineCollection({
  slug: "media",
  upload: {
    allowedMimeTypes: ["image/jpeg", "image/png", "image/webp"],
    maxFileSize: 10 * 1024 * 1024,
  },
  fields: [
    defineTextField({ name: "alt", label: "Alternative text", required: true }),
    defineTextareaField({ name: "caption", label: "Caption" }),
  ],
});

Read the full docs:

• Upload overview
• Storage adapters
• Collections

Create a document download library

Problem: editors need a dedicated place to manage downloadable files instead of attaching them ad hoc across many records.

This pattern uses an upload collection for PDFs and office documents, with shared metadata that can be reused anywhere in the site or app. It works well for brochures, reports, onboarding packs, and gated resources.

Example implementation

import { defineCollection, defineTextField, defineTextareaField } from "@dyrected/core";

export const Documents = defineCollection({
  slug: "documents",
  admin: { useAsTitle: "title" },
  upload: {
    allowedMimeTypes: [
      "application/pdf",
      "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
    ],
    maxFileSize: 20 * 1024 * 1024,
  },
  fields: [
    defineTextField({ name: "title", label: "Title", required: true }),
    defineTextareaField({ name: "summary", label: "Summary" }),
  ],
});

Read the full docs:

• Upload overview
• Storage adapters

Create a responsive image library

Problem: editors need one reusable image library, but the frontend also needs predictable derived sizes for cards, hero sections, and thumbnails.

This pattern defines generated upload sizes and a dedicated admin thumbnail so one source image can support multiple frontend layouts cleanly. It is a strong default for marketing sites, media-heavy dashboards, and content teams that reuse the same assets often.

Example implementation

import { defineCollection, defineTextField, defineTextareaField } from "@dyrected/core";

export const Media = defineCollection({
  slug: "media",
  admin: { useAsTitle: "alt" },
  upload: {
    allowedMimeTypes: ["image/jpeg", "image/png", "image/webp"],
    maxFileSize: 10 * 1024 * 1024,
    adminThumbnail: "card",
    imageSizes: [
      { name: "card", width: 640, height: 480, fit: "cover" },
      { name: "hero", width: 1600, height: 900, fit: "cover" },
    ],
  },
  fields: [
    defineTextField({ name: "alt", label: "Alternative text", required: true }),
    defineTextareaField({ name: "caption", label: "Caption" }),
  ],
});

Read the full docs:

• Upload overview
• Storage adapters