Adding button to the tool bars

[toddgeist]

Is there a way to add custom buttons to the toolbar?

Meta-Info	Value
ExtProjectId	JCCMMN-01
Original Estimation	???h
Remaining Estimation	???h

[kvolkovich-sc]

You can add it as new capability in toolbar context.

Example (sorry for formatting):

let newCapabilityHandler = () => console.log('click');

let newCapability = {
    id: 'my-custom-button',
    icon: { svg: 'hello' },
    label: 'My Custom Button',
    shouldBeAvailable: () => true,
    availableInContexts: ['toolbar'],
    handler: newCapabilityHandler
  };
 
<FileNavigator
...
  capabilities={{
  ...connectorNodeV1.capabilities,
  newCapability
}}
/>

I think it should be enough. If not, you can provide some use case and we'll try to solve this issue together.

[toddgeist]

wow this looks nice. :-)

I'll give it try

[kvolkovich-sc]

Tried code above) Sorry, its not working. Please wait for solution ~30m

[kvolkovich-sc]

I added an example (black bold circle).

capabilities={(apiOptions, actions) => ([
        ...(window.connectors.nodeV1.capabilities(apiOptions, actions)),
        ({
          id: 'custom-button',
          icon: {
            svg: '<svg viewBox="0 0 120 120" version="1.1"><circle cx="60" cy="60" r="50"></circle></svg>'
          },
          label: 'Custom Button',
          shouldBeAvailable: () => true,
          availableInContexts: ['toolbar'],
          handler: () => alert('Custom button click')
        })
      ])}

https://demo.core.dev.opuscapita.com/filemanager/master/?currentComponentName=FileNavigator&maxContainerWidth=100%25&showSidebar=true

[toddgeist]

that worked ! Thank you!