Fix custom date range display. Closes #923, #921

This commit is contained in:
Mike Cao 2022-01-20 19:54:58 -08:00
parent 2baf4b19fe
commit 547eefae82
4 changed files with 17 additions and 8 deletions

View file

@ -1,6 +1,6 @@
import React from 'react';
import { FormattedMessage } from 'react-intl';
import DateFilter from 'components/common/DateFilter';
import DateFilter, { filterOptions } from 'components/common/DateFilter';
import Button from 'components/common/Button';
import useDateRange from 'hooks/useDateRange';
import { DEFAULT_DATE_RANGE } from 'lib/constants';
@ -12,6 +12,7 @@ export default function DateRangeSetting() {
const { locale } = useLocale();
const [dateRange, setDateRange] = useDateRange();
const { startDate, endDate, value } = dateRange;
const options = filterOptions.filter(e => e.value !== 'all');
function handleReset() {
setDateRange(getDateRange(DEFAULT_DATE_RANGE, locale));
@ -19,7 +20,13 @@ export default function DateRangeSetting() {
return (
<>
<DateFilter value={value} startDate={startDate} endDate={endDate} onChange={setDateRange} />
<DateFilter
options={options}
value={value}
startDate={startDate}
endDate={endDate}
onChange={setDateRange}
/>
<Button className={styles.button} size="small" onClick={handleReset}>
<FormattedMessage id="label.reset" defaultMessage="Reset" />
</Button>