openreplay/frontend/app/components/Dashboard/components/WidgetDateRange/WidgetDateRange.tsx
2022-06-20 17:25:54 +02:00

36 lines
No EOL
1.1 KiB
TypeScript

import React from 'react';
import SelectDateRange from 'Shared/SelectDateRange';
import { useStore } from 'App/mstore';
import { useObserver } from 'mobx-react-lite';
interface Props {
}
function WidgetDateRange(props: Props) {
const { dashboardStore } = useStore();
const period = useObserver(() => dashboardStore.drillDownPeriod);
const drillDownFilter = useObserver(() => dashboardStore.drillDownFilter);
const onChangePeriod = (period: any) => {
dashboardStore.setDrillDownPeriod(period);
const periodTimestamps = period.toTimestamps();
drillDownFilter.merge({
startTimestamp: periodTimestamps.startTimestamp,
endTimestamp: periodTimestamps.endTimestamp,
})
}
return (
<>
<span className="mr-1 color-gray-medium">Time Range</span>
<SelectDateRange
period={period}
// onChange={(period: any) => metric.setPeriod(period)}
onChange={onChangePeriod}
right={true}
/>
</>
);
}
export default WidgetDateRange;