Ensured date range filtering is only displayed if Shlink v1.21 ow higer is run

This commit is contained in:
Alejandro Celaya 2020-01-19 21:25:45 +01:00
parent d244b830ac
commit 2236ed467e
3 changed files with 28 additions and 15 deletions

View file

@ -7,19 +7,23 @@ import moment from 'moment';
import SearchField from '../utils/SearchField';
import Tag from '../tags/helpers/Tag';
import DateRangeRow from '../utils/DateRangeRow';
import { formatDate } from '../utils/utils';
import { compareVersions, formatDate } from '../utils/utils';
import { serverType } from '../servers/prop-types';
import { shortUrlsListParamsType } from './reducers/shortUrlsListParams';
import './SearchBar.scss';
const propTypes = {
listShortUrls: PropTypes.func,
shortUrlsListParams: shortUrlsListParamsType,
selectedServer: serverType,
};
const dateOrUndefined = (date) => date ? moment(date) : undefined;
const SearchBar = (colorGenerator) => {
const SearchBar = ({ listShortUrls, shortUrlsListParams }) => {
const SearchBar = ({ listShortUrls, shortUrlsListParams, selectedServer }) => {
const currentServerVersion = selectedServer ? selectedServer.version : '';
const enableDateFiltering = !isEmpty(currentServerVersion) && compareVersions(currentServerVersion, '>=', '1.21.0');
const selectedTags = shortUrlsListParams.tags || [];
const setDate = (dateName) => pipe(
formatDate(),
@ -34,14 +38,16 @@ const SearchBar = (colorGenerator) => {
}
/>
<div className="mt-3">
<DateRangeRow
startDate={dateOrUndefined(shortUrlsListParams.startDate)}
endDate={dateOrUndefined(shortUrlsListParams.endDate)}
onStartDateChange={setDate('startDate')}
onEndDateChange={setDate('endDate')}
/>
</div>
{enableDateFiltering && (
<div className="mt-3">
<DateRangeRow
startDate={dateOrUndefined(shortUrlsListParams.startDate)}
endDate={dateOrUndefined(shortUrlsListParams.endDate)}
onStartDateChange={setDate('startDate')}
onEndDateChange={setDate('endDate')}
/>
</div>
)}
{!isEmpty(selectedTags) && (
<h4 className="search-bar__selected-tag mt-3">

View file

@ -25,7 +25,7 @@ const provideServices = (bottle, connect) => {
));
bottle.serviceFactory('SearchBar', SearchBar, 'ColorGenerator');
bottle.decorator('SearchBar', connect([ 'shortUrlsListParams' ], [ 'listShortUrls' ]));
bottle.decorator('SearchBar', connect([ 'shortUrlsListParams', 'selectedServer' ], [ 'listShortUrls' ]));
bottle.serviceFactory('ShortUrlsList', ShortUrlsList, 'ShortUrlsRow');
bottle.decorator('ShortUrlsList', connect(

View file

@ -22,10 +22,15 @@ describe('<SearchBar />', () => {
expect(wrapper.find(SearchField)).toHaveLength(1);
});
it('renders a DateRangeRow', () => {
wrapper = shallow(<SearchBar shortUrlsListParams={{}} />);
each([
[ '2.0.0', 1 ],
[ '1.21.2', 1 ],
[ '1.21.0', 1 ],
[ '1.20.0', 0 ],
]).it('renders a DateRangeRow when proper version is run', (version, expectedLength) => {
wrapper = shallow(<SearchBar shortUrlsListParams={{}} selectedServer={{ version }} />);
expect(wrapper.find(DateRangeRow)).toHaveLength(1);
expect(wrapper.find(DateRangeRow)).toHaveLength(expectedLength);
});
it('renders no tags when the list of tags is empty', () => {
@ -63,7 +68,9 @@ describe('<SearchBar />', () => {
});
each([ 'startDateChange', 'endDateChange' ]).it('updates short URLs list when date range changes', (event) => {
wrapper = shallow(<SearchBar shortUrlsListParams={{}} listShortUrls={listShortUrlsMock} />);
wrapper = shallow(
<SearchBar shortUrlsListParams={{}} listShortUrls={listShortUrlsMock} selectedServer={{ version: '2.0.0' }} />
);
const dateRange = wrapper.find(DateRangeRow);
expect(listShortUrlsMock).not.toHaveBeenCalled();