feature/watchlist: final layout touch and tests

fefifef · May 14, 2022 · 802ac65 · 802ac65
1 parent 43ee2b6
commit 802ac65
Show file tree

Hide file tree

Showing 6 changed files with 94 additions and 29 deletions.
diff --git a/Frontend/src/components/common/SearchResultsTable.jsx b/Frontend/src/components/common/SearchResultsTable.jsx
@@ -21,7 +21,7 @@ const SearchResultsTable = props => {
    * @returns {boolean}
    */
   const checkAssetInWatchLists = asset => {
-    let isAssetInWatchList = false
+    let isAssetInWatchList = false;
     props.assetsListArray.forEach(innerArray => {
       innerArray.forEach(assetInWatchList => {
         if (assetInWatchList.name === asset.name || assetInWatchList.name === asset.symbol) {
@@ -32,7 +32,6 @@ const SearchResultsTable = props => {
     return isAssetInWatchList;
   }
 
-  let navigate = useNavigate();
   const routeChange = path => {
     navigate(path);
   } 
@@ -94,13 +93,12 @@ const SearchResultsTable = props => {
             item
             className={`d-flex flex-column ${props.watchListsArray && props.watchListsArray.length > 0 ? 'flex-xl-row flex-grow-1 col-1 pe-4' : 'col-9 col-sm-10'}`}>
             <Link
-              className='col-12 text-decoration-none text-black'
+              className={`d-flex flex-grow-1 text-decoration-none text-black ${props.watchListsArray && props.watchListsArray.length > 0 && 'col-xl-8'}`}
               to={`/asset/${element.assetType}/${element.symbol}`}
               key={`search_result_links_${index}`}
             >
               <Typography
                 noWrap
-                className={`${props.watchListsArray && props.watchListsArray.length > 0 && 'col-xl-8'}`}
                 fontSize={{
                   lg: 16,
                   md: 15,

diff --git a/Frontend/src/components/screens/Analysis/__test__/AnalysisScreen.test.jsx b/Frontend/src/components/screens/Analysis/__test__/AnalysisScreen.test.jsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import {BrowserRouter} from 'react-router-dom';
 import AnalysisScreen from '../AnalysisScreen';
 import AnalysisDetailItem from '../AnalysisDetailitem';
 import {shallow, mount, configure} from 'enzyme';
@@ -36,17 +37,19 @@ it('AnalysisScreen renders without crashing', () => {
     }
   }
 
-  const tree = shallow(<AnalysisScreen
-    searchResult={[]}
-    setSearchResult={setSearchResult}
-    watchListsArray={[]}
-    assetsListArray={[[]]}
-    portfolioData={portfolioData}
-    activePortfolio={'Portfolio'}
-    setPortfolioData={setPortfolioData}
-    setStatusMessage={setStatusMessage}
-    setMessageType={setMessageType}
-  />);
+  const tree = shallow(<BrowserRouter>
+    <AnalysisScreen
+      searchResult={[]}
+      setSearchResult={setSearchResult}
+      watchListsArray={[]}
+      assetsListArray={[[]]}
+      portfolioData={portfolioData}
+      activePortfolio={'Portfolio'}
+      setPortfolioData={setPortfolioData}
+      setStatusMessage={setStatusMessage}
+      setMessageType={setMessageType}
+    />
+  </BrowserRouter>);
 
   expect(toJson(tree)).toMatchSnapshot();
 });

diff --git a/Frontend/src/components/screens/Analysis/__test__/__snapshots__/AnalysisScreen.test.jsx.snap b/Frontend/src/components/screens/Analysis/__test__/__snapshots__/AnalysisScreen.test.jsx.snap
@@ -1,21 +1,77 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`AnalysisScreen renders without crashing 1`] = `
-<Fragment>
-  <ScreensTemplate
+<Router
+  location={
+    Object {
+      "hash": "",
+      "key": "default",
+      "pathname": "/",
+      "search": "",
+      "state": null,
+    }
+  }
+  navigationType="POP"
+  navigator={
+    Object {
+      "action": "POP",
+      "back": [Function],
+      "block": [Function],
+      "createHref": [Function],
+      "forward": [Function],
+      "go": [Function],
+      "listen": [Function],
+      "location": Object {
+        "hash": "",
+        "key": "default",
+        "pathname": "/",
+        "search": "",
+        "state": null,
+      },
+      "push": [Function],
+      "replace": [Function],
+    }
+  }
+>
+  <AnalysisScreen
+    activePortfolio="Portfolio"
     assetsListArray={
       Array [
         Array [],
       ]
     }
-    bodyComponent={[Function]}
+    portfolioData={
+      Object {
+        "Portfolio": Object {
+          "activities": Array [],
+          "activitiesLastId": -1,
+          "cash": Array [],
+          "cashValue": 0,
+          "crypto": Array [],
+          "cryptoValue": 0,
+          "dailyDataForPerformanceGraph": Object {},
+          "dailyDataForValueDevelopment": Object {},
+          "gains": 0,
+          "name": "Portfolio",
+          "performanceWithRealisedGains": 0,
+          "performanceWithoutRealisedGains": 0,
+          "realisedGains": 0,
+          "shareValue": 0,
+          "shares": Array [],
+          "totalGains": 0,
+          "updated": "1970-01-01",
+          "value": 0,
+        },
+      }
+    }
     searchResult={Array []}
-    selectedNavLinkIndex={3}
     setMessageType={[MockFunction]}
+    setPortfolioData={[MockFunction]}
     setSearchResult={[MockFunction]}
     setStatusMessage={[MockFunction]}
+    watchListsArray={Array []}
   />
-</Fragment>
+</Router>
 `;
 
 exports[`Snapshot Test AnalysisDetailItem 1`] = `

diff --git a/...end/src/components/screens/AssetDetails/__test__/__snapshots__/AssetDetails.test.jsx.snap b/...end/src/components/screens/AssetDetails/__test__/__snapshots__/AssetDetails.test.jsx.snap
@@ -11,7 +11,9 @@ exports[`AssetDetailsScreen renders without crashing 1`] = `
     bodyComponent={[Function]}
     searchResult={Array []}
     selectedNavLinkIndex={-1}
+    setMessageType={[MockFunction]}
     setSearchResult={[MockFunction]}
+    setStatusMessage={[MockFunction]}
   />
 </Fragment>
 `;
diff --git a/Frontend/src/components/screens/Settings/__test__/SettingsScreen.test.jsx b/Frontend/src/components/screens/Settings/__test__/SettingsScreen.test.jsx
@@ -1,9 +1,9 @@
 import React from 'react';
+import {BrowserRouter} from 'react-router-dom';
 import SettingsScreen from '../SettingsScreen';
 import toJson from 'enzyme-to-json';
 import Enzyme, {shallow} from 'enzyme';
 import Adapter from '@wojtekmaj/enzyme-adapter-react-17';
-import {BrowserRouter} from 'react-router-dom';
 
 Enzyme.configure({adapter: new Adapter()})
 

diff --git a/Frontend/src/components/screens/WatchLists/__test__/WatchListsScreen.test.jsx b/Frontend/src/components/screens/WatchLists/__test__/WatchListsScreen.test.jsx
@@ -20,6 +20,11 @@ const assetsListArray = [
   ]
 ];
 
+const mockedNavigator = jest.fn();
+jest.mock('react-router-dom', () => ({
+  useNavigate: () => mockedNavigator
+}));
+
 describe('Tests regarding WatchList screen', () => {
   const addToWatchList = jest.fn();
   const setWatchListsArray = jest.fn();
@@ -30,14 +35,15 @@ describe('Tests regarding WatchList screen', () => {
   const setMessageType = jest.fn();
 
   it('search results are not shown', () => {
-    const wrapper = shallow(<SearchResultsTable
-      searchResult={[]}
-      watchListsArray={watchListsArray}
-      selectedListIndex={0}
-      assetsListArray={assetsListArray}
-      addToWatchList={addToWatchList}
-      onClose={onClose}
-    />);
+    const wrapper = shallow(
+      <SearchResultsTable
+        searchResult={[]}
+        watchListsArray={watchListsArray}
+        selectedListIndex={0}
+        assetsListArray={assetsListArray}
+        addToWatchList={addToWatchList}
+        onClose={onClose}
+      />);
 
     expect(wrapper.find(<ListItem/>).exists()).toBeFalsy();
   });