diff --git a/src/short-urls/ShortUrlsFilteringBar.tsx b/src/short-urls/ShortUrlsFilteringBar.tsx
index 48ef9d50..a5380be0 100644
--- a/src/short-urls/ShortUrlsFilteringBar.tsx
+++ b/src/short-urls/ShortUrlsFilteringBar.tsx
@@ -73,8 +73,7 @@ const ShortUrlsFilteringBar = (colorGenerator: ColorGenerator) => ({ selectedSer
tooltip={{ placement: 'left' }}
onChange={toggleTagsMode}
>
- {tagsMode === 'all' && 'Short URLs including all tags.'}
- {tagsMode !== 'all' && 'Short URLs including any tag.'}
+ {tagsMode === 'all' ? 'Short URLs including all tags.' : 'Short URLs including any tag.'}
)}
diff --git a/test/short-urls/SearchBar.test.tsx b/test/short-urls/ShortUrlsFilteringBar.test.tsx
similarity index 56%
rename from test/short-urls/SearchBar.test.tsx
rename to test/short-urls/ShortUrlsFilteringBar.test.tsx
index 833893d0..e8718216 100644
--- a/test/short-urls/SearchBar.test.tsx
+++ b/test/short-urls/ShortUrlsFilteringBar.test.tsx
@@ -7,7 +7,8 @@ import SearchField from '../../src/utils/SearchField';
import Tag from '../../src/tags/helpers/Tag';
import { DateRangeSelector } from '../../src/utils/dates/DateRangeSelector';
import ColorGenerator from '../../src/utils/services/ColorGenerator';
-import { SelectedServer } from '../../src/servers/data';
+import { ReachableServer, SelectedServer } from '../../src/servers/data';
+import { TooltipToggleSwitch } from '../../src/utils/TooltipToggleSwitch';
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
@@ -21,11 +22,11 @@ describe('', () => {
const ShortUrlsFilteringBar = filteringBarCreator(Mock.all());
const navigate = jest.fn();
const now = new Date();
- const createWrapper = (search = '') => {
+ const createWrapper = (search = '', selectedServer?: SelectedServer) => {
(useLocation as any).mockReturnValue({ search });
(useNavigate as any).mockReturnValue(navigate);
- wrapper = shallow(()} />);
+ wrapper = shallow(()} />);
return wrapper;
};
@@ -84,4 +85,46 @@ describe('', () => {
dateRange.simulate('datesChange', dates);
expect(navigate).toHaveBeenCalledWith(`/server/1/list-short-urls/1?${expectedQuery}`);
});
+
+ it.each([
+ [ 'tags=foo,bar,baz', Mock.of({ version: '3.0.0' }), 1 ],
+ [ 'tags=foo,bar', Mock.of({ version: '3.1.0' }), 1 ],
+ [ 'tags=foo', Mock.of({ version: '3.0.0' }), 0 ],
+ [ '', Mock.of({ version: '3.0.0' }), 0 ],
+ [ 'tags=foo,bar,baz', Mock.of({ version: '2.10.0' }), 0 ],
+ [ '', Mock.of({ version: '2.10.0' }), 0 ],
+ ])(
+ 'renders tags mode toggle if the server supports it and there is more than one tag selected',
+ (search, selectedServer, expectedTagToggleComponents) => {
+ const wrapper = createWrapper(search, selectedServer);
+ const toggle = wrapper.find(TooltipToggleSwitch);
+
+ expect(toggle).toHaveLength(expectedTagToggleComponents);
+ },
+ );
+
+ it.each([
+ [ '', 'Short URLs including any tag.', false ],
+ [ '&tagsMode=all', 'Short URLs including all tags.', true ],
+ [ '&tagsMode=any', 'Short URLs including any tag.', false ],
+ ])('expected tags mode tooltip title', (initialTagsMode, expectedToggleText, expectedChecked) => {
+ const wrapper = createWrapper(`tags=foo,bar${initialTagsMode}`, Mock.of({ version: '3.0.0' }));
+ const toggle = wrapper.find(TooltipToggleSwitch);
+
+ expect(toggle.prop('children')).toEqual(expectedToggleText);
+ expect(toggle.prop('checked')).toEqual(expectedChecked);
+ });
+
+ it.each([
+ [ '', 'tagsMode=all' ],
+ [ '&tagsMode=all', 'tagsMode=any' ],
+ [ '&tagsMode=any', 'tagsMode=all' ],
+ ])('redirects to first page when tags mode changes', (initialTagsMode, expectedRedirectTagsMode) => {
+ const wrapper = createWrapper(`tags=foo,bar${initialTagsMode}`, Mock.of({ version: '3.0.0' }));
+ const toggle = wrapper.find(TooltipToggleSwitch);
+
+ expect(navigate).not.toHaveBeenCalled();
+ toggle.simulate('change');
+ expect(navigate).toHaveBeenCalledWith(expect.stringContaining(expectedRedirectTagsMode));
+ });
});