1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import * as React from 'react';
6 import { WithStyles, StyleRulesCallback, Theme, withStyles, IconButton, Paper, List, Checkbox, ListItemText, ListItem } from '@material-ui/core';
7 import MenuIcon from "@material-ui/icons/Menu";
8 import { DataColumn, isColumnConfigurable } from '../data-column';
9 import Popover from "../../popover/popover";
10 import { IconButtonProps } from '@material-ui/core/IconButton';
12 export interface ColumnSelectorProps {
13 columns: Array<DataColumn<any>>;
14 onColumnToggle: (column: DataColumn<any>) => void;
17 const ColumnSelector: React.SFC<ColumnSelectorProps & WithStyles<CssRules>> = ({ columns, onColumnToggle, classes }) =>
18 <Popover triggerComponent={ColumnSelectorTrigger}>
22 .filter(isColumnConfigurable)
23 .map((column, index) => (
27 onClick={() => onColumnToggle(column)}>
31 checked={column.selected}
32 className={classes.checkbox} />
42 export const ColumnSelectorTrigger: React.SFC<IconButtonProps> = (props) =>
43 <IconButton {...props}>
47 type CssRules = "checkbox";
49 const styles: StyleRulesCallback<CssRules> = (theme: Theme) => ({
56 export default withStyles(styles)(ColumnSelector);