Unify Applications
Logo
File Upload

File Upload

Logo

10 mins READ

Let users pick or drag files into your application, upload them to configured storage, and expose the resulting file URLs and metadata for use in downstream actions and data sources.

unify-applications-file-upload-01-file-upload-block.png
unify-applications-file-upload-01-file-upload-block.png

Overview

The File Upload block accepts files via drag-and-drop or click-to-browse, uploads them to your workspace's configured cloud storage, and exposes the results as file descriptors — not raw bytes. You control which file types are allowed, how many files can be attached at once, a per-file size cap, who can access the stored files, and whether users can download them. An optional template file link and description add-on round out the UI.

The equivalent inside a Form block is the File Uploader form field, which participates in form submit, validation, and reset flows. Use the standalone block for page-level upload controls outside a form context.

Note: What gets stored? The file bytes go to cloud storage. What your logic receives is a descriptor object with id, name, url, size, mimeType, fileType (extension), sourceType, and source. Always read the URL or ID off this object; the binary file itself is never available in no-code expressions.

Block vs. Form Field

Aspect

Standalone Block

File Uploader Form Field

Where it lives

Anywhere on the page

Inside a Form block

Value access

{{ id.files }} (array)

{{ form.data.fieldKey }} (object or array)

Validation

Manual (bind to disabled state)

Is Optional, Validity Conditions, Max Files, Max Size

Reset

Remove All Files method

Form resetForm clears it

Multiple files

Selection Type set to Multiple

Allow multiple files toggle

Submit integration

No — read files manually

Yes — included in form payload

File Restrictions

Property

Type

Default

Description

Label

string

Upload File

Heading shown above the drop zone. Translatable.

Supported Files

list of file types

Any File

