+export const Workbench = withStyles(styles)(
+ connect<WorkbenchDataProps>(
+ (state: RootState) => ({
+ user: state.auth.user,
+ currentToken: state.auth.apiToken,
+ })
+ )(
+ class extends React.Component<WorkbenchProps, WorkbenchState> {
+ state = {
+ isCurrentTokenDialogOpen: false,
+ anchorEl: null,
+ searchText: "",
+ breadcrumbs: [],
+ menuItems: {
+ accountMenu: [
+ {
+ label: 'Current token',
+ action: () => this.toggleCurrentTokenModal()
+ },
+ {
+ label: "Logout",
+ action: () => this.props.dispatch(logout())
+ },
+ {
+ label: "My account",
+ action: () => this.props.dispatch(push("/my-account"))
+ }
+ ],
+ helpMenu: [
+ {
+ label: "Help",
+ action: () => this.props.dispatch(push("/help"))
+ }
+ ],
+ anonymousMenu: [
+ {
+ label: "Sign in",
+ action: () => this.props.dispatch(login())
+ }
+ ]
+ }
+ };
+
+ render() {
+ const { classes, user } = this.props;
+ return (
+ <div className={classes.root}>
+ <div className={classes.appBar}>
+ <MainAppBar
+ breadcrumbs={Breadcrumbs}
+ searchText={this.state.searchText}
+ user={this.props.user}
+ menuItems={this.state.menuItems}
+ buildInfo={this.props.buildInfo}
+ {...this.mainAppBarActions} />
+ </div>
+ {user && <SidePanel />}
+ <main className={classes.contentWrapper}>
+ <div className={classes.content}>
+ <Switch>
+ <Route path={Routes.PROJECTS} component={ProjectPanel} />
+ <Route path={Routes.COLLECTIONS} component={CollectionPanel} />
+ <Route path={Routes.FAVORITES} component={FavoritePanel} />
+ <Route path={Routes.PROCESSES} component={ProcessPanel} />
+ </Switch>
+ </div>
+ {user && <DetailsPanel />}
+ </main>
+ <ContextMenu />
+ <Snackbar />
+ <CreateProjectDialog />
+ <CreateCollectionDialog />
+ <RenameFileDialog />
+ <PartialCopyCollectionDialog />
+ <FileRemoveDialog />
+ <CopyCollectionDialog />
+ <FileRemoveDialog />
+ <MultipleFilesRemoveDialog />
+ <UpdateCollectionDialog />
+ <FilesUploadCollectionDialog />
+ <UpdateProjectDialog />
+ <MoveCollectionDialog />
+ <MoveProjectDialog />
+ <CurrentTokenDialog
+ currentToken={this.props.currentToken}
+ open={this.state.isCurrentTokenDialogOpen}
+ handleClose={this.toggleCurrentTokenModal} />
+ </div>
+ );
+ }
+
+ mainAppBarActions: MainAppBarActionProps = {
+ onSearch: searchText => {
+ this.setState({ searchText });
+ this.props.dispatch(push(`/search?q=${searchText}`));
+ },
+ onMenuItemClick: (menuItem: NavMenuItem) => menuItem.action(),
+ onDetailsPanelToggle: () => {
+ this.props.dispatch(detailsPanelActions.TOGGLE_DETAILS_PANEL());
+ },
+ };
+
+ toggleCurrentTokenModal = () => {
+ this.setState({ isCurrentTokenDialogOpen: !this.state.isCurrentTokenDialogOpen });
+ }
+ }
+ )