DynamicForm.DirectUpload (DynamicForm v0.17.6)

Copy Markdown View Source

A LiveView component for handling direct-to-storage file uploads in dynamic forms.

This component enables file uploads directly to cloud storage (e.g., Google Cloud Storage) using presigned URLs, similar to the pattern used in DirectorWeb licensing flows.

Configuration

The component requires a presigner callback function that generates presigned URLs for uploading files to cloud storage. This is configured via the field's metadata.

Question Configuration

Add a file question to your form instance:

%DynamicForm.Instance.Question{
  name: "documents",
  type: "file",
  title: "Upload Documents",
  description: "Upload supporting documents (max 10MB per file)",
  isRequired: true,
  metadata: %{
    "max_entries" => 3,
    "max_file_size" => 10_000_000,
    "accept" => :any,  # or ["image/*", ".pdf", ".doc", ".docx"]
    "presigner" => %{
      "module" => "MyApp.UrlPresigner",
      "function" => "sign"
    },
    "bucket" => "my-bucket",
    "object_name_prefix" => "uploads/"
  }
}

Presigner Callback

The presigner function should accept a filename and context map, and return a presigned URL:

def sign(filename, context) do
  bucket = context.bucket
  object_name = "#{context.prefix}#{filename}"
  CoreData.Clients.UrlPresigner.sign(bucket, object_name)
end

Uploaded Files Data Structure

Uploaded files are stored in the changeset as a list of maps:

[
  %{
    "filename" => "document.pdf",
    "cloud_bucket" => "my-bucket",
    "cloud_path" => "uploads/document.pdf",
    "cloud_provider" => "gcp",
    "uploaded_on" => "10/28/2025"
  }
]

Events

The component sends these events to the parent LiveView:

  • :uploads_not_ready - When upload starts or file is deleted (and no files remain)
  • :uploads_ready - When all uploads complete or at least one file exists