Skip to content

[FIX] Invalid filters on the Omnichannel Analytics page #19899

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
renatobecker merged 18 commits into from
Jan 14, 2021
Merged

[FIX] Invalid filters on the Omnichannel Analytics page #19899

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
234ddb0
[FIX] Omnichannel Analytics Page
Dec 18, 2020
415e87e
Merge branch 'develop' into omnichannel/fix-analytics-page-layout-1
murtaza98 Dec 18, 2020
d2b906f
Merge branch 'develop' into omnichannel/fix-analytics-page-layout-1
murtaza98 Dec 19, 2020
8c3be85
Merge branch 'develop' into omnichannel/fix-analytics-page-layout-1
renatobecker Dec 21, 2020
f12e9de
Merge branch 'develop' into omnichannel/fix-analytics-page-layout-1
murtaza98 Dec 22, 2020
63f4b13
Merge branch 'develop' into omnichannel/fix-analytics-page-layout-1
renatobecker Jan 11, 2021
71cadd3
Fix error logs appearing on server
Jan 12, 2021
2ab8d9f
Merge branch 'develop' into omnichannel/fix-analytics-page-layout-1
renatobecker Jan 12, 2021
3c25031
Change layout for filter inputs
Jan 13, 2021
77e0bb7
Merge branch 'omnichannel/fix-analytics-page-layout-1' of https://git…
Jan 13, 2021
bc7c962
Merge branch 'develop' into omnichannel/fix-analytics-page-layout-1
renatobecker Jan 13, 2021
88d9442
Apply suggestions from code review
Jan 13, 2021
7f394e5
Merge branch 'develop' into omnichannel/fix-analytics-page-layout-1
renatobecker Jan 13, 2021
d6a25f3
Merge branch 'develop' into omnichannel/fix-analytics-page-layout-1
renatobecker Jan 14, 2021
48bb99b
Merge branch 'develop' into omnichannel/fix-analytics-page-layout-1
murtaza98 Jan 14, 2021
ede0834
Apply suggestion from code review
murtaza98 Jan 14, 2021
6c23115
Apply suggestions from code review
murtaza98 Jan 14, 2021
9d6056a
Minor fix - renaming issue
murtaza98 Jan 14, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 14 additions & 20 deletions client/views/omnichannel/analytics/AnalyticsPage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,27 +50,21 @@ const AnalyticsPage = () => {
<Page.Header title={t('Analytics')}/>
<Page.ScrollableContentWithShadow display='flex' flexDirection='column'>
<Margins block='x4'>
<Box display='flex' flexDirection='row' justifyContent='space-between' flexWrap='wrap' mi='neg-x4' mb='neg-x4'>
<Box display='flex' flexWrap='nowrap' flexGrow={1} flexShrink={1} justifyContent='stretch' mb='x4'>
<Margins inline='x2'>
<Field>
<Field.Label>{t('Type')}</Field.Label>
<Field.Row>
<Select options={typeOptions} value={type} onChange={setType} />
</Field.Row>
</Field>
</Margins>
<Margins inline='x2'>
<Field>
<Field.Label>{t('Departments')}</Field.Label>
<Field.Row>
<DepartmentAutoComplete placeholder={t('All')} value={departmentId} onChange={setDepartmentId}/>
</Field.Row>
</Field>
</Margins>
</Box>
<DateRangePicker mi='none' mb='x4' flexWrap='nowrap' display='flex' flexGrow={1} flexShrink={1} justifyContent='stretch' onChange={setDateRange}/>
<Box flexDirection='row' display='flex' justifyContent='space-between' alignSelf='center' w='full'>
<Field mie='x4' flexShrink={1}>
<Field.Label>{t('Type')}</Field.Label>
<Field.Row>
<Select options={typeOptions} value={type} onChange={setType} />
</Field.Row>
</Field>
<Field mis='x4' flexShrink={1}>
<Field.Label>{t('Departments')}</Field.Label>
<Field.Row>
<DepartmentAutoComplete placeholder={t('All')} value={departmentId} onChange={setDepartmentId}/>
</Field.Row>
</Field>
</Box>
<DateRangePicker flexDirection='row' display='flex' justifyContent='space-between' alignSelf='center' w='full' onChange={setDateRange}/>
<Box>
<Overview type={type} dateRange={dateRange} departmentId={departmentId}/>
</Box>
Expand Down
73 changes: 26 additions & 47 deletions client/views/omnichannel/analytics/DateRangePicker.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,42 +1,23 @@
import React, { useState, useMemo, useEffect } from 'react';
import { Box, InputBox, Menu, Margins, Field } from '@rocket.chat/fuselage';
import { Box, InputBox, Menu, Field } from '@rocket.chat/fuselage';
import { useMutableCallback } from '@rocket.chat/fuselage-hooks';
import moment from 'moment';

import { useTranslation } from '../../../contexts/TranslationContext';

const date = new Date();
const formatToDateInput = (date) => date.format('YYYY-MM-DD');

const formatToDateInput = (date) => date.toISOString().slice(0, 10);
const todayDate = formatToDateInput(moment());

const todayDate = formatToDateInput(date);
const getMonthRange = (monthsToSubtractFromToday) => ({
start: formatToDateInput(moment().subtract(monthsToSubtractFromToday, 'month').date(1)),
end: formatToDateInput(monthsToSubtractFromToday === 0 ? moment() : moment().subtract(monthsToSubtractFromToday).date(0)),
});

const getMonthRange = (monthsToSubtractFromToday) => {
const date = new Date();
return {
start: formatToDateInput(new Date(
date.getFullYear(),
date.getMonth() - monthsToSubtractFromToday,
1)),
end: formatToDateInput(new Date(
date.getFullYear(),
date.getMonth() - monthsToSubtractFromToday + 1,
0)),
};
};

const getWeekRange = (daysToSubtractFromStart, daysToSubtractFromEnd) => {
const date = new Date();
return {
start: formatToDateInput(new Date(
date.getFullYear(),
date.getMonth(),
date.getDate() - daysToSubtractFromStart)),
end: formatToDateInput(new Date(
date.getFullYear(),
date.getMonth(),
date.getDate() - daysToSubtractFromEnd)),
};
};
const getWeekRange = (daysToSubtractFromStart, daysToSubtractFromEnd) => ({
start: formatToDateInput(moment().subtract(daysToSubtractFromStart, 'day')),
end: formatToDateInput(moment().subtract(daysToSubtractFromEnd, 'day')),
});

const DateRangePicker = ({ onChange = () => {}, ...props }) => {
const t = useTranslation();
Expand Down Expand Up @@ -110,22 +91,20 @@ const DateRangePicker = ({ onChange = () => {}, ...props }) => {
},
}), [handleRange, t]);

return <Box mi='neg-x4' {...props}>
<Margins inline='x4'>
<Field>
<Field.Label>{t('Start')}</Field.Label>
<Field.Row>
<InputBox type='date' onChange={handleStart} max={todayDate} value={start}/>
</Field.Row>
</Field>
<Field>
<Field.Label>{t('End')}</Field.Label>
<Field.Row>
<InputBox type='date' onChange={handleEnd} min={start} max={todayDate} value={end}/>
<Menu options={options}/>
</Field.Row>
</Field>
</Margins>
return <Box {...props}>
<Field mis='x4' flexShrink={1}>
<Field.Label>{t('Start')}</Field.Label>
<Field.Row>
<InputBox type='date' onChange={handleStart} max={todayDate} value={start}/>
</Field.Row>
</Field>
<Field mis='x4' flexShrink={1}>
<Field.Label>{t('End')}</Field.Label>
<Field.Row>
<InputBox type='date' onChange={handleEnd} min={start} max={todayDate} value={end}/>
<Menu options={options}/>
</Field.Row>
</Field>
</Box>;
};

Expand Down