Common UI kit components
Confluence UI kit components
Jira UI kit components
Jira Service Management UI kit components

Rate this page:

DashboardGadget

The DashboardGadget component is returned from a function defined in the app manifest to render content for a dashboard gadget.

This component can be used in Jira Core, Jira Software, and Jira Service Desk to render the gadget in the Dashboards page.

You can also use the DashboardGadgetEdit component to extend the gadget to save a configuration.

Import statement

1
2
import ForgeUI, { DashboardGadget } from "@forge/ui";

Props

NameTypeRequiredDescription
childrenArrayYesThe view code for the dashboard gadget. Can contain any UI Kit component.

Example

An example of a dashboard gadget component that displays a hello message. The user can input a name in the edit mode of this app that is used in the message; otherwise, the message says "Hello world."

1
2
import ForgeUI, {
  render,
  DashboardGadget,
  Text,
  useProductContext,
} from "@forge/ui";

const App = () => {
  const {
    extensionContext: { gadgetConfiguration },
  } = useProductContext();

  return (
    <DashboardGadget>
      <Text
        content={`Hello ${gadgetConfiguration.name || "world"}`}
      />
    </DashboardGadget>
  );
};

export const run = render(<App />);

Preview

This is the dashboard gadget view created by the example code.

A dashboard gadget in view mode.

See DashboardGadgetEdit for an example of an editable gadget.

Rate this page: