import React from 'react';
import PropTypes from 'prop-types';
import { Link } from 'react-router';
import { Switch, Chip, ListItem } from 'react-mdl';
import Progress from './progress';
import { calc, styles as commonStyles } from '../common';
import styles from './feature.scss';
const Feature = ({
feature,
toggleFeature,
settings,
metricsLastHour = { yes: 0, no: 0, isFallback: true },
metricsLastMinute = { yes: 0, no: 0, isFallback: true },
}) => {
const { name, description, enabled, strategies } = feature;
const { showLastHour = false } = settings;
const isStale = showLastHour ? metricsLastHour.isFallback : metricsLastMinute.isFallback;
const percent =
1 *
(showLastHour
? calc(metricsLastHour.yes, metricsLastHour.yes + metricsLastHour.no, 0)
: calc(metricsLastMinute.yes, metricsLastMinute.yes + metricsLastMinute.no, 0));
const strategiesToShow = Math.min(strategies.length, 3);
const remainingStrategies = strategies.length - strategiesToShow;
const strategyChips =
strategies &&
strategies.slice(0, strategiesToShow).map((s, i) => (
{s.name}
));
const summaryChip = remainingStrategies > 0 && +{remainingStrategies};
return (
toggleFeature(name)}
checked={enabled}
/>
{name}
{description}
{strategyChips}
{summaryChip}
);
};
Feature.propTypes = {
feature: PropTypes.object,
toggleFeature: PropTypes.func,
settings: PropTypes.object,
metricsLastHour: PropTypes.object,
metricsLastMinute: PropTypes.object,
};
export default Feature;