Configure the tool panel - Atoti Hub

The tools are located on the left of the application, when the user is viewing a dashboard. By default, they include:

Fields
Filters
Style

@activeviam/atoti-ui-sdk exports additional tools which can be plugged into Atoti UI:

To learn how to make these tools available in your application, see activate the state tab.

Add a tool

To add a tab (for example the Query tab), go to your index.ts and make the following change:

import { toolQueryEditor } from "@activeviam/atoti-ui-sdk";

const extension: ExtensionModule = {
  activate: async (configuration) => {
    configuration.tools.push(toolQueryEditor);
  },
};

Remove a tool

Similarly, you can remove a tab like this:

const extension: ExtensionModule = {
  activate: async (configuration) => {
    configuration.tools = configuration.tools.filter(
      ({ key }) => key !== "filtersEditor",
    );
  },
};

Introduction to the tool panel

Create a custom tool

⌘I