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

src/short-urls/SearchBar.js

@@ -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">

src/short-urls/services/provideServices.js

@@ -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(