Task backed components

Task backed components are the easiest way to fetch data or make backend mutations in a view.

Task backed components automatically execute a task or runbook, populate the component with data, and handle loading and error states.

Task backed components have a unique prop called task. This prop can take a few different values:

The simplest way to use a task backed component is to supply the slug of an Airplane task to the component.

This is only a viable option if the task has no parameters.

If a task has parameters, you can supply a full task request.

This method also allows you to add additional options to the request like adding a refetchInterval that refetches the task every 10s.

Sometimes you may want to transform the task output before it is displayed in a task backed component. Each task backed component has an outputTransform prop that allows you to transform the data before it is displayed by the component.

The following components can be task backed via the task prop:

If you want to fetch data from another component, see Manual task execution.