How to Integrate Retool with Doodle

Before configuring anything in Retool, you need API credentials from Doodle. Doodle's API access is available through their developer program. Navigate to the Doodle developer documentation at doodle.com/api/v2.0/doc and review the authentication requirements. Doodle issues OAuth 2.0 access tokens or API tokens depending on your account type and plan level. For organizational or team accounts, you can typically generate a token through your Doodle account settings under the API or integrations section — look for 'API Access' or 'Developer Settings'. If you are on a business plan, contact Doodle support to request API access, as it may need to be enabled for your organization. Once you have your Bearer token or OAuth access token, copy it somewhere safe temporarily. You will paste it into Retool in the next step. Note that Doodle's API may require HTTPS and enforces rate limits — typically allowing several hundred requests per hour depending on your plan tier. If your organization does not yet have API access, Doodle's basic polling data can also be accessed through their public API for specific poll IDs without authentication, though authenticated access gives you full organizational visibility across all polls created by your team.

In Retool, navigate to the Resources tab in the left sidebar of your organization homepage. Click '+ Create new' or '+ Add resource', scroll through the connector list, and select 'REST API'. On the resource configuration screen, fill in the following fields: in the Name field, enter something descriptive like 'Doodle API' so it is easy to identify in the query editor later. In the Base URL field, enter https://api.doodle.com/api/v2.0 — this is the base path for Doodle's REST API v2. For Authentication, select 'Bearer token' from the dropdown and paste your Doodle access token into the token field. If Doodle requires additional headers for your account type, click 'Add header' and enter any required values such as Accept: application/json or Content-Type: application/json. Leave all other fields at their defaults for now — no additional URL parameters or custom auth flows are needed for basic poll access. Scroll down and click 'Save resource'. Retool saves the resource and makes it available to all apps in your organization. All requests made through this resource are proxied server-side by Retool's backend, meaning your Bearer token is never transmitted to end users' browsers. If you need to connect to a different Doodle environment or test with a separate set of credentials, simply create an additional REST API resource with a different name.

Open the Retool app where you want to display Doodle data, or create a new app from the Apps tab. In the Code panel at the bottom, click '+ New query' and select your Doodle API resource. For listing all polls associated with your account, set the Method to GET and the URL path to /polls. Add any relevant URL parameters: the Doodle API may support filtering by status (open, closed), by organizer, or by date range — check the specific query parameter names in Doodle's API documentation. For fetching details of a specific poll including participant responses, create a second query with Method GET and URL path /polls/{{ pollIdInput.value }} — where pollIdInput is a TextInput component on your canvas. This returns the full poll object including the list of options, participants, and their availability selections. Name your list query getPolls and your detail query getPollDetails. Run each query by clicking the Run button to confirm the responses are structured as expected. Doodle's API returns JSON with poll objects containing fields for id, title, organizer, options (time slots), participants, and status. Use the response preview in the query editor to understand the exact field names before building your transformer in the next step.

1{
2  "method": "GET",
3  "path": "/polls",
4  "params": {
5    "status": "open",
6    "limit": "50"
7  }
8}

Doodle's API returns poll data in a nested format that is not directly suitable for Retool's Table component. Each poll contains an array of options (time slots) and a participants array where each participant has an array of preference values (yes, yes_if_need_be, no) corresponding to each time slot. You need a JavaScript transformer to flatten this into rows suitable for display. In the query editor for your getPolls query, click the 'Advanced' tab and toggle on 'Transform results'. Write a transformer that maps each poll object to a flat row with the key metadata fields. For the detail view showing participant responses per time slot, write a second transformer on getPollDetails that pivots the data — creating one row per participant with columns for each time slot option and that participant's preference. Drag a Table component from the component panel onto the canvas. Set its Data source to {{ getPolls.data }} to display the list of polls. Add a column for response rate (calculated as respondents / total invitees * 100). When a row is clicked, the getPollDetails query fires via an event handler, and a second Table below or a Container with TextInput components shows the detail view. Configure the Table's row selection event handler: click the Table component → Event Handlers → Add handler → Action: Trigger query → select getPollDetails.

