Skip to main content

Configure the tool panel

The tools are located on the left of the application, when the user is viewing a dashboard.

By default, they include:

  • Fields
  • Filters
  • Style
note

@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",
    );
  },
};