Button Script - Trigger API call, Poll Response and display loading will polling

Hi Everyone,

I am new to coding so this may be easy but trying to figure out the best way to do this.

I am using a button click script to trigger a query using query.trigger() and this will create an event in the endpoint. The trigger returns an ID, which I need to use in a second call to poll and wait until the process is complete (this is a document parsing API btw).

The response from the first query looks like this -
{
"message": "667b325291d3f49feae94b55"
}

The response from the second query looks like this when the file isn't done parsing:

{
"_id": "667b331d91d3f49feae94e85",
"name": "lock confirmation 30.pdf",
"content_type": "application/pdf",
"status": "parsing",
"created_at": "2024-06-25T21:14:05.440Z",
"processed_at": null,
"filename": "lock confirmation 30.pdf",
"credits": 0,
"json":
}

If you wait about 4-5 seconds and run the call again, the response changes to display the information:

"_id": "667b331d91d3f49feae94e85",
"name": "lock confirmation 30.pdf",
"content_type": "application/pdf",
"status": "parsed",
"created_at": "2024-06-25T21:14:05.440Z",
"processed_at": "2024-06-25T21:14:24.884Z",
"filename": "lock confirmation 30.pdf",
"credits": 3,
"json": {
"adjustments": "0.814",
"advanced_features": "--",
"agency_case_assignment_date": "--",
"amortization_term": "360",
"appraised_value": "435,000.00",
"arm_initial_fixed_term_months": "--",
"aus_recommendation": "Approve Eligible",
"aus_type": "DU",
"base_loan_amount": "300,000.00",
"base_price": "101.112",

-- cutting it here to show example.

My goal is to run the script and then trigger the first API call, get the ID from the response, then trigger the second call and poll until the parse is complete.

In the UI, I want to show a pop-up loading message with the spinning loading logo until the parsing is complete.

What's the best way to go about this?

Thanks in advance!

2 Likes

Hi there and welcome,

There's many ways that this can be achieved but it can get complicated pretty quickly too. My preference is to unlink the first action and the second action as much as possible and have them run as independent actions.

So, I'd have a POST query that sends the request to the first endpoint and stores the returned ID in a variable, that makes it available to other actions and the first query doesn't need to worry about what they do with it.

A second query to GET the completed document would "Run the query periodically" ( you can do this in the advanced tab of the query )
This second query should be disabled (again, in the advanced tab) if there isn't an ID to be requesting OR if the request has been fulfilled.

I've made a basic example for you to play with to try to explain it better.
Pressing the Post Message button will clear all old requests and trigger the insert query - this sends a UUID to the server and returns the id of the request which it saves in a variable.
When this variable is updated it makes the second query try to GET the UUID using the inserted id and it will repeatedly run until that response has been received.
A loading indicator will spin while either query is active.

Hope this gives you some ideas of how to proceed, but as I said there are multiple ways to solve this one.

forum.json (15.1 KB)

1 Like

I've been working on a similar issue - We have multiple different buttons that can trigger a query through a script - the Run script action is required to allow us to enhance the query with additional scope. We don't want every button on the page to have its loading state triggered when a seemingly unrelated button is clicked. I have tried several different things, including setting my own version of isFetching on the window, other global object, etc, but those don't seem to be triggering the loading state. We have taken great pains to simplify the data access patterns in this app, so making each button have its own query for the sake of a loading indicator, or have chained queries that don't need to exist is pretty frustrating. This seems to be a pretty commonly requested feature, is there any progress on this?

You might already be aware but, depending on the type of resource your query is using you can pass AdditionalScope to the query directly from the event dialog now rather than have to use Run Script
image

If all the buttons are triggering the same query then you'd definitely need to have some way of identifying which button triggered it - the query can only tell you if it's running or not.

ive found if your able to put the logic for pollng in a workflow, using a loop with the query to poll as the loop lambda, u can keep things off the main thread (useful for polling more than one source at the same time or just preventing loading locks in general). ull need to use JS script mode for the loop to put logic for different states after the request response. ill update w an example when im not on a phone

1 Like

Thanks @dcartlidge & @bobthebear !

@Timothy_Stephens & @rmerchant let us know if you're still working on your use cases