[ARVADOS-WORKBENCH2] updated: 1.1.4-60-g7adbd16
Git user
git at public.curoverse.com
Thu Jun 14 06:18:38 EDT 2018
Summary of changes:
src/common/api/filter-builder.ts | 8 +-
src/components/api-token/api-token.tsx | 10 +-
src/components/breadcrumbs/breadcrumbs.test.tsx | 53 ++++++++
src/components/breadcrumbs/breadcrumbs.tsx | 58 ++++++++
.../columns-configurator/columns-configurator.tsx | 6 +-
.../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/index.tsx | 5 +-
src/models/user.ts | 6 +
src/services/auth-service/auth-service.ts | 35 +++--
src/services/project-service/project-service.ts | 43 +++---
src/store/auth/auth-reducer.test.ts | 16 ++-
src/store/auth/auth-reducer.ts | 6 +-
src/store/store.ts | 6 +-
src/views/project-explorer/project-explorer.tsx | 6 +-
src/views/workbench/workbench.tsx | 151 +++++++++++----------
tslint.json | 3 +-
24 files changed, 837 insertions(+), 131 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 7adbd161925c71840bf4ddb799b87f1734e5af7e (commit)
via 065f393316fad3472ab2afe526c7965be1fe392d (commit)
via a7dc770135000ddee283340222f1fb2f03740df7 (commit)
via d9846c586fe756b07f9b0c4898a99990653058de (commit)
via a884c545e3edad2cc2ac1210fc3148f922c155dc (commit)
via d5fb635085181a3cc16dd2f3224c8e6fc8924964 (commit)
via c77b1a5becebf382fddc349ae9081503d511a02a (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 973fce01f05a50d4aa0169a88281f20476b305b2 (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 7adbd161925c71840bf4ddb799b87f1734e5af7e
Merge: 973fce0 065f393
Author: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
Date: Thu Jun 14 12:17:55 2018 +0200
Merge branch 'master'
Feature #13601
Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
diff --cc src/components/data-explorer/columns-configurator/columns-configurator.tsx
index e0680e9,0000000..e4accbe
mode 100644,000000..100644
--- a/src/components/data-explorer/columns-configurator/columns-configurator.tsx
+++ b/src/components/data-explorer/columns-configurator/columns-configurator.tsx
@@@ -1,74 -1,0 +1,74 @@@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import { WithStyles, StyleRulesCallback, Theme, withStyles, IconButton, Popover, Paper, List, Checkbox, ListItemText, ListItem } from '@material-ui/core';
+import ColumnsIcon from "@material-ui/icons/ViewWeek";
+import { Column } from '../column';
+import { PopoverOrigin } from '@material-ui/core/Popover';
+
+export interface ColumnsConfiguratorProps {
+ columns: Array<Column<any>>;
- onColumnToggle: (column: Column<any>) => void
++ onColumnToggle: (column: Column<any>) => void;
+}
+
+
+class ColumnsConfigurator extends React.Component<ColumnsConfiguratorProps & WithStyles<CssRules>> {
+
+ state = {
+ anchorEl: undefined
- }
++ };
+
+ transformOrigin: PopoverOrigin = {
+ vertical: "top",
+ horizontal: "right",
- }
++ };
+
+ render() {
+ const { columns, onColumnToggle } = this.props;
+ return (
+ <>
+ <IconButton onClick={this.handleClick}><ColumnsIcon /></IconButton>
+ <Popover
+ anchorEl={this.state.anchorEl}
+ open={Boolean(this.state.anchorEl)}
+ onClose={this.handleClose}
+ transformOrigin={this.transformOrigin}
+ anchorOrigin={this.transformOrigin}
+ >
+ <Paper>
+ <List>
+ {
+ columns.map((column, index) => (
+ <ListItem dense key={index} button onClick={() => onColumnToggle(column)}>
+ <Checkbox disableRipple color="primary" checked={column.selected}/>
+ <ListItemText>{column.header}</ListItemText>
+ </ListItem>
+
+ ))
+ }
+ </List>
+ </Paper>
+ </Popover>
+ </>
+ );
+ }
+
+ handleClose = () => {
+ this.setState({ anchorEl: undefined });
+ }
+
+ handleClick = (event: React.MouseEvent<HTMLElement>) => {
+ this.setState({ anchorEl: event.currentTarget });
+ }
+
+}
+
+type CssRules = "root";
+
+const styles: StyleRulesCallback<CssRules> = (theme: Theme) => ({
+ root: {}
+});
+
+export default withStyles(styles)(ColumnsConfigurator);
diff --cc src/services/project-service/project-service.ts
index d454a7b,dbc0f92..f6521ce
--- a/src/services/project-service/project-service.ts
+++ b/src/services/project-service/project-service.ts
@@@ -35,24 -35,26 +35,27 @@@ interface GroupsResponse
export default class ProjectService {
public getProjectList = (parentUuid?: string) => (dispatch: Dispatch): Promise<Project[]> => {
dispatch(actions.PROJECTS_REQUEST());
-
- const ub = new UrlBuilder('/groups');
- const fb = new FilterBuilder();
- fb.addEqual(FilterField.OWNER_UUID, parentUuid);
- const url = ub.addParam('filters', fb.get()).get();
-
- return serverApi.get<GroupsResponse>(url).then(groups => {
- const projects = groups.data.items.map(g => ({
- name: g.name,
- createdAt: g.created_at,
- modifiedAt: g.modified_at,
- href: g.href,
- uuid: g.uuid,
- ownerUuid: g.owner_uuid,
- kind: g.kind
- } as Project));
- dispatch(actions.PROJECTS_SUCCESS({projects, parentItemId: parentUuid}));
- return projects;
- });
- };
+ if (parentUuid) {
+ const fb = new FilterBuilder();
+ fb.addLike(FilterField.OWNER_UUID, parentUuid);
+ return serverApi.get<GroupsResponse>('/groups', { params: {
+ filters: fb.get()
+ }}).then(groups => {
+ const projects = groups.data.items.map(g => ({
+ name: g.name,
+ createdAt: g.created_at,
+ modifiedAt: g.modified_at,
+ href: g.href,
+ uuid: g.uuid,
- ownerUuid: g.owner_uuid
++ ownerUuid: g.owner_uuid,
++ kind: g.kind
+ } as Project));
+ dispatch(actions.PROJECTS_SUCCESS({projects, parentItemId: parentUuid}));
+ return projects;
+ });
+ } else {
+ dispatch(actions.PROJECTS_SUCCESS({projects: [], parentItemId: parentUuid}));
+ return Promise.resolve([]);
+ }
+ }
}
diff --cc src/views/project-explorer/project-explorer.tsx
index de866c2,0000000..21e8d27
mode 100644,000000..100644
--- a/src/views/project-explorer/project-explorer.tsx
+++ b/src/views/project-explorer/project-explorer.tsx
@@@ -1,80 -1,0 +1,80 @@@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import DataExplorer, { DataExplorerProps } from "../../components/data-explorer/data-explorer";
+import { RouteComponentProps } from 'react-router';
+import { Project } from '../../models/project';
+import { ProjectState, findTreeItem } from '../../store/project/project-reducer';
+import { RootState } from '../../store/store';
+import { connect, DispatchProp } from 'react-redux';
+import { push } from 'react-router-redux';
- import projectActions from "../../store/project/project-action"
++import projectActions from "../../store/project/project-action";
+import { Typography } from '@material-ui/core';
+import { Column } from '../../components/data-explorer/column';
+
+interface ProjectExplorerViewDataProps {
- projects: ProjectState
++ projects: ProjectState;
+}
+
+type ProjectExplorerViewProps = ProjectExplorerViewDataProps & RouteComponentProps<{ name: string }> & DispatchProp;
+
+type ProjectExplorerViewState = Pick<DataExplorerProps<Project>, "columns">;
+
+class ProjectExplorerView extends React.Component<ProjectExplorerViewProps, ProjectExplorerViewState> {
+
+ state: ProjectExplorerViewState = {
+ columns: [
+ { header: "Name", selected: true, render: item => <Typography noWrap>{renderIcon(item.kind)} {item.name}</Typography> },
+ { header: "Created at", selected: true, render: item => <Typography noWrap>{formatDate(item.createdAt)}</Typography> },
+ { header: "Modified at", selected: true, render: item => <Typography noWrap>{formatDate(item.modifiedAt)}</Typography> },
+ { header: "UUID", selected: true, render: item => <Typography noWrap>{item.uuid}</Typography> },
+ { header: "Owner UUID", selected: true, render: item => <Typography noWrap>{item.ownerUuid}</Typography> },
+ { header: "URL", selected: true, render: item => <Typography noWrap>{item.href}</Typography> }
+ ]
- }
++ };
+
+ render() {
+ const project = findTreeItem(this.props.projects, this.props.match.params.name);
+ const projectItems = project && project.items || [];
+ return (
+ <DataExplorer {...this.state} items={projectItems.map(item => item.data)} onItemClick={this.goToProject} onColumnToggle={this.toggleColumn} />
+ );
+ }
+
+
+ goToProject = (project: Project) => {
+ this.props.dispatch(push(`/project/${project.uuid}`));
+ this.props.dispatch(projectActions.TOGGLE_PROJECT_TREE_ITEM(project.uuid));
+ }
+
+ toggleColumn = (column: Column<Project>) => {
+ const index = this.state.columns.indexOf(column);
+ const columns = this.state.columns.slice(0);
+ columns.splice(index, 1, { ...column, selected: !column.selected });
+ this.setState({ columns });
+ }
+}
+
+const formatDate = (isoDate: string) => {
+ const date = new Date(isoDate);
+ return date.toLocaleString();
+};
+
+const renderIcon = (kind: string) => {
+ switch (kind) {
+ case "arvados#group":
+ return <i className="fas fa-folder" />;
+ case "arvados#groupList":
+ return <i className="fas fa-th" />;
+ default:
+ return <i />;
+ }
+};
+
+export default connect(
+ (state: RootState) => ({
+ projects: state.projects
+ })
+)(ProjectExplorerView);
diff --cc src/views/workbench/workbench.tsx
index f453947,ef8e6bd..87eaff2
--- a/src/views/workbench/workbench.tsx
+++ b/src/views/workbench/workbench.tsx
@@@ -28,8 -30,6 +30,7 @@@ import ProjectTree from '../../componen
import { TreeItem } from "../../components/tree/tree";
import { Project } from "../../models/project";
import { projectService } from '../../services/services';
+import ProjectExplorer from '../project-explorer/project-explorer';
- import { push } from 'react-router-redux';
const drawerWidth = 240;
@@@ -109,57 -146,22 +147,23 @@@ class Workbench extends React.Component
toggleProjectTreeItem = (itemId: string) => {
this.props.dispatch<any>(projectService.getProjectList(itemId)).then(() => {
this.props.dispatch(projectActions.TOGGLE_PROJECT_TREE_ITEM(itemId));
- this.props.dispatch(push(`/project/${itemId}`))
++ this.props.dispatch(push(`/project/${itemId}`));
});
- };
+ }
render() {
- const {classes, user} = this.props;
+ 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"
@@@ -172,9 -174,10 +176,10 @@@
toggleProjectTreeItem={this.toggleProjectTreeItem}/>
</Drawer>}
<main className={classes.content}>
- <div className={classes.toolbar}/>
+ <div className={classes.toolbar} />
+ <div className={classes.toolbar} />
<Switch>
- <Route path="/project/:name" component={ProjectList} />
+ <Route path="/project/:name" component={ProjectExplorer}/>
</Switch>
</main>
</div>
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list