1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
7 import { PluginConfig } from '~/common/plugintypes';
8 import * as React from 'react';
9 import { Dispatch } from 'redux';
10 import { RootState } from '~/store/store';
11 import { push } from "react-router-redux";
12 import { Typography } from "@material-ui/core";
13 import { Route, matchPath } from "react-router";
14 import { RootStore } from '~/store/store';
15 import { activateSidePanelTreeItem } from '~/store/side-panel-tree/side-panel-tree-actions';
16 import { setSidePanelBreadcrumbs } from '~/store/breadcrumbs/breadcrumbs-actions';
17 import { DispatchProp, connect } from 'react-redux';
18 import { MenuItem } from "@material-ui/core";
19 import { propertiesActions } from '~/store/properties/properties-actions';
20 import { Location } from 'history';
22 const categoryName = "Plugin Example";
23 export const routePath = "/examplePlugin";
24 const propertyKey = "Example_menu_item_pressed_count";
26 interface ExampleProps {
30 const exampleMapStateToProps = (state: RootState) => ({ pressedCount: state.properties[propertyKey] || 0 });
32 const incrementPressedCount = (dispatch: Dispatch, pressedCount: number) => {
33 dispatch(propertiesActions.SET_PROPERTY({ key: propertyKey, value: pressedCount + 1 }));
36 const ExampleMenuComponent = connect(exampleMapStateToProps)(
37 ({ pressedCount, dispatch }: ExampleProps & DispatchProp<any>) =>
38 <MenuItem onClick={() => incrementPressedCount(dispatch, pressedCount)}>Example menu item</MenuItem >
41 const ExamplePluginMainPanel = connect(exampleMapStateToProps)(
42 ({ pressedCount }: ExampleProps) =>
44 This is a example main panel plugin. The example menu item has been pressed {pressedCount} times.
47 export const register = (pluginConfig: PluginConfig) => {
49 pluginConfig.centerPanelList.push((elms) => {
50 elms.push(<Route path={routePath} component={ExamplePluginMainPanel} />);
54 pluginConfig.accountMenuList.push((elms) => {
55 elms.push(<ExampleMenuComponent />);
59 pluginConfig.newButtonMenuList.push((elms) => {
60 elms.push(<ExampleMenuComponent />);
64 pluginConfig.navigateToHandlers.push((dispatch: Dispatch, getState: () => RootState, uuid: string) => {
65 if (uuid === categoryName) {
66 dispatch(push(routePath));
72 pluginConfig.sidePanelCategories.push((cats: string[]): string[] => { cats.push(categoryName); return cats; });
74 pluginConfig.locationChangeHandlers.push((store: RootStore, pathname: string): boolean => {
75 if (matchPath(pathname, { path: routePath, exact: true })) {
76 store.dispatch(activateSidePanelTreeItem(categoryName));
77 store.dispatch<any>(setSidePanelBreadcrumbs(categoryName));
83 pluginConfig.enableNewButtonMatchers.push((location: Location) => (!!matchPath(location.pathname, { path: routePath, exact: true })));