Added changes to load orphan visits and fixed tests

test/api/services/ShlinkApiClient.test.ts

@@ -313,6 +313,20 @@ describe('ShlinkApiClient', () => {
     });
   });
 
+  describe('getNonOrphanVisits', () => {
+    it('returns non-orphan visits', async () => {
+      const expectedData: Visit[] = [];
+      const resp = { visits: expectedData };
+      const axiosSpy = createAxiosMock({ data: resp });
+      const { getNonOrphanVisits } = new ShlinkApiClient(axiosSpy, '', '');
+
+      const result = await getNonOrphanVisits();
+
+      expect(axiosSpy).toHaveBeenCalled();
+      expect(result).toEqual(expectedData);
+    });
+  });
+
   describe('editDomainRedirects', () => {
     it('returns the redirects', async () => {
       const resp = { baseUrlRedirect: null, regular404Redirect: 'foo', invalidShortUrlRedirect: 'bar' };

test/common/MenuLayout.test.tsx

@@ -11,7 +11,7 @@ import { SemVer } from '../../src/utils/helpers/version';
 describe('<MenuLayout />', () => {
   const ServerError = jest.fn();
   const C = jest.fn();
-  const MenuLayout = createMenuLayout(C, C, C, C, C, C, C, ServerError, C, C, C);
+  const MenuLayout = createMenuLayout(C, C, C, C, C, C, C, C, ServerError, C, C, C);
   let wrapper: ShallowWrapper;
   const createWrapper = (selectedServer: SelectedServer) => {
     wrapper = shallow(
@@ -52,6 +52,9 @@ describe('<MenuLayout />', () => {
     [ '2.5.0' as SemVer, 8 ],
     [ '2.6.0' as SemVer, 9 ],
     [ '2.7.0' as SemVer, 9 ],
+    [ '2.8.0' as SemVer, 10 ],
+    [ '2.10.0' as SemVer, 10 ],
+    [ '3.0.0' as SemVer, 11 ],
   ])('has expected amount of routes based on selected server\'s version', (version, expectedAmountOfRoutes) => {
     const selectedServer = Mock.of<ReachableServer>({ version });
     const wrapper = createWrapper(selectedServer).dive();

test/servers/Overview.test.tsx

@@ -1,8 +1,7 @@
 import { FC } from 'react';
-import { shallow, ShallowWrapper } from 'enzyme';
+import { mount, ReactWrapper } from 'enzyme';
 import { Mock } from 'ts-mockery';
-import { CardText } from 'reactstrap';
-import { Link } from 'react-router-dom';
+import { Link, MemoryRouter } from 'react-router-dom';
 import { ShortUrlsList as ShortUrlsListState } from '../../src/short-urls/reducers/shortUrlsList';
 import { Overview as overviewCreator } from '../../src/servers/Overview';
 import { TagsList } from '../../src/tags/reducers/tagsList';
@@ -10,9 +9,10 @@ import { VisitsOverview } from '../../src/visits/reducers/visitsOverview';
 import { MercureInfo } from '../../src/mercure/reducers/mercureInfo';
 import { ReachableServer } from '../../src/servers/data';
 import { prettify } from '../../src/utils/helpers/numbers';
+import { HighlightCard } from '../../src/servers/helpers/HighlightCard';
 
 describe('<Overview />', () => {
-  let wrapper: ShallowWrapper;
+  let wrapper: ReactWrapper;
   const ShortUrlsTable = () => null;
   const CreateShortUrl = () => null;
   const ForServerVersion: FC = ({ children }) => <>{children}</>;
@@ -25,20 +25,22 @@ describe('<Overview />', () => {
   };
   const serverId = '123';
   const createWrapper = (loading = false) => {
-    wrapper = shallow(
-      <Overview
-        listShortUrls={listShortUrls}
-        listTags={listTags}
-        loadVisitsOverview={loadVisitsOverview}
-        shortUrlsList={Mock.of<ShortUrlsListState>({ loading, shortUrls })}
-        tagsList={Mock.of<TagsList>({ loading, tags: [ 'foo', 'bar', 'baz' ] })}
-        visitsOverview={Mock.of<VisitsOverview>({ loading, visitsCount: 3456, orphanVisitsCount: 28 })}
-        selectedServer={Mock.of<ReachableServer>({ id: serverId })}
-        createNewVisits={jest.fn()}
-        loadMercureInfo={jest.fn()}
-        mercureInfo={Mock.all<MercureInfo>()}
-      />,
-    ).dive(); // Dive is needed as this component is wrapped in a HOC
+    wrapper = mount(
+      <MemoryRouter>
+        <Overview
+          listShortUrls={listShortUrls}
+          listTags={listTags}
+          loadVisitsOverview={loadVisitsOverview}
+          shortUrlsList={Mock.of<ShortUrlsListState>({ loading, shortUrls })}
+          tagsList={Mock.of<TagsList>({ loading, tags: [ 'foo', 'bar', 'baz' ] })}
+          visitsOverview={Mock.of<VisitsOverview>({ loading, visitsCount: 3456, orphanVisitsCount: 28 })}
+          selectedServer={Mock.of<ReachableServer>({ id: serverId })}
+          createNewVisits={jest.fn()}
+          loadMercureInfo={jest.fn()}
+          mercureInfo={Mock.all<MercureInfo>()}
+        />
+      </MemoryRouter>,
+    );
 
     return wrapper;
   };
@@ -47,7 +49,7 @@ describe('<Overview />', () => {
 
   it('displays loading messages when still loading', () => {
     const wrapper = createWrapper(true);
-    const cards = wrapper.find(CardText);
+    const cards = wrapper.find(HighlightCard);
 
     expect(cards).toHaveLength(4);
     cards.forEach((card) => expect(card.html()).toContain('Loading...'));
@@ -55,7 +57,7 @@ describe('<Overview />', () => {
 
   it('displays amounts in cards after finishing loading', () => {
     const wrapper = createWrapper();
-    const cards = wrapper.find(CardText);
+    const cards = wrapper.find(HighlightCard);
 
     expect(cards).toHaveLength(4);
     expect(cards.at(0).html()).toContain(prettify(3456));
@@ -75,8 +77,10 @@ describe('<Overview />', () => {
     const wrapper = createWrapper();
     const links = wrapper.find(Link);
 
-    expect(links).toHaveLength(2);
-    expect(links.at(0).prop('to')).toEqual(`/server/${serverId}/create-short-url`);
-    expect(links.at(1).prop('to')).toEqual(`/server/${serverId}/list-short-urls/1`);
+    expect(links).toHaveLength(4);
+    expect(links.at(0).prop('to')).toEqual(`/server/${serverId}/list-short-urls/1`);
+    expect(links.at(1).prop('to')).toEqual(`/server/${serverId}/manage-tags`);
+    expect(links.at(2).prop('to')).toEqual(`/server/${serverId}/create-short-url`);
+    expect(links.at(3).prop('to')).toEqual(`/server/${serverId}/list-short-urls/1`);
   });
 });

test/servers/helpers/HighlightCard.test.tsx

@@ -15,8 +15,11 @@ describe('<HighlightCard />', () => {
 
   afterEach(() => wrapper?.unmount());
 
-  it('renders expected components', () => {
-    const wrapper = createWrapper({ title: 'foo' });
+  it.each([
+    [ undefined ],
+    [ false ],
+  ])('renders expected components', (link) => {
+    const wrapper = createWrapper({ title: 'foo', link: link as undefined | false });
 
     expect(wrapper.find(Card)).toHaveLength(1);
     expect(wrapper.find(CardTitle)).toHaveLength(1);