Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.activeviam.com/llms.txt

Use this file to discover all available pages before exploring further.

You can create custom tools. This can be done by creating a Tool and adding it to configuration.tools. Create a file named myTool.tsx with the following content: 
import React, { FC } from "react";

import { EditorProps, Tool } from "@activeviam/atoti-ui-sdk";
import { CheckOutlined } from "@activeviam/icons/antd";

const MyToolComponent: FC<EditorProps> = () => <div>Hello world</div>;
const MyToolIcon: FC = () => <CheckOutlined />;

export const myTool: Tool = {
  key: "my-tool",
  component: MyToolComponent,
  type: "single",
  icon: MyToolIcon,
};
MyToolComponent has access to the state of the dashboard and to those of the selected widget. It can also update these pieces of state. See EditorProps for more information.
Finally, go to your index.ts and make the following change: 
import { myTool } from "./myTool";

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