redirect from empty routing to root project and display list

[arvados.git] / src / views / project-panel / project-panel.tsx

diff --git a/src/views/project-panel/project-panel.tsx b/src/views/project-panel/project-panel.tsx
index 5c3fb2b0421837c43cf2ae721de6306c50358bd3..cf4aca5b6aacf074ebb7490a298d75f689a4903c 100644 (file)
--- a/src/views/project-panel/project-panel.tsx
+++ b/src/views/project-panel/project-panel.tsx
@@ -17,10 +17,17 @@ import { ResourceKind } from '../../models/resource';
 import { resourceLabel } from '../../common/labels';
 import { ArvadosTheme } from '../../common/custom-theme';
 import { renderName, renderStatus, renderType, renderOwner, renderFileSize, renderDate } from '../../views-components/data-explorer/renderers';
+import { restoreBranch } from '../../store/navigation/navigation-action';
+import { ProjectIcon } from '../../components/icon/icon';
 
-type CssRules = "toolbar" | "button";
+type CssRules = 'root' | "toolbar" | "button";
 
 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+    root: {
+        position: 'relative',
+        width: '100%',
+        height: '100%'
+    },
     toolbar: {
         paddingBottom: theme.spacing.unit * 3,
         textAlign: "right"
@@ -147,7 +154,7 @@ export const ProjectPanel = withStyles(styles)(
         class extends React.Component<ProjectPanelProps> {
             render() {
                 const { classes } = this.props;
-                return <div>
+                return <div className={classes.root}>
                     <div className={classes.toolbar}>
                         <Button color="primary" onClick={this.handleNewCollectionClick} variant="raised" className={classes.button}>
                             Create a collection
@@ -165,7 +172,9 @@ export const ProjectPanel = withStyles(styles)(
                         onRowClick={this.props.onItemClick}
                         onRowDoubleClick={this.props.onItemDoubleClick}
                         onContextMenu={this.props.onContextMenu}
-                        extractKey={(item: ProjectPanelItem) => item.uuid} />
+                        extractKey={(item: ProjectPanelItem) => item.uuid}
+                        defaultIcon={ProjectIcon}
+                        defaultMessages={['Your project is empty.', 'Please create a project or create a collection and upload a data.']} />
                 </div>;
             }
 
@@ -176,11 +185,18 @@ export const ProjectPanel = withStyles(styles)(
             handleNewCollectionClick = () => {
                 this.props.onCollectionCreationDialogOpen(this.props.currentItemId);
             }
+
             componentWillReceiveProps({ match, currentItemId, onItemRouteChange }: ProjectPanelProps) {
                 if (match.params.id !== currentItemId) {
                     onItemRouteChange(match.params.id);
                 }
             }
+
+            componentDidMount() {
+                if (this.props.match.params.id && this.props.currentItemId === '') {
+                    this.props.dispatch<any>(restoreBranch(this.props.match.params.id));
+                }
+            }
         }
     )
 );