Reuse DataColumns type

Feature #13678

Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski@contractors.roche.com>

diff --git a/src/components/column-selector/column-selector.test.tsx b/src/components/column-selector/column-selector.test.tsx
index b6c544fb6b0ed880c82a32fc2939bae1f8036665..c2835ad7e9819d8b95bb596eb5b50d99940319f2 100644 (file)
--- a/src/components/column-selector/column-selector.test.tsx
+++ b/src/components/column-selector/column-selector.test.tsx
@@ -6,14 +6,14 @@ import * as React from "react";
 import { mount, configure } from "enzyme";
 import * as Adapter from "enzyme-adapter-react-16";
 import ColumnSelector, { ColumnSelectorProps, ColumnSelectorTrigger } from "./column-selector";
-import { DataColumn } from "../data-table/data-column";
 import { ListItem, Checkbox } from "@material-ui/core";
+import { DataColumns } from "../data-table/data-table";
 
 configure({ adapter: new Adapter() });
 
 describe("<ColumnSelector />", () => {
     it("shows only configurable columns", () => {
-        const columns: Array<DataColumn<void>> = [
+        const columns: DataColumns<void> = [
             {
                 name: "Column 1",
                 render: () => <span />,
@@ -38,7 +38,7 @@ describe("<ColumnSelector />", () => {
     });
 
     it("renders checked checkboxes next to selected columns", () => {
-        const columns: Array<DataColumn<void>> = [
+        const columns: DataColumns<void> = [
             {
                 name: "Column 1",
                 render: () => <span />,
@@ -63,7 +63,7 @@ describe("<ColumnSelector />", () => {
     });
 
     it("calls onColumnToggle with clicked column", () => {
-        const columns: Array<DataColumn<void>> = [
+        const columns: DataColumns<void> = [
             {
                 name: "Column 1",
                 render: () => <span />,

diff --git a/src/components/column-selector/column-selector.tsx b/src/components/column-selector/column-selector.tsx
index e2286b00189396eed805d3d588ae73b96547f78a..b5dd43b85a43c1eeb298ce977726c9c784a111b3 100644 (file)
--- a/src/components/column-selector/column-selector.tsx
+++ b/src/components/column-selector/column-selector.tsx
@@ -8,9 +8,10 @@ import MenuIcon from "@material-ui/icons/Menu";
 import { DataColumn, isColumnConfigurable } from '../data-table/data-column';
 import Popover from "../popover/popover";
 import { IconButtonProps } from '@material-ui/core/IconButton';
+import { DataColumns } from '../data-table/data-table';
 
 export interface ColumnSelectorProps {
-    columns: Array<DataColumn<any>>;
+    columns: DataColumns<any>;
     onColumnToggle: (column: DataColumn<any>) => void;
 }
 

diff --git a/src/components/data-explorer/data-explorer.tsx b/src/components/data-explorer/data-explorer.tsx
index 6a3103b140a49238175a104e1c07f3d9c4fb6ab9..7ae66358590cd46ea32929ddb959b539604df86c 100644 (file)
--- a/src/components/data-explorer/data-explorer.tsx
+++ b/src/components/data-explorer/data-explorer.tsx
@@ -7,15 +7,15 @@ import { Grid, Paper, Toolbar, StyleRulesCallback, withStyles, Theme, WithStyles
 import MoreVertIcon from "@material-ui/icons/MoreVert";
 import ContextMenu, { ContextMenuActionGroup, ContextMenuAction } from "../../components/context-menu/context-menu";
 import ColumnSelector from "../../components/column-selector/column-selector";
-import DataTable from "../../components/data-table/data-table";
+import DataTable, { DataColumns } from "../../components/data-table/data-table";
 import { mockAnchorFromMouseEvent } from "../../components/popover/helpers";
-import { DataColumn, toggleSortDirection } from "../../components/data-table/data-column";
+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';
 
 interface DataExplorerProps<T> {
     items: T[];
-    columns: Array<DataColumn<T>>;
+    columns: DataColumns<T>;
     contextActions: ContextMenuActionGroup[];
     searchValue: string;
     rowsPerPage: number;

diff --git a/src/components/data-table/data-table.test.tsx b/src/components/data-table/data-table.test.tsx
index 439e6c27e906fa2b15264fc9c8b10fcada1f04cb..77979af6901ea19b3c6d3ce7b702f5289b09dd4f 100644 (file)
--- a/src/components/data-table/data-table.test.tsx
+++ b/src/components/data-table/data-table.test.tsx
@@ -6,15 +6,14 @@ import * as React from "react";
 import { mount, configure } from "enzyme";
 import { TableHead, TableCell, Typography, TableBody, Button, TableSortLabel } from "@material-ui/core";
 import * as Adapter from "enzyme-adapter-react-16";
-import DataTable from "./data-table";
-import { DataColumn } from "./data-column";
+import DataTable, { DataColumns } from "./data-table";
 import DataTableFilters from "../data-table-filters/data-table-filters";
 
 configure({ adapter: new Adapter() });
 
 describe("<DataTable />", () => {
     it("shows only selected columns", () => {
-        const columns: Array<DataColumn<string>> = [
+        const columns: DataColumns<string> = [
             {
                 name: "Column 1",
                 render: () => <span />,
@@ -42,7 +41,7 @@ describe("<DataTable />", () => {
     });
 
     it("renders column name", () => {
-        const columns: Array<DataColumn<string>> = [
+        const columns: DataColumns<string> = [
             {
                 name: "Column 1",
                 render: () => <span />,
@@ -60,7 +59,7 @@ describe("<DataTable />", () => {
     });
 
     it("uses renderHeader instead of name prop", () => {
-        const columns: Array<DataColumn<string>> = [
+        const columns: DataColumns<string> = [
             {
                 name: "Column 1",
                 renderHeader: () => <span>Column Header</span>,
@@ -79,7 +78,7 @@ describe("<DataTable />", () => {
     });
 
     it("passes column key prop to corresponding cells", () => {
-        const columns: Array<DataColumn<string>> = [
+        const columns: DataColumns<string> = [
             {
                 name: "Column 1",
                 key: "column-1-key",
@@ -99,7 +98,7 @@ describe("<DataTable />", () => {
     });
 
     it("shows information that items array is empty", () => {
-        const columns: Array<DataColumn<string>> = [
+        const columns: DataColumns<string> = [
             {
                 name: "Column 1",
                 render: () => <span />,
@@ -117,7 +116,7 @@ describe("<DataTable />", () => {
     });
 
     it("renders items", () => {
-        const columns: Array<DataColumn<string>> = [
+        const columns: DataColumns<string> = [
             {
                 name: "Column 1",
                 render: (item) => <Typography>{item}</Typography>,
@@ -141,7 +140,7 @@ describe("<DataTable />", () => {
     });
 
     it("passes sorting props to <TableSortLabel />", () => {
-        const columns: Array<DataColumn<string>> = [{
+        const columns: DataColumns<string> = [{
             name: "Column 1",
             sortDirection: "asc",
             selected: true,
@@ -161,7 +160,7 @@ describe("<DataTable />", () => {
     });
 
     it("passes filter props to <DataTableFilter />", () => {
-        const columns: Array<DataColumn<string>> = [{
+        const columns: DataColumns<string> = [{
             name: "Column 1",
             sortDirection: "asc",
             selected: true,

diff --git a/src/store/data-explorer/data-explorer-action.ts b/src/store/data-explorer/data-explorer-action.ts
index 703599918e782a4d8845777d6cdbf606be1645cb..c4ff61453c1bfbd40748fd5b2e63c8fb5e9a00ae 100644 (file)
--- a/src/store/data-explorer/data-explorer-action.ts
+++ b/src/store/data-explorer/data-explorer-action.ts
@@ -5,11 +5,12 @@
 import { default as unionize, ofType, UnionOf } from "unionize";
 import { SortDirection, DataColumn } from "../../components/data-table/data-column";
 import { DataTableFilterItem } from "../../components/data-table-filters/data-table-filters";
+import { DataColumns } from "../../components/data-table/data-table";
 
 type WithId<T> = T & { id: string };
 
 const actions = unionize({
-    SET_COLUMNS: ofType<WithId<{ columns: Array<DataColumn<any>> }>>(),
+    SET_COLUMNS: ofType<WithId<{ columns: DataColumns<any> }>>(),
     SET_FILTERS: ofType<WithId<{columnName: string, filters: DataTableFilterItem[]}>>(),
     SET_ITEMS: ofType<WithId<{items: any[]}>>(),
     SET_PAGE: ofType<WithId<{page: number}>>(),

diff --git a/src/store/data-explorer/data-explorer-reducer.test.tsx b/src/store/data-explorer/data-explorer-reducer.test.tsx
index 2a9e56ce3f6dde6a8ca27ec6eb06df057898d58c..0eb3c321a3e107e49fb43af4f2c267e16648f81c 100644 (file)
--- a/src/store/data-explorer/data-explorer-reducer.test.tsx
+++ b/src/store/data-explorer/data-explorer-reducer.test.tsx
@@ -4,12 +4,12 @@
 
 import dataExplorerReducer, { initialDataExplorer } from "./data-explorer-reducer";
 import actions from "./data-explorer-action";
-import { DataColumn } from "../../components/data-table/data-column";
 import { DataTableFilterItem } from "../../components/data-table-filters/data-table-filters";
+import { DataColumns } from "../../components/data-table/data-table";
 
 describe('data-explorer-reducer', () => {
     it('should set columns', () => {
-        const columns: Array<DataColumn<any>> = [{
+        const columns: DataColumns<any> = [{
             name: "Column 1",
             render: jest.fn(),
             selected: true
@@ -20,7 +20,7 @@ describe('data-explorer-reducer', () => {
     });
 
     it('should toggle sorting', () => {
-        const columns: Array<DataColumn<any>> = [{
+        const columns: DataColumns<any> = [{
             name: "Column 1",
             render: jest.fn(),
             selected: true,
@@ -38,7 +38,7 @@ describe('data-explorer-reducer', () => {
     });
 
     it('should set filters', () => {
-        const columns: Array<DataColumn<any>> = [{
+        const columns: DataColumns<any> = [{
             name: "Column 1",
             render: jest.fn(),
             selected: true,

diff --git a/src/store/data-explorer/data-explorer-reducer.ts b/src/store/data-explorer/data-explorer-reducer.ts
index 1b1c36b7b082817ff2d730dfcfb9d6fbf29fd0eb..0069085b1b43f318da79cf18896dcfe2c86e2900 100644 (file)
--- a/src/store/data-explorer/data-explorer-reducer.ts
+++ b/src/store/data-explorer/data-explorer-reducer.ts
@@ -5,9 +5,10 @@
 import { DataColumn, toggleSortDirection, resetSortDirection } from "../../components/data-table/data-column";
 import actions, { DataExplorerAction } from "./data-explorer-action";
 import { DataTableFilterItem } from "../../components/data-table-filters/data-table-filters";
+import { DataColumns } from "../../components/data-table/data-table";
 
 interface DataExplorer {
-    columns: Array<DataColumn<any>>;
+    columns: DataColumns<any>;
     items: any[];
     page: number;
     rowsPerPage: number;
@@ -58,7 +59,7 @@ export const getDataExplorer = (state: DataExplorerState, id: string) =>
 const update = (state: DataExplorerState, id: string, updateFn: (dataExplorer: DataExplorer) => DataExplorer) =>
     ({ ...state, [id]: updateFn(getDataExplorer(state, id)) });
 
-const setColumns = (columns: Array<DataColumn<any>>) =>
+const setColumns = (columns: DataColumns<any>) =>
     (dataExplorer: DataExplorer) =>
         ({ ...dataExplorer, columns });
 

diff --git a/src/views-components/project-explorer/project-explorer.tsx b/src/views-components/project-explorer/project-explorer.tsx
index 7fff08a33162d91247bc150a86f620550bb7a03b..c4d40e8ac697d831e12cdc19338c08b1ba1a2afe 100644 (file)
--- a/src/views-components/project-explorer/project-explorer.tsx
+++ b/src/views-components/project-explorer/project-explorer.tsx
@@ -7,11 +7,12 @@ import { ProjectExplorerItem } from './project-explorer-item';
 import { Grid, Typography } from '@material-ui/core';
 import { formatDate, formatFileSize } from '../../common/formatters';
 import DataExplorer from '../data-explorer/data-explorer';
-import { DataColumn, toggleSortDirection, resetSortDirection } from '../../components/data-table/data-column';
+import { DataColumn } 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 { DispatchProp, connect } from 'react-redux';
 import actions from "../../store/data-explorer/data-explorer-action";
+import { DataColumns } from '../../components/data-table/data-table';
 
 export const PROJECT_EXPLORER_ID = "projectExplorer";
 class ProjectExplorer extends React.Component<DispatchProp> {
@@ -139,7 +140,7 @@ const renderStatus = (item: ProjectExplorerItem) =>
         {item.status || "-"}
     </Typography>;
 
-const columns: Array<DataColumn<ProjectExplorerItem>> = [{
+const columns: DataColumns<ProjectExplorerItem> = [{
     name: "Name",
     selected: true,
     sortDirection: "asc",