Custom selector

In addition to the standard settings selectors described in the previous pages, you can define your own dropdown menus with the options your application requires.

The code below shows an example with a menu that allows to choose between three different tokens:

const TOKENS: CustomTopBarMenuItem[] = [
  {title:'Token 1', icon: <LogoGreen/>  },
  {title: 'Token 2', icon: <LogoYellow/>},
  {title: 'Token 3', icon: <LogoOrange/> }
];

const tokenSettings = {
    items: TOKENS,
    currentItem: currentToken,
    onItemSwitch: (t: string) => {
      // update your app upon item change
    },
};

<ClickUI
    topBarSettings={{
        customTopBarMenuSettings:[tokenSettings]
    }}
/>