2021-06-29 10:21:54 +02:00
|
|
|
import {
|
|
|
|
List,
|
|
|
|
ListItem,
|
|
|
|
ListItemAvatar,
|
|
|
|
ListItemText,
|
|
|
|
Tooltip,
|
|
|
|
} from '@material-ui/core';
|
|
|
|
import { PlayArrow, Pause } from '@material-ui/icons';
|
|
|
|
|
2021-03-30 15:14:02 +02:00
|
|
|
import styles from '../common/common.module.scss';
|
|
|
|
import { Link } from 'react-router-dom';
|
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
import React from 'react';
|
|
|
|
import ConditionallyRender from '../common/ConditionallyRender/ConditionallyRender';
|
|
|
|
|
|
|
|
export const TogglesLinkList = ({ toggles }) => (
|
|
|
|
<List style={{ textAlign: 'left' }} className={styles.truncate}>
|
|
|
|
<ConditionallyRender
|
|
|
|
condition={toggles.length > 0}
|
2021-06-29 10:21:54 +02:00
|
|
|
show={toggles.map(({ name, description = '-', enabled }) => (
|
2021-03-30 15:14:02 +02:00
|
|
|
<ListItem key={name}>
|
|
|
|
<Tooltip title={enabled ? 'Enabled' : 'Disabled'}>
|
|
|
|
<ListItemAvatar>
|
2021-06-29 10:21:54 +02:00
|
|
|
{enabled ? <PlayArrow /> : <Pause />}
|
2021-03-30 15:14:02 +02:00
|
|
|
</ListItemAvatar>
|
|
|
|
</Tooltip>
|
|
|
|
<ListItemText
|
|
|
|
primary={
|
|
|
|
<Link key={name} to={`/features/view/${name}`}>
|
|
|
|
{name}
|
|
|
|
</Link>
|
|
|
|
}
|
|
|
|
secondary={description}
|
|
|
|
/>
|
|
|
|
</ListItem>
|
|
|
|
))}
|
|
|
|
/>
|
|
|
|
</List>
|
|
|
|
);
|
|
|
|
TogglesLinkList.propTypes = {
|
|
|
|
toggles: PropTypes.array,
|
|
|
|
};
|