merge-conflicts
authorPawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>
Tue, 26 Jun 2018 11:12:55 +0000 (13:12 +0200)
committerPawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>
Tue, 26 Jun 2018 11:12:55 +0000 (13:12 +0200)
Feature #13679

Arvados-DCO-1.1-Signed-off-by: Pawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>

1  2 
src/components/data-table/data-table.tsx
src/views-components/project-explorer/project-explorer.tsx

index bf0854b925597ab1de60e28d2276b8736b15110c,e86113efdeac14a6e0f1928265b622875f582f19..e8a5b24e02c2fe22488236f1ae703f36ef482c8d
@@@ -22,23 -22,29 +22,23 @@@ class DataTable<T> extends React.Compon
      render() {
          const { items, classes } = this.props;
          return <div className={classes.tableContainer}>
 -            {items.length > 0 ?
 -                <Table>
 -                    <TableHead>
 -                        <TableRow>
 -                            {this.mapVisibleColumns(this.renderHeadCell)}
 -                        </TableRow>
 -                    </TableHead>
 -                    <TableBody className={classes.tableBody}>
 -                        {items.map(this.renderBodyRow)}
 -                    </TableBody>
 -                </Table> : <Typography
 -                    className={classes.noItemsInfo}
 -                    variant="body2"
 -                    gutterBottom>
 -                    No items
 -                </Typography>}
 +            <Table>
 +                <TableHead>
 +                    <TableRow>
 +                        {this.mapVisibleColumns(this.renderHeadCell)}
 +                    </TableRow>
 +                </TableHead>
 +                <TableBody className={classes.tableBody}>
 +                    {items.map(this.renderBodyRow)}
 +                </TableBody>
 +            </Table>
          </div>;
      }
  
      renderHeadCell = (column: DataColumn<T>, index: number) => {
          const { name, key, renderHeader, filters, sortDirection } = column;
          const { onSortToggle, onFiltersChange } = this.props;
-         return <TableCell key={key || index} style={{minWidth: column.width}}>
 -        return <TableCell key={key || index}>
++        return <TableCell key={key || index} style={{width: column.width, minWidth: column.width}}>
              {renderHeader ?
                  renderHeader() :
                  filters
@@@ -90,8 -96,7 +90,8 @@@ type CssRules = "tableBody" | "tableCon
  
  const styles: StyleRulesCallback<CssRules> = (theme: Theme) => ({
      tableContainer: {
 -        overflowX: 'auto'
 +        overflowX: 'auto',
 +        overflowY: 'hidden'
      },
      tableBody: {
          background: theme.palette.background.paper
index b54fd72b06de7ce55c547be4d0d23ea9ff3955f4,1018ef5e5fa428a351226ff8cf4efdc21b6d2412..94ae438986eeb3145ba02a1dfc872966de18c91f
@@@ -10,6 -10,7 +10,7 @@@ import DataExplorer from '../../compone
  import { DataColumn, toggleSortDirection, resetSortDirection } from '../../components/data-table/data-column';
  import { DataTableFilterItem } from '../../components/data-table-filters/data-table-filters';
  import { ContextMenuAction } from '../../components/context-menu/context-menu';
+ import { ResourceKind } from "../../models/resource";
  
  export interface ProjectExplorerContextActions {
      onAddToFavourite: (item: ProjectExplorerItem) => void;
@@@ -23,6 -24,7 +24,7 @@@
  
  interface ProjectExplorerProps {
      items: ProjectExplorerItem[];
+     onRowClick: (item: ProjectExplorerItem) => void;
  }
  
  interface ProjectExplorerState {
@@@ -41,8 -43,7 +43,8 @@@ class ProjectExplorer extends React.Com
              name: "Name",
              selected: true,
              sortDirection: "asc",
 -            render: renderName
 +            render: renderName,
 +            width: "450px"
          }, {
              name: "Status",
              selected: true,
@@@ -53,8 -54,7 +55,8 @@@
                  name: "Complete",
                  selected: true
              }],
 -            render: renderStatus
 +            render: renderStatus,
 +            width: "75px"
          }, {
              name: "Type",
              selected: true,
                  name: "Group",
                  selected: true
              }],
-             render: item => renderType(item.type),
 -            render: item => renderType(item.kind)
++            render: item => renderType(item.kind),
 +            width: "125px"
          }, {
              name: "Owner",
              selected: true,
 -            render: item => renderOwner(item.owner)
 +            render: item => renderOwner(item.owner),
 +            width: "200px"
          }, {
              name: "File size",
              selected: true,
              sortDirection: "none",
 -            render: item => renderFileSize(item.fileSize)
 +            render: item => renderFileSize(item.fileSize),
 +            width: "50px"
          }, {
              name: "Last modified",
              selected: true,
 -            render: item => renderDate(item.lastModified)
 +            render: item => renderDate(item.lastModified),
 +            width: "150px"
          }]
      };
  
              rowsPerPage={this.state.rowsPerPage}
              onColumnToggle={this.toggleColumn}
              onFiltersChange={this.changeFilters}
-             onRowClick={console.log}
+             onRowClick={this.props.onRowClick}
              onSortToggle={this.toggleSort}
              onSearch={this.search}
              onContextAction={this.executeAction}
@@@ -191,12 -187,15 +193,15 @@@ const renderName = (item: ProjectExplor
          </Grid>
      </Grid>;
  
  const renderIcon = (item: ProjectExplorerItem) => {
-     switch (item.type) {
-         case "arvados#group":
-             return <i className="fas fa-folder fa-lg" />;
-         case "arvados#groupList":
-             return <i className="fas fa-th fa-lg" />;
+     switch (item.kind) {
+         case ResourceKind.LEVEL_UP:
+             return <i className="icon-level-up" style={{fontSize: "1rem"}}/>;
+         case ResourceKind.PROJECT:
+             return <i className="fas fa-folder fa-lg"/>;
+         case ResourceKind.COLLECTION:
+             return <i className="fas fa-th fa-lg"/>;
          default:
              return <i />;
      }