Add a button to the "Activity Bar Panel"

[josephfusco]

Acceptance Criteria

• registerActivityBarPanel() exists and is callable by 3rd party plugins
• Function handles edge cases & invalid input
• Tests:
  • Help Panel tests should work
  • Explorer Panel tests should work (rename to Query Composer)

Technical Details

const { registerActivityBarPanel } = window.WPGRAPHQL_IDE;

registerActivityBarPanel( 'my-button', {
  title: 'My Button',
  label: 'My Button does x, y and z',
  icon: () => {}, // name of icon from supported icon library or custom Icon component
  content: () => {} // The content that will render in the activity panel when this activity bar plugin is active
} );

The smart cache collections feature will most certainly make use of this API.

An example of the help screen as a plugin might look like this:

const { registerActivityBarPanel } = window.WPGRAPHQL_IDE;

registerActivityBarPanel( 'help', {
  title: 'Help',
  label: 'Help',
  icon: () => <HelpIcon />,
  content: () => <HelpPluginList /> // In the screenshot below, this component represents the list of articles visible in the activity panel when the help button is active
} );

The list of panels should be maintained in the Redux store, so registering a panel should modify the list of panels in the Redux store. Similar when you call registerBlockType in Gutenberg.

Reference

• Requires Activity Bar Plugin store #122
• feat: phase-2 p.o.c: break the app into packages #81

[josephfusco]

Closed by #165