Data: API
You will add your external data and files at the top level - see Sources.
Then inside the app, simply click on the AVAILABLE tab, and + your data to your app. In the screenshot below, we could add Hubspot to our app.
Available external data is automatically added to your app when you are calling APIs as part of your variable definition.
If we inspect the App Data, we see a logo, handle, name, website, functions and actions.
The logo is self-explanatory.
We use the handle as a fast shortcut to lookup functions inside a source during variable definition.
The website gives you more information about the API/external data, so you may consult it.
While a source may have many functions, we only pull into the app whatever functions is needed, and show you that number in the Functions column.
If you wish to remove a data source, you may do so but if you already created variable based on it, whatever portion of your app was using it will become unusable — please check your app.
If you click on the Name of the source, you will see its details:
Let's break it down.
On the top right we have four sections:
|
LINK TO API allows to connect an app to your pre-defined APIs (e.g. when an app was migrated over from a different environment). |
|
SYNCH allows to re-inherit your global settings and reset your app API source from it. For example, when you switched your API key or changed authentication settings in your global source. |
|
SOURCE makes it easy to go to the global level to review your settings, then come back to the app context. |
|
BACK returns you to your App sources. |
Moving on down, the next section shows information about your source, and allows to define its timeout, preloader image/animation, and loading message.
The default timeout is 5 sec.
You may override as needed but keep in mind that there is an overall max timeout of 100 sec which cannot be exceeded for any individual function execution.
When timeout is 0, it means that the execution will go to the max timeout (bad UX practice).
Clicking on the eye icon shows a preview of how your preloader would look while the function executes.
App functions
Here we see the functions currently being used by our app.
You can see what type they are - POST, GET, PUT, PATCH, DELETE as per their definition.
Clicking on a function name provides direct control over the function definition. In the example below, to generate an image with OpenAI, we need to send a POST message with the specific payload.
The response type can be either json or file, based on the API return.
In the Settings section, you may override the timeout and preloader image/animation and message, as well as establish an error value that can be used for transition or variable logic.
You would typically replace values inside the payload with variables from your app.
Click TRY to check how your function is behaving, then TRY again once you made edits.
We get the results
If there are errors, we can learn about what caused them:
Since the operation actually succeeded, let's see the generated cute baby sea otter:
Library functions
All available functions are listed in this section. Simply add the functions you need to your app functions. Or, this will be done automatically when you are creating a variable that calls one of the library functions.