Introduction

Storing multiple files selected via Google Drive in your Bubble.io database involves setting up the proper database structure and using API workflows to ensure the data is saved correctly and is accessible later.

Database Configuration

1. Create a Data Type for Files

• Data Type Name:

  • For example, GoogleDriveFile (or any name you prefer).

2. Define Fields for the Data Type

Workflow Configuration to Save Files

1. Create an API Workflow in Bubble.io

• Workflow Name:

  • For example, save_google_drive_files.

• Workflow Type:

  • Private (if used internally).

• Workflow Parameters:

  • file_ids (List of texts)

  • file_names (List of texts)

  • file_mime_types (List of texts)

  • file_urls (List of URLs)

  • file_thumbnails (List of URLs)

  • file_sizes (List of numbers)

  • file_owners (List of texts)

2. Configure the API Workflow

Step 1: Create a New Record in GoogleDriveFile

• Action: Data > Create a new thing

• Thing Type: GoogleDriveFile

• Field Setup:

  • name: Current Workflow's file_names:item#

  • file_id: Current Workflow's file_ids:item#

  • mime_type: Current Workflow's file_mime_types:item#

  • url: Current Workflow's file_urls:item#

  • thumbnail_url: Current Workflow's file_thumbnails:item#

  • size_bytes: Current Workflow's file_sizes:item#

  • owner: Current Workflow's file_owners:item#

  • created_at: Current date/time

• Note:

  • Use a looping mechanism or repetitive action to iterate over the provided lists.

3. Configure the onFilesSelected Event to Call the API Workflow

Steps in the Workflow Editor:

1. Event: When the onFilesSelected event is triggered by the plugin.

2. Action: Call the API Workflow save_google_drive_files.

3. Configure Parameters:

   • file_ids: Google Drive Picker's file_ids

   • file_names: Google Drive Picker's file_names

   • file_mime_types: Google Drive Picker's file_mime_types

   • file_urls: Google Drive Picker's file_urls

   • file_thumbnails: Google Drive Picker's file_thumbnails

   • file_sizes: Google Drive Picker's file_sizes

   • file_owners: Google Drive Picker's file_owners

Considerations for Iteration

• Ensure that all lists (e.g., file_ids, file_names, etc.) have the same length and corresponding order to avoid inconsistencies.

• Use Bubble.io functions to iterate over the lists and call the API Workflow appropriately.

Practical Example

1. File Selection Example

Suppose a user selects three files using the Picker:

• File 1:

  • name: "Annual Report.pdf"

  • file_id: "1A2B3C4D5E"

  • mime_type: "application/pdf"

  • url: https://drive.google.com/uc?id=1A2B3C4D5E&export=download

  • thumbnail_url: null (not applicable)

  • size_bytes: 204800

  • owner: "Juan Pérez"

• File 2:

  • name: "Product Photo.jpg"

  • file_id: "6F7G8H9I0J"

  • mime_type: "image/jpeg"

  • url: https://drive.google.com/uc?id=6F7G8H9I0J&export=download

  • thumbnail_url: https://drive.google.com/thumbnail?id=6F7G8H9I0J

  • size_bytes: 102400

  • owner: "María López"

• File 3:

  • name: "Q1 Presentation.pptx"

  • file_id: "K1L2M3N4O5"

  • mime_type: "application/vnd.openxmlformats-officedocument.presentationml.presentation"

  • url: https://drive.google.com/uc?id=K1L2M3N4O5&export=download

  • thumbnail_url: null (not applicable)

  • size_bytes: 512000

  • owner: "Carlos García"

2. Workflow Process

• Event: onFilesSelected is triggered with details of the three files.

• Action: The API Workflow save_google_drive_files is called with the corresponding lists.

• Result: Three records are created in the GoogleDriveFile database with the provided information.