Multi-select catalog of accepted types: Any File, Audio, C Source, Certificate (PKCS#12), CSV, Documents, Excel 2007+, Excel 97-2003, Excel Binary, Folder (folder-pick mode), GIF, HEIC, HEIF, HTML, HTM, ICO, Images, Java Source, JavaScript, JPEG, JPEG (File Extension), JPG, JPG (File Extension), JSON (File Extension), JSON (MIME Type), Keystore, Keystore (JKS), Lottie, Markdown, Markdown (File Extension), MOV, MP3, MP4, OpenDocument Text, Outlook Message, PDF, Plain text, PNG, PowerPoint, PowerPoint (Open XML), Property List, Provisioning Profile, Python, Rich Text Format, SVG, Text, Text (File Extension), TIF, TIFF, TSV, Videos, VSD, VSDX, WAV, WebP, WebP (File Extension), Word Document, XML, XSD and ZIP. Selecting JPG also accepts JPEG silently.

Selection Type

Single or Multiple

Single

Whether the user can attach one or several files at once.

Max Files

number

— (no limit)

Maximum number of files. Appears only when Selection Type is Multiple. Must be a whole number, otherwise no limit applies. Files beyond the limit are rejected with an error.

Max File Size

number (MB)

No Limit

Per-file size cap in megabytes. Pick a preset (1 MB, 5 MB, 10 MB or 50 MB) or type your own value. Applies to each file individually, not to the combined total.

Warning: Folder type is special: Adding Folder to Supported File Types turns on folder-picking mode (the user selects a whole directory), not a file extension filter. It strips "Folder" from the accept list and instead switches the native file picker into folder mode.

Access & File Visibility

The File Visibility setting controls who can open a stored file after upload. The block and the File Uploader form field offer the same four options.

Option

Who can access

Only me

Accessible to the uploading user only.

Only this app

Accessible to users of this app.

Restricted

Accessible to all authenticated users. This is the default unless your app sets a different one.

Public

Accessible to anyone. An inline warning banner is shown.

The app-level default for file visibility is set under App Settings → Advanced Settings → File Management. Individual block instances can override it. The visibility control on the block and on the form field both follow this hierarchy.

Allow Download (boolean, default true) — shows a download control in the uploaded file list. Turning it off hides the download action for users, but does not affect the url in state.

Storage

Folder Path (optional) sets the folder inside your app's file storage where uploads are saved. It accepts variables, for example invoices/{{user.userId}}.

  • Leave it empty to give every upload its own folder.

  • Naming a folder saves the file exactly there. A file with the same name in the same folder replaces the previous one.

  • Spaces and special characters are saved as underscores (_). Links and ".." segments are not accepted.

On the File Uploader form field, use the Destination folder add-on for the same setting.

Add-ons

Add-on

What it does

Description

Helper text rendered below the drop zone, for instructions the label doesn't cover.

Template File

Adds a downloadable template link in the block header. Set a Label, an Icon, and either a URL or an uploaded file as the source. Useful for "download this format, fill it in, upload it back" flows.

Appearance

Property

Type

Default

Description

Upload Icon

icon

Cloud upload icon

Icon shown inside the empty drop zone.

Disabled

condition

—

Condition that greys out the block and blocks uploads when true.

Visibility

condition

—

Hides the block when the condition is false.

Styles

style set

—

Border (Stroke), Radius, and background Color for the drop zone.

Exposed State

Key ( {{ id.* }} )

Type

Description

files

array

All currently attached files. Each item has: id, name, url, size, mimeType, fileType (extension), sourceType (CLOUD_STORAGE or URL), source, progress (0–100), isUploaded (boolean), hasError (boolean) and error. A failed file has hasError set to true and an empty url.

isUploading

boolean

true while any file in the block is still uploading. It turns false when the batch stops, whether or not every file succeeded.

content.supportedFileTypes

array

The configured accepted file-type tokens.

content.selectionVariant

string

"single" or "multiple".

Warning: During upload, url is a local blob, not a real link. While a file is uploading, url points to a temporary browser preview that is useful for thumbnails but can't be shared or stored. When the batch finishes, every file reads isUploaded: true and progress 100, including files that failed. A failed file has hasError: true and an empty url. Before any "save" or "submit" action, check that {{ id.isUploading }} is false and that no file in {{ id.files }} has hasError set to true.

Events & Methods

Events

Event

When it fires

Notes

On File Uploaded

Once, after every file in the current batch has finished uploading

Fires on the transition from "uploading" to "idle". Dropping five files at once fires the event once, not five times. To act on each file, loop over {{ id.files }} in this event's actions.

Methods

Method

Parameters

Description

Remove File (removeFile)

File Id

Removes one file by its ID from the block's list.

Remove All Files (removeFiles)

—

Clears every file from the block at once.

File Uploader Form Field

When you need file upload as part of a form submission flow, use the File form field (the File Uploader) instead of the standalone block. It lives inside a Form block and participates in validation, reset, and the submit payload.

Key differences from the standalone block

  • Multiple vs. single mode: Controlled by the Allow multiple files toggle. Single mode stores one file object; multiple mode stores an array.

  • Validation: Maximum Files, Maximum File Size (MB), and Supported File Types live in the Validation section. Is Optional controls whether at least one file is required.

  • Value shape: Single mode — {{ form.data.key }} is one file object with the same fields as the block's file descriptor: id, name, url, size, mimeType, fileType, sourceType and source, plus type, which is always "FILE". Multiple mode — an array of such objects. Read .url or .id to pass to downstream queries.

  • Events: On Change (fires when a file finishes uploading or is removed), On Focus, On Blur.

  • Default value: Accepts an array of file objects for pre-filling the field. A dynamic default overwrites user-added files when the bound value changes.

File Uploader field properties

Property

Type

Default

Description

Allow multiple files

boolean

false

When on, multiple files allowed and value becomes an array.

Allow download

boolean

true

Shows a download action on each uploaded file row.

File visibility

Only me | Only this app | Restricted | Public

Restricted

Who can access stored files. The app's default applies if one is set.

Maximum files

number

—

Max count. Extra files are rejected with an error.

Maximum file size (MB)

number

—

Per-file size cap in megabytes.

Supported file types

array

—

Same catalog as the block; empty or Any File accepts everything.

Is optional

boolean

true

When off, at least one file must be attached before submit.

Behavior & Gotchas

The value is file descriptors, not raw binary data

What you get from {{ id.files }} is a list of descriptor objects — id, name, size, mime type, and a URL. There is no File object or byte stream available in no-code logic. To persist an upload, save the url or the storage id from the descriptor.

On File Uploaded fires once per batch, not once per file

Drop five files at once and the event fires a single time after the last file finishes, not five times. The block has no per-file event. To act on each file, handle it in On File Uploaded: read the {{ id.files }} list and process every file in it, for example in a Run Script action. Skip files whose hasError is true.

Uploaded files stay when a modal or drawer closes

Closing the modal or drawer that holds the block doesn't clear its files. When the block appears again, it shows the same files. The list is cleared only when the user leaves the page. Call the Remove All Files method after a successful save to reset the block.

You cannot pre-fill the block with existing files

The block always starts empty on every load. There is no content property that seeds it with previously uploaded files. To show files a record already has, use a separate display element (Image, attachment list, etc.); the File Upload block is for capturing new uploads only.

After the first file, the drop zone stops being click-to-upload

The empty state is fully clickable. Once one file is present, the card itself is no longer clickable. In multiple mode, an "Upload more" button stays available. In single mode, the user must remove the existing file before adding another.

A rejected file does not block others in the same batch

Files that fail type/size checks show an inline error instead of uploading. Other valid files in the same batch still upload normally — a rejection is per-file, not per-batch.

FAQs

How do I access the URL of an uploaded file to save it to a record?

For the standalone block, read {{ id.files[0].url }} for the first file's URL once the upload finishes. Before saving, check that {{ id.isUploading }} is false and that no file has hasError set to true, because a failed file has an empty url. For the form field in single mode, read {{ form.data.fieldKey.url }}. In multiple mode, loop over the array to collect each url.

Why does the On File Uploaded event only fire once even when I drop multiple files?

This is by design. The event fires once per batch — after all files in the current drop finish uploading, not once per individual file. The block has no per-file event. To act on each file, loop over {{ id.files }} in the On File Uploaded actions and skip any file whose hasError is true.

Can I restrict uploads to PDF and Word only, and prevent other types?

Yes. In File Restrictions → Supported File Types, select PDF and Word Document. Files of any other type will be rejected before upload with an inline error; valid files in the same drop still upload normally. The browser file picker will also be filtered to show only those types.

Does closing a modal clear the File Upload block's files?

No. The block's files stay when its modal or drawer closes, and they are still there the next time it opens. The list is cleared only when the user leaves the page. To reset the block, call the Remove All Files method after a successful save.

The file uploader form field shows an empty array in my data — why?

Removing the last file from the field stores an empty value (not an array), so "is this field filled" checks behave consistently in both single and multiple modes. Also confirm that your validation condition isn't treating an empty value as an array — when empty, the field holds undefined, not [].