[ARVADOS-WORKBENCH2] updated: 1.1.4-65-gc16ef38
Git user
git at public.curoverse.com
Mon Jun 18 05:18:37 EDT 2018
Summary of changes:
package.json | 30 +--
src/components/api-token/api-token.tsx | 4 +-
src/components/breadcrumbs/breadcrumbs.test.tsx | 53 ++++
src/components/breadcrumbs/breadcrumbs.tsx | 58 +++++
.../dropdown-menu/dropdown-menu.test.tsx | 43 ++++
.../main-app-bar/dropdown-menu/dropdown-menu.tsx | 65 +++++
src/components/main-app-bar/main-app-bar.test.tsx | 101 ++++++++
src/components/main-app-bar/main-app-bar.tsx | 129 ++++++++++
.../main-app-bar/search-bar/search-bar.test.tsx | 99 +++++++
.../main-app-bar/search-bar/search-bar.tsx | 109 ++++++++
src/components/project-list/project-list.tsx | 2 +-
src/components/project-tree/project-tree.tsx | 2 +-
src/components/tree/tree.tsx | 6 +-
src/models/user.ts | 4 +
src/services/auth-service/auth-service.ts | 2 +-
src/services/project-service/project-service.ts | 2 +-
src/store/auth/auth-reducer.ts | 2 +-
src/store/store.ts | 6 +-
src/views/workbench/workbench.tsx | 147 +++++------
tslint.json | 3 +-
yarn.lock | 284 +++++++++++----------
21 files changed, 919 insertions(+), 232 deletions(-)
create mode 100644 src/components/breadcrumbs/breadcrumbs.test.tsx
create mode 100644 src/components/breadcrumbs/breadcrumbs.tsx
create mode 100644 src/components/main-app-bar/dropdown-menu/dropdown-menu.test.tsx
create mode 100644 src/components/main-app-bar/dropdown-menu/dropdown-menu.tsx
create mode 100644 src/components/main-app-bar/main-app-bar.test.tsx
create mode 100644 src/components/main-app-bar/main-app-bar.tsx
create mode 100644 src/components/main-app-bar/search-bar/search-bar.test.tsx
create mode 100644 src/components/main-app-bar/search-bar/search-bar.tsx
via c16ef38920e9d011215a519bc58624a614717cd6 (commit)
via 0c793af552b746f9a9d3fef8005f6e23a3e1803e (commit)
via 065f393316fad3472ab2afe526c7965be1fe392d (commit)
via a7dc770135000ddee283340222f1fb2f03740df7 (commit)
via d9846c586fe756b07f9b0c4898a99990653058de (commit)
via a884c545e3edad2cc2ac1210fc3148f922c155dc (commit)
via 63ff090649294e3d4bd99c977fc72680c0c43d34 (commit)
via 8d401d8610a2a5f9845f4dd4d2dca81ba9b77252 (commit)
via 528b1f4623fa22d956b8ac1652833fc375a0bfc1 (commit)
via a234ec2fdf7a257aa1a9268d892e2b6079d4ef55 (commit)
via a9949cb9146f46fb002604bd2d27e872f4705b1b (commit)
via 488c558be1f9b4a9aa48a06d43b97db0d8ff9101 (commit)
via 040d25dbcc9ec46c4c21c945ccf02dcf1bf44c26 (commit)
via 4f71744add73edb7248314139236af0d81bac42b (commit)
via 28bb06ae7b9983da793f2459c5cc3e8debd71949 (commit)
via 762c232937e6825839ada7d682542601aaffbd90 (commit)
via 8d53c4d34935fcb6b875db0499addf2229c1c2d5 (commit)
via c96d8f5b046114354ce8bc64419c427912b520ea (commit)
via 6ac1c00c725bab873d1f7e85eeffb917af1a9635 (commit)
via 7edbf7ca5bdd726ac2e433a230cca6b2b0a6caa8 (commit)
via ab844b6fcc7f9f81c04f8aa6f88a1f1231f27e79 (commit)
via 90b2eff699cfd45186e8d5b9b7947da316c0140d (commit)
via 8bfcbaea5e9f11543bbc4d721817978e621d2ffa (commit)
via 8ac033564cfcdc53707cf138c9818328bed78fa4 (commit)
via c97df9311cc2fa0142dbc9f234e452b6c28763cc (commit)
via 6752fb200db07abfd5f98d3838729139fb073dfe (commit)
via ca98b15be85d6d8a8f872224ed8a0c2eed7d8f27 (commit)
via a9deea73c1982bf90150c6dbc8caca385ad68d04 (commit)
via f87e91a3d8cfbcd1bebf116701423c2c54bc5e19 (commit)
via 06b26e9f05f048c3ea593a96d2659b6eecf847ea (commit)
via a097022b5fcc344eedc8b8ad31e77c6590ff999e (commit)
from a78b68335f520c4a7d50362811369bf83a921296 (commit)
Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.
commit c16ef38920e9d011215a519bc58624a614717cd6
Merge: a78b683 0c793af
Author: Pawel Kowalczyk <pawel.kowalczyk at contractors.roche.com>
Date: Mon Jun 18 11:18:18 2018 +0200
merge-conflicts
Feature #13618
Arvados-DCO-1.1-Signed-off-by: Pawel Kowalczyk <pawel.kowalczyk at contractors.roche.com>
diff --cc src/components/tree/tree.tsx
index 21c4bc7,fb0df58..6731950
--- a/src/components/tree/tree.tsx
+++ b/src/components/tree/tree.tsx
@@@ -66,36 -44,30 +66,36 @@@ interface TreeProps<T>
}
class Tree<T> extends React.Component<TreeProps<T> & WithStyles<CssRules>, {}> {
- renderArrow (items: boolean, arrowClass: string, open: boolean){
- return <i className={`${arrowClass} ${open ? "fas fa-caret-down" : `fas fa-caret-down ${this.props.classes.arrowRotate}`}`} />;
+ renderArrow(status: TreeItemStatus, arrowClass: string, open: boolean, id: string) {
+ return <i
+ onClick={() => this.props.toggleItem(id, status)}
+ className={`
+ ${arrowClass}
+ ${status === TreeItemStatus.Pending ? this.props.classes.arrowVisibility : ''}
- ${open ? `fas fa-caret-down ${this.props.classes.arrowTransition}` : `fas fa-caret-down ${this.props.classes.arrowRotate}`}`} />
++ ${open ? `fas fa-caret-down ${this.props.classes.arrowTransition}` : `fas fa-caret-down ${this.props.classes.arrowRotate}`}`} />;
}
render(): ReactElement<any> {
const level = this.props.level ? this.props.level : 0;
- const {classes, render, toggleItem, items} = this.props;
- const {list, arrow, activeArrow} = classes;
+ const { classes, render, toggleItem, items } = this.props;
+ const { list, inactiveArrow, activeArrow, loader } = classes;
return <List component="div" className={list}>
{items && items.map((it: TreeItem<T>, idx: number) =>
- <div key={`item/${level}/${idx}`}>
- <ListItem button onClick={() => toggleItem(it.id)} className={list} style={{paddingLeft: (level + 1) * 20}}>
- {this.renderArrow(true, it.active ? activeArrow : arrow, it.open)}
- {render(it, level)}
- </ListItem>
- {it.items && it.items.length > 0 &&
- <Collapse in={it.open} timeout="auto" unmountOnExit>
- <StyledTree
- items={it.items}
- render={render}
- toggleItem={toggleItem}
- level={level + 1}/>
- </Collapse>}
- </div>)}
+ <div key={`item/${level}/${idx}`}>
+ <ListItem button className={list} style={{ paddingLeft: (level + 1) * 20 }}>
+ {it.status === TreeItemStatus.Pending ? <CircularProgress size={10} className={loader} /> : null}
+ {it.toggled && it.items && it.items.length === 0 ? null : this.renderArrow(it.status, it.active ? activeArrow : inactiveArrow, it.open, it.id)}
+ {render(it, level)}
+ </ListItem>
+ {it.items && it.items.length > 0 &&
+ <Collapse in={it.open} timeout="auto" unmountOnExit>
+ <StyledTree
+ items={it.items}
+ render={render}
+ toggleItem={toggleItem}
+ level={level + 1} />
+ </Collapse>}
+ </div>)}
- </List>
+ </List>;
}
}
diff --cc src/views/workbench/workbench.tsx
index 59495e9,ef8e6bd..8884f3a
--- a/src/views/workbench/workbench.tsx
+++ b/src/views/workbench/workbench.tsx
@@@ -22,10 -22,12 +22,12 @@@ import { AccountCircle } from "@materia
import { User } from "../../models/user";
import Grid from "@material-ui/core/Grid/Grid";
import { RootState } from "../../store/store";
- import projectActions from "../../store/project/project-action"
-
+ import MainAppBar, { MainAppBarActionProps, MainAppBarMenuItems, MainAppBarMenuItem } from '../../components/main-app-bar/main-app-bar';
+ import { Breadcrumb } from '../../components/breadcrumbs/breadcrumbs';
+ import { push } from 'react-router-redux';
+ import projectActions from "../../store/project/project-action";
import ProjectTree from '../../components/project-tree/project-tree';
-import { TreeItem } from "../../components/tree/tree";
+import { TreeItem, TreeItemStatus } from "../../components/tree/tree";
import { Project } from "../../models/project";
import { projectService } from '../../services/services';
@@@ -76,104 -95,87 +95,90 @@@ interface WorkbenchState
}
class Workbench extends React.Component<WorkbenchProps, WorkbenchState> {
- constructor(props: WorkbenchProps) {
- super(props);
- this.state = {
- anchorEl: null
+ state = {
+ anchorEl: null,
+ searchText: "",
+ breadcrumbs: [
+ {
+ label: "Projects",
+ path: "/projects"
+ }, {
+ label: "Project 1",
+ path: "/projects/project-1"
+ }
+ ],
+ menuItems: {
+ accountMenu: [
+ {
+ label: "Logout",
+ action: () => this.props.dispatch(authActions.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(authActions.LOGIN())
+ }
+ ]
}
- }
-
- login = () => {
- this.props.dispatch(authActions.LOGIN());
- };
-
- logout = () => {
- this.handleClose();
- this.props.dispatch(authActions.LOGOUT());
};
- handleOpenMenu = (event: React.MouseEvent<any>) => {
- this.setState({
- anchorEl: event.currentTarget
- });
- };
- handleClose = () => {
- this.setState({
- anchorEl: null
- });
+ mainAppBarActions: MainAppBarActionProps = {
+ onBreadcrumbClick: (breadcrumb: NavBreadcrumb) => this.props.dispatch(push(breadcrumb.path)),
+ onSearch: searchText => {
+ this.setState({ searchText });
+ this.props.dispatch(push(`/search?q=${searchText}`));
+ },
+ onMenuItemClick: (menuItem: NavMenuItem) => menuItem.action()
};
- toggleProjectTreeItem = (itemId: string) => {
- this.props.dispatch<any>(projectService.getProjectList(itemId)).then(() => {
+ toggleProjectTreeItem = (itemId: string, status: TreeItemStatus) => {
+ if (status === TreeItemStatus.Loaded) {
- this.props.dispatch(projectActions.TOGGLE_PROJECT_TREE_ITEM(itemId))
+ this.props.dispatch(projectActions.TOGGLE_PROJECT_TREE_ITEM(itemId));
- });
+ } else {
+ this.props.dispatch<any>(projectService.getProjectList(itemId)).then(() => {
+ this.props.dispatch(projectActions.TOGGLE_PROJECT_TREE_ITEM(itemId));
- })
++ });
+ }
- };
+ }
render() {
const { classes, user } = this.props;
return (
<div className={classes.root}>
- <AppBar position="absolute" className={classes.appBar}>
- <Toolbar>
- <Typography variant="title" color="inherit" noWrap style={{ flexGrow: 1 }}>
- <span>Arvados</span><br /><span style={{ fontSize: 12 }}>Workbench 2</span>
- </Typography>
- {user ?
- <Grid container style={{ width: 'auto' }}>
- <Grid container style={{ width: 'auto' }} alignItems='center'>
- <Typography variant="title" color="inherit" noWrap>
- {user.firstName} {user.lastName}
- </Typography>
- </Grid>
- <Grid item>
- <IconButton
- aria-owns={this.state.anchorEl ? 'menu-appbar' : undefined}
- aria-haspopup="true"
- onClick={this.handleOpenMenu}
- color="inherit">
- <AccountCircle />
- </IconButton>
- </Grid>
- <Menu
- id="menu-appbar"
- anchorEl={this.state.anchorEl}
- anchorOrigin={{
- vertical: 'top',
- horizontal: 'right',
- }}
- transformOrigin={{
- vertical: 'top',
- horizontal: 'right',
- }}
- open={!!this.state.anchorEl}
- onClose={this.handleClose}>
- <MenuItem onClick={this.logout}>Logout</MenuItem>
- <MenuItem onClick={this.handleClose}>My account</MenuItem>
- </Menu>
- </Grid>
- :
- <Button color="inherit" onClick={this.login}>Login</Button>
- }
- </Toolbar>
- </AppBar>
+ <div className={classes.appBar}>
+ <MainAppBar
+ breadcrumbs={this.state.breadcrumbs}
+ searchText={this.state.searchText}
+ user={this.props.user}
+ menuItems={this.state.menuItems}
+ {...this.mainAppBarActions}
+ />
+ </div>
{user &&
- <Drawer
- variant="permanent"
- classes={{
- paper: classes.drawerPaper,
- }}>
- <div className={classes.toolbar}/>
- <ProjectTree
- projects={this.props.projects}
- toggleProjectTreeItem={this.toggleProjectTreeItem}/>
- </Drawer>}
+ <Drawer
+ variant="permanent"
+ classes={{
+ paper: classes.drawerPaper,
+ }}>
+ <div className={classes.toolbar} />
+ <ProjectTree
+ projects={this.props.projects}
+ toggleProjectTreeItem={this.toggleProjectTreeItem} />
+ </Drawer>}
<main className={classes.content}>
<div className={classes.toolbar} />
- <div className={classes.toolbar} />
<Switch>
<Route path="/project/:name" component={ProjectList} />
</Switch>
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list