[ARVADOS-WORKBENCH2] updated: 1.1.4-283-ga19a2cd

Git user git at public.curoverse.com
Thu Jul 12 12:06:13 EDT 2018


Summary of changes:
 src/components/data-explorer/data-explorer.tsx       |  8 +++++---
 src/components/data-table/data-table.tsx             | 11 +++++------
 src/store/data-explorer/data-explorer-action.ts      |  4 ++--
 src/views-components/data-explorer/data-explorer.tsx |  2 +-
 src/views/project-panel/project-panel-item.ts        |  4 +---
 src/views/project-panel/project-panel.tsx            |  5 +++--
 6 files changed, 17 insertions(+), 17 deletions(-)

       via  a19a2cd08f80d39455d245156617a87d72bed3ec (commit)
      from  960e872ff250bc89950f33540806ea24bc4819bc (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 a19a2cd08f80d39455d245156617a87d72bed3ec
Author: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
Date:   Thu Jul 12 18:05:55 2018 +0200

    Refactor data table to accept extractKey props rather than requiring DataItem type
    
    Feature #13798
    
    Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski at contractors.roche.com>

diff --git a/src/components/data-explorer/data-explorer.tsx b/src/components/data-explorer/data-explorer.tsx
index 9085b1f..e851ca9 100644
--- a/src/components/data-explorer/data-explorer.tsx
+++ b/src/components/data-explorer/data-explorer.tsx
@@ -6,7 +6,7 @@ import * as React from 'react';
 import { Grid, Paper, Toolbar, StyleRulesCallback, withStyles, Theme, WithStyles, TablePagination, IconButton } from '@material-ui/core';
 import MoreVertIcon from "@material-ui/icons/MoreVert";
 import ColumnSelector from "../../components/column-selector/column-selector";
-import DataTable, { DataColumns, DataItem } from "../../components/data-table/data-table";
+import DataTable, { DataColumns } from "../../components/data-table/data-table";
 import { DataColumn } from "../../components/data-table/data-column";
 import { DataTableFilterItem } from '../../components/data-table-filters/data-table-filters';
 import SearchInput from '../search-input/search-input';
@@ -28,9 +28,10 @@ interface DataExplorerProps<T> {
     onFiltersChange: (filters: DataTableFilterItem[], column: DataColumn<T>) => void;
     onChangePage: (page: number) => void;
     onChangeRowsPerPage: (rowsPerPage: number) => void;
+    extractKey?: (item: T) => React.Key;
 }
 
-class DataExplorer<T extends DataItem> extends React.Component<DataExplorerProps<T> & WithStyles<CssRules>> {
+class DataExplorer<T> extends React.Component<DataExplorerProps<T> & WithStyles<CssRules>> {
 
     render() {
         return <Paper>
@@ -53,7 +54,8 @@ class DataExplorer<T extends DataItem> extends React.Component<DataExplorerProps
                 onContextMenu={this.props.onContextMenu}
                 onRowDoubleClick={(_, item: T) => this.props.onRowDoubleClick(item)}
                 onFiltersChange={this.props.onFiltersChange}
-                onSortToggle={this.props.onSortToggle} />
+                onSortToggle={this.props.onSortToggle}
+                extractKey={this.props.extractKey} />
             <Toolbar>
                 {this.props.items.length > 0 &&
                     <Grid container justify="flex-end">
diff --git a/src/components/data-table/data-table.tsx b/src/components/data-table/data-table.tsx
index 8f4ffc6..e0e3048 100644
--- a/src/components/data-table/data-table.tsx
+++ b/src/components/data-table/data-table.tsx
@@ -8,9 +8,7 @@ import { DataColumn, SortDirection } from './data-column';
 import DataTableFilters, { DataTableFilterItem } from "../data-table-filters/data-table-filters";
 
 export type DataColumns<T, F extends DataTableFilterItem = DataTableFilterItem> = Array<DataColumn<T, F>>;
-export interface DataItem {
-    key: React.Key;
-}
+
 export interface DataTableProps<T> {
     items: T[];
     columns: DataColumns<T>;
@@ -19,9 +17,10 @@ export interface DataTableProps<T> {
     onRowDoubleClick: (event: React.MouseEvent<HTMLTableRowElement>, item: T) => void;
     onSortToggle: (column: DataColumn<T>) => void;
     onFiltersChange: (filters: DataTableFilterItem[], column: DataColumn<T>) => void;
+    extractKey?: (item: T) => React.Key;
 }
 
-class DataTable<T extends DataItem> extends React.Component<DataTableProps<T> & WithStyles<CssRules>> {
+class DataTable<T> extends React.Component<DataTableProps<T> & WithStyles<CssRules>> {
     render() {
         const { items, classes } = this.props;
         return <div
@@ -70,10 +69,10 @@ class DataTable<T extends DataItem> extends React.Component<DataTableProps<T> &
     }
 
     renderBodyRow = (item: T, index: number) => {
-        const { onRowClick, onRowDoubleClick, onContextMenu } = this.props;
+        const { onRowClick, onRowDoubleClick, extractKey } = this.props;
         return <TableRow
             hover
-            key={item.key}
+            key={extractKey ? extractKey(item) : index}
             onClick={event => onRowClick && onRowClick(event, item)}
             onContextMenu={this.handleRowContextMenu(item)}
             onDoubleClick={event => onRowDoubleClick && onRowDoubleClick(event, item) }>
diff --git a/src/store/data-explorer/data-explorer-action.ts b/src/store/data-explorer/data-explorer-action.ts
index 2c161c2..3d7ba53 100644
--- a/src/store/data-explorer/data-explorer-action.ts
+++ b/src/store/data-explorer/data-explorer-action.ts
@@ -4,14 +4,14 @@
 
 import { default as unionize, ofType, UnionOf } from "unionize";
 import { DataTableFilterItem } from "../../components/data-table-filters/data-table-filters";
-import { DataColumns, DataItem } from "../../components/data-table/data-table";
+import { DataColumns } from "../../components/data-table/data-table";
 
 const actions = unionize({
     RESET_PAGINATION: ofType<{ id: string }>(),
     REQUEST_ITEMS: ofType<{ id: string }>(),
     SET_COLUMNS: ofType<{ id: string, columns: DataColumns<any> }>(),
     SET_FILTERS: ofType<{ id: string, columnName: string, filters: DataTableFilterItem[] }>(),
-    SET_ITEMS: ofType<{ id: string, items: DataItem[], page: number, rowsPerPage: number, itemsAvailable: number }>(),
+    SET_ITEMS: ofType<{ id: string, items: any[], page: number, rowsPerPage: number, itemsAvailable: number }>(),
     SET_PAGE: ofType<{ id: string, page: number }>(),
     SET_ROWS_PER_PAGE: ofType<{ id: string, rowsPerPage: number }>(),
     TOGGLE_COLUMN: ofType<{ id: string, columnName: string }>(),
diff --git a/src/views-components/data-explorer/data-explorer.tsx b/src/views-components/data-explorer/data-explorer.tsx
index e2e145b..b0e189f 100644
--- a/src/views-components/data-explorer/data-explorer.tsx
+++ b/src/views-components/data-explorer/data-explorer.tsx
@@ -10,13 +10,13 @@ import { Dispatch } from "redux";
 import actions from "../../store/data-explorer/data-explorer-action";
 import { DataColumn } from "../../components/data-table/data-column";
 import { DataTableFilterItem } from "../../components/data-table-filters/data-table-filters";
-import { ContextMenuAction, ContextMenuActionGroup } from "../../components/context-menu/context-menu";
 
 interface Props {
     id: string;
     onRowClick: (item: any) => void;
     onContextMenu: (event: React.MouseEvent<HTMLElement>, item: any) => void;
     onRowDoubleClick: (item: any) => void;
+    extractKey?: (item: any) => React.Key;
 }
 
 const mapStateToProps = (state: RootState, { id }: Props) =>
diff --git a/src/views/project-panel/project-panel-item.ts b/src/views/project-panel/project-panel-item.ts
index 9a9f845..4135fce 100644
--- a/src/views/project-panel/project-panel-item.ts
+++ b/src/views/project-panel/project-panel-item.ts
@@ -2,11 +2,10 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import { DataItem } from "../../components/data-table/data-table";
 import { ResourceKind } from "../../models/kinds";
 import { GroupContentsResource } from "../../services/groups-service/groups-service";
 
-export interface ProjectPanelItem extends DataItem {
+export interface ProjectPanelItem {
     uuid: string;
     name: string;
     kind: string;
@@ -20,7 +19,6 @@ export interface ProjectPanelItem extends DataItem {
 
 export function resourceToDataItem(r: GroupContentsResource): ProjectPanelItem {
     return {
-        key: r.uuid,
         uuid: r.uuid,
         name: r.name,
         kind: r.kind,
diff --git a/src/views/project-panel/project-panel.tsx b/src/views/project-panel/project-panel.tsx
index 0b1be09..01e39ed 100644
--- a/src/views/project-panel/project-panel.tsx
+++ b/src/views/project-panel/project-panel.tsx
@@ -34,7 +34,7 @@ type ProjectPanelProps = {
     & WithStyles<CssRules>
     & RouteComponentProps<{ id: string }>;
 
-class ProjectPanel extends React.Component<ProjectPanelProps> {    
+class ProjectPanel extends React.Component<ProjectPanelProps> {
     render() {
         return <div>
             <div className={this.props.classes.toolbar}>
@@ -52,7 +52,8 @@ class ProjectPanel extends React.Component<ProjectPanelProps> {
                 id={PROJECT_PANEL_ID}
                 onRowClick={this.props.onItemClick}
                 onRowDoubleClick={this.props.onItemDoubleClick}
-                onContextMenu={this.props.onContextMenu} />
+                onContextMenu={this.props.onContextMenu}
+                extractKey={(item: ProjectPanelItem) => item.uuid} />
         </div>;
     }
 

-----------------------------------------------------------------------


hooks/post-receive
-- 




More information about the arvados-commits mailing list