1// Transformer: flatten poll list into table rows
2const polls = data.polls || data || [];
3return polls.map(poll => ({
4  id: poll.id,
5  title: poll.title || 'Untitled Poll',
6  organizer: poll.organizer?.name || poll.organizer || 'N/A',
7  status: poll.state || poll.status || 'unknown',
8  options_count: (poll.options || []).length,
9  respondents: (poll.participants || []).filter(p => p.availability).length,
10  total_invitees: (poll.participants || []).length,
11  response_rate: (poll.participants || []).length > 0
12    ? Math.round(((poll.participants || []).filter(p => p.availability).length / (poll.participants || []).length) * 100) + '%'
13    : 'N/A',
14  created: poll.created ? new Date(poll.created).toLocaleDateString() : 'N/A',
15  finalized_time: poll.finalizedSlot ? new Date(poll.finalizedSlot).toLocaleString() : 'Not yet finalized'
16}));

For a fully functional scheduler dashboard, you need a detail view that shows exactly which participants are available for which time slots. This view is best built as a Container component below the poll list table, shown only when a poll is selected. Drag a Container component onto the canvas and position it below the polls Table. Inside the container, add a second Table component. Set its Data source to {{ getPollDetails.data }} — this table will show one row per participant with their availability for each time slot. Add a Text component at the top of the container showing 'Responses for: {{ pollTable.selectedRow.title }}' to provide context. To show the count of 'Yes' responses per time slot, add a JavaScript transformer on getPollDetails that aggregates availability counts: iterate over all time slot options, count how many participants selected 'yes' for each slot, and return an array of slot objects with title and yes_count. Bind a Bar Chart component to this aggregated data to visually highlight the most popular time slots. Add a Button component labeled 'Copy Best Time' with an event handler that calls clipboard copy on the slot with the highest yes count. For teams managing many polls simultaneously, consider adding a filter TextInput above the polls table that dynamically filters by organizer name using {{ getPolls.data.filter(p => p.organizer.includes(filterInput.value)) }}. For complex integrations involving multiple scheduling tools, custom transformers, and notification workflows, RapidDev's team can help architect and build your Retool solution.

1// Transformer: aggregate yes votes per time slot
2const poll = data;
3const options = poll.options || [];
4const participants = poll.participants || [];
5
6return options.map((option, idx) => {
7  const yesCount = participants.filter(p => {
8    const pref = Array.isArray(p.availability) ? p.availability[idx] : null;
9    return pref === 1 || pref === true || pref === 'yes';
10  }).length;
11  const ifNeededCount = participants.filter(p => {
12    const pref = Array.isArray(p.availability) ? p.availability[idx] : null;
13    return pref === 2 || pref === 'yes_if_needed';
14  }).length;
15  return {
16    slot: option.start ? new Date(option.start).toLocaleString() : `Option ${idx + 1}`,
17    yes_votes: yesCount,
18    if_needed_votes: ifNeededCount,
19    total_available: yesCount + ifNeededCount,
20    no_votes: participants.length - yesCount - ifNeededCount
21  };
22}).sort((a, b) => b.total_available - a.total_available);

Production Doodle dashboards need proper error handling and data refresh logic. Doodle API tokens may expire depending on the authentication method used — OAuth 2.0 tokens typically expire after an hour, while longer-lived tokens may need periodic rotation. Implement the following patterns in your Retool app. First, add error handling on your main getPolls query: in the Query editor → Failure tab, add an event handler that shows a notification with the message 'Failed to load polls — token may have expired. Update the Doodle API resource credentials.' using Show notification action. Second, add a Refresh button above the polls table: drag a Button component labeled 'Refresh Polls', and in its onClick event handler, trigger the getPolls query. This allows users to manually reload data without refreshing the entire browser page. Third, enable automatic query refresh: in the getPolls query editor → Advanced tab, check 'Run query on a schedule' and set the interval to 300000 ms (5 minutes) so the dashboard stays current without manual refreshes. Fourth, configure the query's Trigger mode — set it to 'Automatic' so it runs when the app loads. For apps where users need to filter polls by date range, add two DatePicker components and pass their values as URL parameters on the getPolls query using {{ datePicker1.value }} and {{ datePicker2.value }}. Retool will re-run the query automatically whenever the date picker values change if the query is set to trigger on input change.