umami/components/QuickButtons.js
2020-07-30 20:11:43 -07:00

31 lines
688 B
JavaScript

import React from 'react';
import classNames from 'classnames';
import { getDateRange } from 'lib/date';
import styles from './QuickButtons.module.css';
const options = {
'24hour': '24h',
'7day': '7d',
'30day': '30d',
};
export default function QuickButtons({ value, onChange }) {
function handleClick(value) {
onChange(getDateRange(value));
}
return (
<div className={styles.buttons}>
{Object.keys(options).map(key => (
<div
key={key}
className={classNames(styles.button, { [styles.active]: value === key })}
onClick={() => handleClick(key)}
>
{options[key]}
</div>
))}
</div>
);
}