X-Git-Url: https://git.arvados.org/arvados.git/blobdiff_plain/ab3e261d28ff83fa214002a372a055817a931cd1..1feb5aaffe6fee4a9c8c8c64877f1da6f3490e06:/src/views/workbench/workbench.tsx diff --git a/src/views/workbench/workbench.tsx b/src/views/workbench/workbench.tsx index 3fec6d67dd..3637528d49 100644 --- a/src/views/workbench/workbench.tsx +++ b/src/views/workbench/workbench.tsx @@ -18,7 +18,7 @@ import { TreeItem } from "../../components/tree/tree"; import { getTreePath } from '../../store/project/project-reducer'; import { sidePanelActions } from '../../store/side-panel/side-panel-action'; import { SidePanel, SidePanelItem } from '../../components/side-panel/side-panel'; -import { ItemMode, setFavoriteItem, setProjectItem } from "../../store/navigation/navigation-action"; +import { ItemMode, setProjectItem } from "../../store/navigation/navigation-action"; import { projectActions } from "../../store/project/project-action"; import { ProjectPanel } from "../project-panel/project-panel"; import { DetailsPanel } from '../../views-components/details-panel/details-panel'; @@ -32,7 +32,10 @@ import { sidePanelData, SidePanelIdentifiers } from '../../store/side-panel/side import { ProjectResource } from '../../models/project'; import { ResourceKind } from '../../models/resource'; import { ContextMenu, ContextMenuKind } from "../../views-components/context-menu/context-menu"; -import { FavoritePanel } from "../favorite-panel/favorite-panel"; +import { FavoritePanel, FAVORITE_PANEL_ID } from "../favorite-panel/favorite-panel"; +import { CurrentTokenDialog } from '../../views-components/current-token-dialog/current-token-dialog'; +import { dataExplorerActions } from '../../store/data-explorer/data-explorer-action'; +import { Snackbar } from '../../views-components/snackbar/snackbar'; const drawerWidth = 240; const appBarHeight = 100; @@ -79,6 +82,7 @@ interface WorkbenchDataProps { projects: Array>; currentProjectId: string; user?: User; + currentToken?: string; sidePanelItems: SidePanelItem[]; } @@ -96,6 +100,7 @@ interface NavMenuItem extends MainAppBarMenuItem { } interface WorkbenchState { + isCurrentTokenDialogOpen: boolean; anchorEl: any; searchText: string; menuItems: { @@ -111,17 +116,23 @@ export const Workbench = withStyles(styles)( projects: state.projects.items, currentProjectId: state.projects.currentItemId, user: state.auth.user, + currentToken: state.auth.apiToken, sidePanelItems: state.sidePanel }) )( class extends React.Component { state = { isCreationDialogOpen: false, + isCurrentTokenDialogOpen: false, anchorEl: null, searchText: "", breadcrumbs: [], menuItems: { accountMenu: [ + { + label: 'Current token', + action: () => this.toggleCurrentTokenModal() + }, { label: "Logout", action: () => this.props.dispatch(authActions.LOGOUT()) @@ -176,15 +187,23 @@ export const Workbench = withStyles(styles)( toggleOpen={this.toggleSidePanelOpen} toggleActive={this.toggleSidePanelActive} sidePanelItems={this.props.sidePanelItems} - onContextMenu={(event) => this.openContextMenu(event, authService.getUuid() || "", ContextMenuKind.RootProject)}> + onContextMenu={(event) => this.openContextMenu(event, { + uuid: authService.getUuid() || "", + name: "", + kind: ContextMenuKind.ROOT_PROJECT + })}> this.props.dispatch(setProjectItem(itemId, ItemMode.OPEN))} - onContextMenu={(event, item) => this.openContextMenu(event, item.data.uuid, ContextMenuKind.Project)} + onContextMenu={(event, item) => this.openContextMenu(event, { + uuid: item.data.uuid, + name: item.data.name, + kind: ContextMenuKind.PROJECT + })} toggleActive={itemId => { this.props.dispatch(setProjectItem(itemId, ItemMode.ACTIVE)); - this.props.dispatch(loadDetails(itemId, ResourceKind.Project)); - this.props.dispatch(sidePanelActions.TOGGLE_SIDE_PANEL_ITEM_ACTIVE(SidePanelIdentifiers.Projects)); + this.props.dispatch(loadDetails(itemId, ResourceKind.PROJECT)); + this.props.dispatch(sidePanelActions.TOGGLE_SIDE_PANEL_ITEM_ACTIVE(SidePanelIdentifiers.PROJECTS)); }} /> } @@ -195,44 +214,64 @@ export const Workbench = withStyles(styles)( - { user && } + {user && } + + ); } renderProjectPanel = (props: RouteComponentProps<{ id: string }>) => this.props.dispatch(setProjectItem(itemId, ItemMode.ACTIVE))} - onContextMenu={(event, item) => this.openContextMenu(event, item.uuid, ContextMenuKind.Project)} + onContextMenu={(event, item) => { + const kind = item.kind === ResourceKind.PROJECT ? ContextMenuKind.PROJECT : ContextMenuKind.RESOURCE; + this.openContextMenu(event, { + uuid: item.uuid, + name: item.name, + kind + }); + }} onDialogOpen={this.handleCreationDialogOpen} onItemClick={item => { this.props.dispatch(loadDetails(item.uuid, item.kind as ResourceKind)); }} onItemDoubleClick={item => { this.props.dispatch(setProjectItem(item.uuid, ItemMode.ACTIVE)); - this.props.dispatch(loadDetails(item.uuid, ResourceKind.Project)); + this.props.dispatch(loadDetails(item.uuid, ResourceKind.PROJECT)); }} {...props} /> renderFavoritePanel = (props: RouteComponentProps<{ id: string }>) => this.props.dispatch(setFavoriteItem(itemId, ItemMode.ACTIVE))} - onContextMenu={(event, item) => this.openContextMenu(event, item.uuid, ContextMenuKind.Favorite)} + onItemRouteChange={() => this.props.dispatch(dataExplorerActions.REQUEST_ITEMS({ id: FAVORITE_PANEL_ID }))} + onContextMenu={(event, item) => { + const kind = item.kind === ResourceKind.PROJECT ? ContextMenuKind.PROJECT : ContextMenuKind.RESOURCE; + this.openContextMenu(event, { + uuid: item.uuid, + name: item.name, + kind, + }); + }} onDialogOpen={this.handleCreationDialogOpen} onItemClick={item => { this.props.dispatch(loadDetails(item.uuid, item.kind as ResourceKind)); }} onItemDoubleClick={item => { - this.props.dispatch(setFavoriteItem(item.uuid, ItemMode.ACTIVE)); - this.props.dispatch(loadDetails(item.uuid, ResourceKind.Project)); + this.props.dispatch(loadDetails(item.uuid, ResourceKind.PROJECT)); + this.props.dispatch(setProjectItem(item.uuid, ItemMode.ACTIVE)); + this.props.dispatch(sidePanelActions.TOGGLE_SIDE_PANEL_ITEM_ACTIVE(SidePanelIdentifiers.PROJECTS)); }} {...props} /> mainAppBarActions: MainAppBarActionProps = { onBreadcrumbClick: ({ itemId }: NavBreadcrumb) => { this.props.dispatch(setProjectItem(itemId, ItemMode.BOTH)); - this.props.dispatch(loadDetails(itemId, ResourceKind.Project)); + this.props.dispatch(loadDetails(itemId, ResourceKind.PROJECT)); }, onSearch: searchText => { this.setState({ searchText }); @@ -243,7 +282,11 @@ export const Workbench = withStyles(styles)( this.props.dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL()); }, onContextMenu: (event: React.MouseEvent, breadcrumb: NavBreadcrumb) => { - this.openContextMenu(event, breadcrumb.itemId, ContextMenuKind.Project); + this.openContextMenu(event, { + uuid: breadcrumb.itemId, + name: breadcrumb.label, + kind: ContextMenuKind.PROJECT + }); } }; @@ -255,22 +298,28 @@ export const Workbench = withStyles(styles)( this.props.dispatch(sidePanelActions.TOGGLE_SIDE_PANEL_ITEM_ACTIVE(itemId)); this.props.dispatch(projectActions.RESET_PROJECT_TREE_ACTIVITY(itemId)); const panelItem = this.props.sidePanelItems.find(it => it.id === itemId); - this.props.dispatch(push(panelItem && panelItem.path ? panelItem.path : "/")); + if (panelItem && panelItem.activeAction) { + panelItem.activeAction(this.props.dispatch); + } } handleCreationDialogOpen = (itemUuid: string) => { this.props.dispatch(projectActions.OPEN_PROJECT_CREATOR({ ownerUuid: itemUuid })); } - openContextMenu = (event: React.MouseEvent, itemUuid: string, kind: ContextMenuKind) => { + openContextMenu = (event: React.MouseEvent, resource: { name: string; uuid: string; kind: ContextMenuKind; }) => { event.preventDefault(); this.props.dispatch( contextMenuActions.OPEN_CONTEXT_MENU({ position: { x: event.clientX, y: event.clientY }, - resource: { uuid: itemUuid, kind } + resource }) ); } + + toggleCurrentTokenModal = () => { + this.setState({ isCurrentTokenDialogOpen: !this.state.isCurrentTokenDialogOpen }); + } } ) );