How to Integrate Retool with Dropbox

Navigate to https://www.dropbox.com/developers/apps and sign in with your Dropbox account. Click Create app. Select the Scoped access API (the current Dropbox API). Choose the access type: Full Dropbox gives access to all files; App folder restricts access to a dedicated folder — for operations dashboards, Full Dropbox access is generally required. Give your app a name like 'Retool Integration'. Click Create app. On the app settings page, you will see the API key, API secret, and an OAuth 2.0 section. For server-to-server integrations, you can generate a long-lived access token: scroll to the OAuth 2.0 section and click Generate access token under the 'Generated access token' heading. This creates a token linked to your Dropbox account. For Dropbox Business team features, enable the relevant scopes in the Permissions tab: files.content.read and files.content.write for file operations, sharing.read and sharing.write for shared links, team_data.member for team member information, and events.read for activity logs. After enabling scopes, click Submit. Note that changing scopes may invalidate existing tokens — regenerate after scope changes. Copy the access token. For production use with Dropbox Business, consider using OAuth 2.0 with a service account rather than a personal access token tied to an individual employee.

Dropbox API v2 uses two different base URLs depending on the operation type: https://api.dropboxapi.com/2/ for most API calls (list folders, create shared links, team operations) and https://content.dropboxapi.com/2/ for file upload and download operations (files/upload, files/download). For a general-purpose Dropbox resource, use the API base URL and create a separate resource for content operations if needed. In Retool, navigate to Resources → Add Resource → REST API. Name it 'Dropbox API'. Set the Base URL to https://api.dropboxapi.com/2. In Authentication, select Bearer Token and paste your Dropbox access token. Add a default header: Content-Type with value application/json. Click Save Changes. A key thing to understand about Dropbox API v2: all operations use POST requests regardless of whether they are reads or writes. The path in your Retool query (e.g., /files/list_folder) tells Dropbox which operation to perform, and the JSON body contains the parameters. There are no GET requests with query string parameters in Dropbox API v2. This is different from most REST APIs and means every Retool query targeting Dropbox will use the POST method.

Create a query named 'listFolder'. Set Method to POST. Path to /files/list_folder. In the Body section, set Body Type to JSON and enter the request body. The main parameter is 'path' — set to '' (empty string) for the root folder or {{ '/' + currentPath.value }} for a specific path. Additional options: 'recursive': false for single-level listing, 'limit': 100 for pagination. Create a transformer to separate folders from files and format metadata. To navigate into folders, create a State variable named 'currentPath' that tracks the current folder path. Add an onClick event handler to folder rows in the Table that updates currentPath.value and re-triggers listFolder. For search, create a query named 'searchFiles' — POST to /files/search_v2. Body: { 'query': '{{ searchInput.value }}', 'options': { 'max_results': 50, 'file_status': 'active' } }. For getting more detail on a single file, create 'getFileMetadata' — POST /files/get_metadata, body: { 'path': '{{ filesTable.selectedRow.path_display }}', 'include_media_info': false, 'include_deleted': false }.

1// Request body for listing a Dropbox folder
2{
3  "path": "{{ currentPath.value ? '/' + currentPath.value : '' }}",
4  "recursive": false,
5  "include_media_info": false,
6  "include_deleted": false,
7  "include_has_explicit_shared_members": true,
8  "limit": 100
9}

Shared link management is a core Dropbox operations use case. Create a query named 'listSharedLinks'. Set Method to POST, Path to /sharing/list_shared_links. Body: { 'path': '{{ filesTable.selectedRow?.path_display || "" }}', 'direct_only': false }. Without a path, this returns all shared links for the account. Create a transformer that extracts the link URL, expiry, link_permissions, and type (file/folder). Create a query 'createSharedLink' — POST /sharing/create_shared_link_with_settings. Body: { 'path': '{{ filesTable.selectedRow.path_display }}', 'settings': { 'requested_visibility': '{{ linkVisibilitySelect.value }}', 'expires': '{{ linkExpiryPicker.value ? new Date(linkExpiryPicker.value).toISOString() : undefined }}' } }. Add a Modal to the dashboard with a Form for shared link creation: a Select for visibility (public/team_only/password), a Date Picker for expiry, and optionally a Password input. After creating, display the resulting URL in a Text component with a copy button. For revoking links, create 'revokeSharedLink' — POST /sharing/revoke_shared_link, body: { 'url': '{{ sharedLinksTable.selectedRow.url }}' }. Add a Confirm Modal before triggering revoke since the operation is irreversible.

1// Transformer: normalize Dropbox shared links for Table display
2const links = data.links || [];
3return links.map(link => ({
4  id: link.id,
5  url: link.url,
6  name: link.name,
7  path: link.path_display || link.path_lower,
8  type: link['.tag'] === 'folder' ? 'Folder' : 'File',
9  visibility: link.link_permissions?.resolved_visibility?.['.tag'] || 'public',
10  expires: link.expires
11    ? new Date(link.expires).toLocaleDateString()
12    : 'Never',
13  created: link.client_modified
14    ? new Date(link.client_modified).toLocaleDateString()
15    : 'Unknown'
16}));

For Dropbox Business accounts, the team events API provides an audit log of file and sharing activities across the entire team. Create a query named 'getTeamEvents'. Set Method to POST, Path to /team_log/get_events. Body: { 'limit': 100, 'time': { 'start_time': '{{ dateRange.startDate ? new Date(dateRange.startDate).toISOString() : new Date(Date.now() - 7*24*60*60*1000).toISOString() }}', 'end_time': '{{ dateRange.endDate ? new Date(dateRange.endDate).toISOString() : new Date().toISOString() }}' }, 'category': '{{ eventCategoryFilter.value || undefined }}' }. The category filter accepts values like 'file_operations', 'sharing', 'team_policies', 'logins' for event type filtering. Add a Select component for categories. Build a transformer that extracts event time, event type (from event_type['.tag']), actor name, and details. Display in a Table with color-coded event type badges. Add a Chart showing event volume per day using a grouped aggregate of the transformer output. For team member storage usage, create a separate query — POST /team/members/list/v2, body: { 'limit': 100, 'include_removed': false } — then for each member POST /team/members/get_info to get storage quota details. Use a Retool Workflow for the multi-member storage audit to avoid hitting rate limits in the app.

1// Transformer: reshape Dropbox team events for display
2const events = data.events || [];
3return events.map(event => {
4  const actor = event.actor?.user?.email
5    || event.actor?.admin?.email
6    || event.actor?.['.tag']
7    || 'System';
8  const details = event.details;
9  const eventTag = event.event_type?.['.tag'] || 'unknown';
10
11  return {
12    timestamp: new Date(event.timestamp).toLocaleString(),
13    event_type: eventTag.replace(/_/g, ' '),
14    actor,
15    context: event.context?.['.tag'] || 'N/A',
16    summary: event.event_type?.description || eventTag
17  };
18});