📦 Storage

Easily manage the Supabase object store.

You can use the Supabase Storage component to interact with the storage functions offered by Supabase.

Setup

Add the element Supabase Storage to your page and configure the following field:

Name
Data type
Type
App Data
Description
Select "Storage (Supabase)" for this field. This type is automatically defined by the Supabase plugin and allows for exposing buckets, files, signed URLs and uploads. The state data will eventually replace the current states (Buckets, Files, and Uploads) in future versions of the plugin.

States

The element exposes the following states:

Status Code
Status Message
Last signed URL: set after calling the action 'Create Signed URL'
Data: exposes a list of buckets, files, signed URLs and uploads data.
Buckets (Deprecated): names of the buckets within your Supabase project
Files(Deprecated): names of the files within a bucket
Uploads (Deprecated): names of the files uploaded with the "Upload file to bucket" action.

Events

The element triggers the following event:

Call Success: triggered when a call to the storage service successfully completes
Call Error: triggered when a call to the storage service encounters an error
List buckets success: triggered when the list of buckets has been successfully retrieved.
List buckets error: triggered when an error occurred while listing buckets.
List files success: triggered when the list of files has been successfully retrieved.
List files error: triggered when an error occurred while listing files.
Create signed URL success: triggered when the signed URL has been successfully created.
Create signed URL error: triggered when an error occurred while creating the signed URL.
Upload file success: triggered when a file has been successfully uploaded.
Upload file error: triggered when an error occurred while uploading a file.
Move file success: triggered when a file has been successfully moved.
Move file error: triggered when an error occurred while uploading a file.
Copy file success: triggered when a file has been successfully copied.
Copy file error: triggered when an error occured while copying a file.

Upload file to bucket

Upload a file to a bucket. You can configure the following fields:

Name
Bucket Name
Type
string
Description
Bucket name
Name
Path
Type
string
Description
The file path, without the file name. Should be of the format folder/subfolder/.
Name
Filename
Type
string
Description
Custom filename, optionally including the extension (e.g., picture1.png). If the "Append File Extension" option is enabled, the original file extension will be automatically appended if not included (e.g., 'picture1' becomes 'picture1.png'). Leave empty to use the default file name.
Name
Randomize Filename
Type
boolean
Description
When this option is enabled, the plugin appends a random UUID string as a suffix to the filename before uploading (e.g., picture.png becomes picture-"uuid".png).
Name
Append File Extension
Type
boolean
Description
Automatically append the file extension if the filename does not contain it.
Name
Allow Overwrite
Type
boolean
Description
When this is set to true, the file is overwritten if it exists. When set to false, an error is thrown if the object already exists.
Name
File
Type
File
Description
File to upload.

Create a bucket

Creates a new storage bucket. You can configure the following fields:

Name
Bucket Name
Type
string
Description
Bucket name
Name
Is Bucket Public?
Type
boolean
Description
The visibility of the bucket. Public buckets don't require an authorization token to download objects, but still require a valid token for all other operations.
Name
Allowed Mime Types
Type
string
Description
Specifies the allowed mime types that this bucket can accept during upload (Comma separated values - e.g "image/png, image/jpeg"). Each mime type specified can be a wildcard, e.g. "image/*", or a specific mime type, e.g. "image/png".
Name
File Size Limit
Type
number
Description
Specifies the max file size in bytes that can be uploaded to this bucket.

List buckets

Retrieve the names of all the storage buckets within your Supabase project.

Update bucket

Updates a storage bucket. You can configure the following fields:

Name
Bucket Name
Type
string
Description
Bucket name
Name
Is Bucket Public?
Type
boolean
Description
The visibility of the bucket. Public buckets don't require an authorization token to download objects, but still require a valid token for all other operations.
Name
Allowed Mime Types
Type
string
Description
Specifies the allowed mime types that this bucket can accept during upload (Comma separated values - e.g "image/png, image/jpeg"). Each mime type specified can be a wildcard, e.g. "image/*", or a specific mime type, e.g. "image/png".
Name
File Size Limit
Type
number
Description
Specifies the max file size in bytes that can be uploaded to this bucket.

Delete bucket

Deletes an existing bucket. You can configure the following fields:

Name
Bucket Name
Type
string
Description
Bucket name

A bucket can't be deleted with existing objects inside it.

Empty bucket

Removes all objects inside a single bucket. You can configure the following fields:

Name
Bucket Name
Type
string
Description
Bucket name

List files

Lists all the files within a bucket. You can configure the following fields:

Name
Bucket Name
Type
string
Description
Bucket name
Name
Path
Type
string
Description
The base path inside the bucket
Name
Search
Type
string
Description
The search string to filter files by
Name
Limit
Type
number
Description
The maximum number of files you want to be returned
Name
Offset
Type
number
Description
The starting position
Name
Sort By Column
Type
string
Description
The column to sort by. Can be any column inside a FileObject.
Name
Sort By Order
Type
Dropdown
Description
Order (ASC or DESC)

Create signed URL

Creates a signed URL. Use it to share a file for a fixed amount of time. You can configure the following fields:

Name
Bucket Name
Type
string
Description
Bucket name
Name
Path
Type
string
Description
The file path, including the current file name. For example "folder/image.png"
Name
Expires In
Type
number
Description
The number of seconds until the signed URL expires. For example, "120" for a URL which is valid for two minutes
Name
Download
Type
boolean
Description
Triggers the file as a download if set to true
Name
Download Name
Type
string
Description
Set this parameter as the name of the file if you want to trigger the download with a different filename
Name
Transform Format
Type
dropdown
Description
Specify the format of the image requested. When using 'origin', force the format to be the same as the original image
Name
Transform Width
Type
number
Description
The width of the image in pixels
Name
Transform Height
Type
number
Description
The height of the image in pixels
Name
Transform Quality
Type
number
Description
Set the quality of the returned image. A number from 20 to 100, with 100 being the highest quality
Name
Transform Resize
Type
dropdown
Description
Resize options are cover, contain, or fill, defaulting to cover. Cover maintains aspect ratio while filling width and height. Contain fits the entire image within the dimensions, keeping aspect ratio. Fill stretches the image to fill width and height, altering aspect ratio if needed

Delete files

Delete files in a bucket. You can configure the following fields:

Name
Bucket Name
Type
string
Description
Bucket name
Name
Path
Type
string
Description
A string of file paths to delete, each separated by a new line.

Upload file to bucket

Upload a file to a bucket using the Bubble.io uploader component.

Download a file from bucket

Downloads a file from a bucket.

Move an existing file

Moves an existing file to a new path in the same bucket.

Copy an existing file

Copies an existing file to a new path in the same bucket.

Reset

Reset the component states.

Do you need any help? Feel free to reach out