How to Integrate Retool with Monday.com

Before creating a Retool Resource, you need a Monday.com personal API token. Log into Monday.com and click on your avatar in the bottom-left corner, then select 'Developers' from the menu. This opens the Developer Center. Click 'My Access Tokens' in the left sidebar, then click 'Show' next to the API v2 Token field. Copy this token — it is a long alphanumeric string starting with 'eyJhbGciOiJIUzI1NiJ9' or similar. This token authenticates all API calls and has the same permissions as your Monday.com account. Treat it like a password: store it in Retool's configuration variables, not in query code directly. Note that Monday.com also supports OAuth for team-level credentials, but personal access tokens are simpler for internal Retool tools where a single service account can own the integration.

In your Retool workspace, navigate to the Resources tab in the top navigation and click 'Create New' → 'Resource'. Scroll through the list or search for 'GraphQL' — Retool has a dedicated GraphQL resource type, distinct from the generic REST API resource. Select it. In the configuration panel, set the Base URL to 'https://api.monday.com/v2'. This is Monday's single GraphQL endpoint — all queries and mutations go to this same URL. Under 'Headers', click 'Add header' and add two headers: the first with key 'Authorization' and value 'Bearer YOUR_TOKEN_HERE' (replace with the token from Step 1), and the second with key 'Content-Type' and value 'application/json'. Optionally, add an 'API-Version' header with value '2024-01' to pin to a specific Monday.com API version and avoid unexpected breaking changes. Name the resource 'Monday.com GraphQL' or similar. Click 'Test connection' — Retool will send a test introspection query. If successful, you will see a green checkmark. Click 'Create resource' to save.

1{
2  "Base URL": "https://api.monday.com/v2",
3  "Headers": {
4    "Authorization": "Bearer {{ retoolContext.configVars.MONDAY_API_TOKEN }}",
5    "Content-Type": "application/json",
6    "API-Version": "2024-01"
7  }
8}

Open or create a Retool app. In the Code panel, click 'New query' and select your 'Monday.com GraphQL' resource. Retool's GraphQL query editor loads and automatically introspects the Monday.com schema, so you will see the available types in a schema explorer on the right. Write a GraphQL query to fetch your boards and their items. The Monday.com API uses the 'boards' query type as the primary entry point — you specify board IDs in the 'ids' argument or omit them to fetch all accessible boards. Each board contains 'items_page' (paginated items) and each item contains 'column_values' for field data. Run the query to confirm it returns data. The response will be nested JSON that you will reshape in the next step using a transformer.

1query GetBoardItems($boardId: ID!, $cursor: String) {
2  boards(ids: [$boardId]) {
3    id
4    name
5    items_page(limit: 50, cursor: $cursor) {
6      cursor
7      items {
8        id
9        name
10        state
11        created_at
12        updated_at
13        group {
14          id
15          title
16        }
17        column_values {
18          id
19          text
20          value
21          column {
22            title
23            type
24          }
25        }
26      }
27    }
28  }
29}

Monday.com's GraphQL API returns deeply nested JSON — items contain a 'column_values' array where each element represents a board column. To use this data in a Retool Table or Chart, you need to flatten it into a simple array of objects. Open the query's Advanced tab and click 'Add transformer'. Write a JavaScript transformer that maps over the items array and converts column_values into named properties. This makes the data directly bindable to Retool Table columns. For status columns, the 'text' field contains the label. For date columns, parse the 'value' field which is a JSON string containing a 'date' key. For people columns, 'text' contains the assignee name. The transformer runs automatically whenever the query data changes, and the result replaces query.data throughout your app.

1// Transformer: flatten Monday.com GraphQL response
2const boards = data.boards || [];
3if (boards.length === 0) return [];
4
5const items = boards[0].items_page.items || [];
6
7return items.map(item => {
8  // Convert column_values array to an object keyed by column title
9  const cols = {};
10  (item.column_values || []).forEach(cv => {
11    cols[cv.column.title] = cv.text || '';
12  });
13
14  return {
15    id: item.id,
16    name: item.name,
17    state: item.state,
18    group: item.group?.title || '',
19    status: cols['Status'] || '',
20    owner: cols['Person'] || cols['Owner'] || '',
21    due_date: cols['Due Date'] || cols['Date'] || '',
22    priority: cols['Priority'] || '',
23    created_at: new Date(item.created_at).toLocaleDateString()
24  };
25});

Now that your data is flowing, build the dashboard layout. Drag a Table component onto the canvas and set its 'Data source' to {{ getBoardItems.data }}. Enable column filtering so users can filter by status or owner. Add a Chart component above the table — set its type to 'Bar' and configure it to aggregate item counts by status. For the Chart data, create a new JavaScript query (no resource needed) that groups items by status field. Add a TextInput component at the top for board ID input so users can switch between boards without editing query variables — bind the GraphQL query's boardId variable to {{ boardIdInput.value }}. Add event handlers to automatically re-run the board query whenever boardIdInput changes. For the mutation flow (updating an item's status), add a Button and create a second GraphQL query that runs the change_column_value mutation on the selected table row.

1// JavaScript query for Chart data: group items by status
2const items = getBoardItems.data || [];
3const counts = {};
4
5items.forEach(item => {
6  const status = item.status || 'No Status';
7  counts[status] = (counts[status] || 0) + 1;
8});
9
10return Object.entries(counts).map(([status, count]) => ({
11  status,
12  count
13}));

A read-only dashboard is useful, but the real productivity gain comes from enabling status updates directly in Retool. Create a new query using the Monday.com GraphQL resource and write a change_column_value mutation. This mutation requires the board ID, item ID, column ID, and the new value formatted as a JSON string. The column ID for a status column is typically 'status' or a custom identifier visible in Monday's board settings under 'Customize columns'. Bind the mutation's item_id argument to {{ table1.selectedRow.id }}, the board_id to the same boardId variable used in the read query, and the value to a JSON string with the label index. Wire this mutation to a Button component's click event, and on success, trigger the read query to refresh the table. Add a Select component to let users choose the new status value from a dropdown bound to the mutation's value input.

1mutation UpdateItemStatus($boardId: ID!, $itemId: ID!, $columnId: String!, $value: JSON!) {
2  change_column_value(
3    board_id: $boardId
4    item_id: $itemId
5    column_id: $columnId
6    value: $value
7  ) {
8    id
9    name
10    column_values {
11      id
12      text
13    }
14  }
15}