Function Node

Functions allow you to perform actions within Dynaboard.

When creating a function, you'll specify both a resource and action on that resource you would like to have performed. From there, Dynaboard will walk you through configuring the action. You can use binding expressions in almost any field within the function editor. Wire up function nodes using event handlers, chain them together, or invoke them programmatically.

Functions are designed to be lightweight and flexible, so create as many as you'd like. Evaluation of the function is resource and action type-dependent, but the results are always the same: data, error, and extra.

Using functions

Functions must be invoked explicitly, either on page load, via an event handler, or programmatically.

Calling on page load

Set the "Run on page load" property (runOnPageLoad) to true to run the function on page load.

Calling via event handlers

Functions can be used as event handlers to perform actions when something occurs within the application.

Within the Events tab of any element, you can select your function from the dropdown menu. Simple as that!

Calling programmatically

You can invoke functions programmatically using the TypeScript Client Resource. All invocations return a Promise value, so you'll have to await them before using their results.

For example, if you have a function named myFunction, you can invoke it by doing:

const { data, error, extra } = await myFunction()
// do what you need to do...
return data

Evaluation semantics

Dynaboard transparently handles both client-side and server-side evaluated function. Whether or not a function is server-side or client-side depends on the resource to which it is attached.

Server-side functions

For server-side functions, Dynaboard will take care of generating a parameterized API for you if you use binding expressions.

Dynaboard acts as a proxy, returning the results back to the client. Any TypeScript code that appears in {{ double_curlies }} will be evaluated client-side before being serialized and sent to the server. The Dynaboard server will handle interpolating these values into your functions.

Client-side functions

For client-side functions, Dynaboard evaluates the entire function server-side without making an intermediate call to the Dynaboard server.

Properties

Enabled

PropfunctionNode.isEnabled
Typeboolean
Default{{true}}

Whether or not this function is runnable

Data

PropfunctionNode.data
Typeunknown
Defaultundefined

The latest data returned by the function. Every resource / action type will populate this value differently, so consult the resource's documentation for more information about the shape of this property.

Error

PropfunctionNode.error
Typeunknown
Defaultundefined

The latest error message thrown by the function. If no error was returned (such as in the case of a successful evaluation), this will be undefined.

Extra

PropfunctionNode.extra
Typeunknown
Defaultundefined

The latest extra metadata returned by the function. Every resource / action type will populate this value differently, so consult the resource's documentation for more information about the shape of this property.

Loading

PropfunctionNode.loading
Typeboolean
Default{{false}}

Whether or not the function is currently executing or awaiting results

Action

PropfunctionNode.action
Typeunknown
Defaultundefined

The specification for the action to be evaluated when the function is called. Actions are defined by a reference to a resource and an action on that resource, along with any other properties required by that action.

Draft Action

PropfunctionNode.draftAction
Typeunknown
Defaultundefined

The unsaved draft specification for the action to be evaluated when the function is called. Only used for testing functions within the editor experience.

Run Function

PropfunctionNode.callingSemantics
TypeFunctionRunType ('IMPERATIVE' | 'REACTIVE')
DefaultIMPERATIVE

Functions can be run when called via an event handler, on page load (if specified), or from another function. Automatically-run functions run on page load, and then again every time the function or any of its dependent properties change.

Limiter Type

PropfunctionNode.debounceMethod
TypeDebounceMethod ('NONE' | 'DEBOUNCE' | 'THROTTLE')
DefaultDEBOUNCE

Debounce waits until the specified number of milliseconds has elapsed since the last change before triggering the function. Throttle triggers the function as soon as there is a change, and then will not trigger again until there has been the specified number of milliseconds since it last triggered. None will trigger the function on every change.

Limiter Timing

PropfunctionNode.debounceMillis
Typenumber
Default0

The amount of time in milliseconds to consider for the debounce method above

On Page Load

PropfunctionNode.runOnPageLoad
Typeboolean
Default{{false}}

Whether or not to automatically run the function upon page load. If false (the default), the function will not be invoked until explicitly called by an event handler.

Event Handlers

On Success

HandlerfunctionNode.onSuccess

The event handler to be called upon the successful completion of the function. This property can be used to chain function calls.

On Failure

HandlerfunctionNode.onFailure

The event handler to be called upon the failure of the function. This property can be used to handle errors in function calls.