X-Git-Url: https://git.arvados.org/arvados.git/blobdiff_plain/9e4b7889a99ff2f76d8029aef3a85c4620178ba3..10ce16c28de952f6533ca3cc9df909269e3d2a53:/src/components/column-selector/column-selector.tsx

diff --git a/src/components/column-selector/column-selector.tsx b/src/components/column-selector/column-selector.tsx
index e2286b0018..0f496e25cd 100644
--- a/src/components/column-selector/column-selector.tsx
+++ b/src/components/column-selector/column-selector.tsx
@@ -3,18 +3,32 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import * as React from 'react';
-import { WithStyles, StyleRulesCallback, Theme, withStyles, IconButton, Paper, List, Checkbox, ListItemText, ListItem } from '@material-ui/core';
+import { WithStyles, StyleRulesCallback, withStyles, IconButton, Paper, List, Checkbox, ListItemText, ListItem } from '@material-ui/core';
 import MenuIcon from "@material-ui/icons/Menu";
 import { DataColumn, isColumnConfigurable } from '../data-table/data-column';
-import Popover from "../popover/popover";
+import { Popover } from "../popover/popover";
 import { IconButtonProps } from '@material-ui/core/IconButton';
+import { DataColumns } from '../data-table/data-table';
+import { ArvadosTheme } from "../../common/custom-theme";
 
-export interface ColumnSelectorProps {
-    columns: Array<DataColumn<any>>;
+interface ColumnSelectorDataProps {
+    columns: DataColumns<any>;
     onColumnToggle: (column: DataColumn<any>) => void;
 }
 
-const ColumnSelector: React.SFC<ColumnSelectorProps & WithStyles<CssRules>> = ({ columns, onColumnToggle, classes }) =>
+type CssRules = "checkbox";
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+    checkbox: {
+        width: 24,
+        height: 24
+    }
+});
+
+export type ColumnSelectorProps = ColumnSelectorDataProps & WithStyles<CssRules>;
+
+export const ColumnSelector = withStyles(styles)(
+    ({ columns, onColumnToggle, classes }: ColumnSelectorProps) =>
     <Popover triggerComponent={ColumnSelectorTrigger}>
         <Paper>
             <List dense>
@@ -37,20 +51,10 @@ const ColumnSelector: React.SFC<ColumnSelectorProps & WithStyles<CssRules>> = ({
                     ))}
             </List>
         </Paper>
-    </Popover>;
+    </Popover>
+);
 
-export const ColumnSelectorTrigger: React.SFC<IconButtonProps> = (props) =>
+export const ColumnSelectorTrigger = (props: IconButtonProps) =>
     <IconButton {...props}>
         <MenuIcon />
     </IconButton>;
-
-type CssRules = "checkbox";
-
-const styles: StyleRulesCallback<CssRules> = (theme: Theme) => ({
-    checkbox: {
-        width: 24,
-        height: 24
-    }
-});
-
-export default withStyles(styles)(ColumnSelector);