feat: customize cornerstone-SR-extension load toolbar

[pedrokohler]

Context

Currently, there is no way to customize the buttons of the "load toolbar" of the SR viewport with the customization service.

This PR adds this ability.

Changes & Results

Before:
Uncustomizable toolbar

After:
Customized toolbar

Testing

Checklist

PR

• [] My Pull Request title is descriptive, accurate and follows the
  semantic-release format and guidelines.

Code

• [] My code has been well-documented (function documentation, inline comments,
  etc.)

Public Documentation Updates

• [] The documentation page has been updated as necessary for any public API
  additions or removals.

Tested Environment

• [] OS:
• [] Node version:
• [] Browser:

[netlify]

❌ Deploy Preview for ohif-platform-docs failed. Why did it fail? →

Name	Link
🔨 Latest commit	a95eef9
🔍 Latest deploy log	https://app.netlify.com/sites/ohif-platform-docs/deploys/67db78360dd03f00082d0b0e

[netlify]

✅ Deploy Preview for ohif-dev ready!

Name	Link
🔨 Latest commit	a95eef9
🔍 Latest deploy log	https://app.netlify.com/sites/ohif-dev/deploys/67db78366fc6d00008d99f68
😎 Deploy Preview	https://deploy-preview-4872--ohif-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[sedghi]

I don't think this should be treated as a customization but rather a toolbarSection. So just assign a toolbarSectionId to it, register buttons in the toolbarButton, and make it appear in the UI in the mode.

I imagine we do this for all of the viewports.

SRViewport.mainToolbarSectionId
SEG
RT

and have toolbarButtons like

{
id: 'LoadSR',
uiType: 'ohif.toolButton',
props: {
icon: 'tool-stack-scroll',
label: 'LoadSR',
tooltip: 'LoadSR',
commands: loadSR,
evaluate: 'evaluate.cornerstoneTool',
},
},

and others for SEG and RT with separate commands

[pedrokohler]

I don't think this should be treated as a customization but rather a toolbarSection. So just assign a toolbarSectionId to it, register buttons in the toolbarButton, and make it appear in the UI in the mode.

@sedghi I guess the question then is how are the developers supposed to customize this, since there are buttons already being registered in the upstream code.

Suppose they want to replace the buttons entirely. Are they supposed to clear with the current toolbar values and add new ones?

I believe that what you are saying is already possible. I was using this on the modeEnter callback:

toolbarService.addButtons(
    [
      // button config here
    ],
    true
  );

  toolbarService.clearButtonSection('loadSRMeasurements');
  toolbarService.createButtonSection('loadSRMeasurements', [
    'loadSRMeasurements',
    'replaceSRMeasurements',
  ]);

And it was working, but @wayfarer3130 recommended we added an customization instead.

[sedghi]

@wayfarer3130 Do you think it should be a csutomization or a button section with toolbarbuttons?