1 files changed, 5 insertions, 26 deletions

diff --git a/modern/src/reports/ReplayPage.js b/modern/src/reports/ReplayPage.js
index 6b84d4d9..5c27cb52 100644
--- a/modern/src/reports/ReplayPage.js
+++ b/modern/src/reports/ReplayPage.js
@@ -1,13 +1,13 @@
 import React, { useState } from 'react';
-import { Accordion, AccordionDetails, AccordionSummary, Button, Container, FormControl, makeStyles, Paper, Slider, Tooltip, Typography } from '@material-ui/core';
+import { Accordion, AccordionDetails, AccordionSummary, Container, makeStyles, Paper, Slider, Tooltip, Typography } from '@material-ui/core';
 import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import MainToolbar from '../MainToolbar';
 import Map from '../map/Map';
 import t from '../common/localization';
-import FilterForm from './FilterForm';
 import ReplayPathMap from '../map/ReplayPathMap';
 import PositionsMap from '../map/PositionsMap';
 import { formatPosition } from '../common/formatter';
+import ReportFilter from './ReportFilter';
 
 const useStyles = makeStyles(theme => ({
   root: {
@@ -43,21 +43,11 @@ const ReplayPage = () => {
   const classes = useStyles();
 
   const [expanded, setExpanded] = useState(true);
-
-  const [deviceId, setDeviceId] = useState();
-  const [from, setFrom] = useState();
-  const [to, setTo] = useState();
-
   const [positions, setPositions] = useState([]);
-
   const [index, setIndex] = useState(0);
 
-  const handleShow = async () => {
-    const query = new URLSearchParams({
-      deviceId,
-      from: from.toISOString(),
-      to: to.toISOString(),
-    });
+  const handleSubmit = async (deviceId, from, to) => {
+    const query = new URLSearchParams({ deviceId, from, to });
     const response = await fetch(`/api/positions?${query.toString()}`, { headers: { 'Accept': 'application/json' } });
     if (response.ok) {
       setIndex(0);
@@ -98,18 +88,7 @@ const ReplayPage = () => {
               </Typography>
             </AccordionSummary>
             <AccordionDetails className={classes.configForm}>
-              <FilterForm
-                deviceId={deviceId}
-                setDeviceId={setDeviceId}
-                from={from}
-                setFrom={setFrom}
-                to={to}
-                setTo={setTo} />
-              <FormControl margin='normal' fullWidth>
-                <Button type='button' color='primary' variant='contained' disabled={!deviceId} onClick={handleShow}>
-                  {t('reportShow')}
-                </Button>
-              </FormControl>
+              <ReportFilter handleSubmit={handleSubmit} />;
             </AccordionDetails>
           </Accordion>
         </div>