1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import * as React from 'react';
6 import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core/styles';
7 import { ArvadosTheme } from '~/common/custom-theme';
8 import { Grid, Typography, Switch } from '@material-ui/core';
10 type CssRules = 'grid' | 'label' | 'value' | 'switch';
12 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
18 color: theme.palette.grey["500"],
23 paddingLeft: theme.spacing.unit
26 '& span:first-child': {
32 export interface SubprocessFilterDataProps {
37 onToggle?: () => void;
40 type SubprocessFilterProps = SubprocessFilterDataProps & WithStyles<CssRules>;
42 export const SubprocessFilter = withStyles(styles)(
43 ({ classes, label, value, key, checked, onToggle }: SubprocessFilterProps) =>
44 <Grid item className={classes.grid} md={12} lg={6} >
45 <Typography component="span" className={classes.label}>{label}:</Typography>
46 <Typography component="span" className={classes.value}>{value}</Typography>
47 {onToggle && <Switch classes={{ root: classes.switch }}