Merge pull request carrawao#78 from carrawao/feature/watchlist

Feature/watchlist
fefifef · May 15, 2022 · 18213e6 · 18213e6
2 parents 7319538 + 2371c6a
commit 18213e6
Show file tree

Hide file tree

Showing 15 changed files with 136 additions and 68 deletions.
diff --git a/Backend/data/shareSymbols.txt b/Backend/data/shareSymbols.txt
@@ -1,7 +1 @@
-IBM
-A
-JPM-P-M
-AMZN
-AADI
-K
-FB
+IBM
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,7 @@ const SearchResultsTable = props => {
     return isAssetInWatchList;
   }
 
-  let navigate = useNavigate();
+  const navigate = useNavigate();
   const routeChange = path => {
     navigate(path);
   } 
@@ -94,13 +94,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,
@@ -127,7 +126,8 @@ const SearchResultsTable = props => {
             <Grid item className='d-flex flex-row justify-content-end'>
               <ListItemButton
                 className='p-0 ms-3 flex-grow-0 justify-content-end'
-                onClick={() => {routeChange(`../activities/addActivity/${element.assetType}/${element.symbol}/${element.name}`)}}
+                onClick={() => {
+                  routeChange(`../activities/addActivity/${element.assetType}/${element.symbol}/${element.name}`)}}
               >
                 <Tooltip
                   title='Add Activity'

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/Frontend/src/components/screens/AssetDetails/AssetCard.jsx b/Frontend/src/components/screens/AssetDetails/AssetCard.jsx
@@ -2,7 +2,7 @@ import React, {useEffect, useState} from 'react';
 import AssetChart from './AssetChart';
 import ChartButtons from './ChartButtons';
 import Masterdata from './Masterdata';
-import {Container, Card, Grid} from '@mui/material';
+import {Container, Card, Box} from '@mui/material';
 import PropTypes from 'prop-types';
 import SwitchButtons from './SwitchButtons';
 import AssetPerformance from './AssetPerformance';
@@ -50,25 +50,23 @@ const AssetCard = props => {
   }
 
   return (
-    <Container className='d-flex flex-column px-1 pt-2 sm'>
+    <Container className='d-flex flex-column px-1 pt-2'>
       <Card>
-        <Grid container direction='column'>
-          <Grid xs={2} item container direction='row' justifyContent='space-between'>
-            <>
+        <Box container direction='column'>
+          <Box className='d-flex flex-row justify-content-space-between'>
               <SwitchButtons containsAssetData={containsAssetData} setChartType={setChartType} chartType={chartType}/>
               <ChartButtons view={view} setView={setView}/>
-            </>
-          </Grid>
-          <Grid item xs={6} className='mt-2 mb-2'>
+          </Box>
+          <Box className='mt-2 mb-2'>
             {renderContent()}
-          </Grid>
-          <Grid item xs={4}>
+          </Box>
+          <Box>
             {
               props.assetType === 'Stock' &&
               <Masterdata assetType={props.assetType} symbol={props.symbol} setName={setName}/>
             }
-          </Grid>
-        </Grid>
+          </Box>
+        </Box>
       </Card>
     </Container>
   )

diff --git a/Frontend/src/components/screens/AssetDetails/AssetChart.jsx b/Frontend/src/components/screens/AssetDetails/AssetChart.jsx
@@ -198,9 +198,10 @@ export const AssetChart = props => {
   // Manipulate data according to view
   changeData(props.view, data, labels, options, setup);
   return (
-    <Card raised sx={{border: 3, borderColor: 'rgb(73, 63, 53)', borderRadius: 3}}>
-      <CardHeader title={'Price | ' + props.name}
-                  subheader={Intl.NumberFormat('de-DE', {style: 'currency', currency: 'EUR',}).format(price)}/>
+    <Card className='col-xl-12' raised sx={{border: 3, borderColor: 'rgb(228 126 37)', borderRadius: 3}}>
+      <CardHeader
+        title={'Price | ' + props.name}
+        subheader={Intl.NumberFormat('de-DE', {style: 'currency', currency: 'EUR',}).format(price)}/>
       <CardContent>
         <Line data={setup} options={options} plugins={[crosshair]}/>
       </CardContent>

diff --git a/Frontend/src/components/screens/AssetDetails/AssetDetailsScreen.jsx b/Frontend/src/components/screens/AssetDetails/AssetDetailsScreen.jsx
@@ -27,6 +27,10 @@ const AssetDetailsScreen = props => {
         assetsListArray={props.assetsListArray}
         searchResult={props.searchResult}
         setSearchResult={props.setSearchResult}
+        statusMessage={props.statusMessage}
+        setStatusMessage={props.setStatusMessage}
+        messageType={props.messageType}
+        setMessageType={props.setMessageType}
       />
     </React.Fragment>
   );
@@ -39,6 +43,10 @@ AssetDetailsScreen.propTypes = {
   activePortfolio: PropTypes.string,
   watchListsArray: PropTypes.array,
   assetsListArray: PropTypes.array,
+  statusMessage: PropTypes.string,
+  setStatusMessage: PropTypes.func,
+  messageType: PropTypes.string,
+  setMessageType: PropTypes.func
 };
 
 export default AssetDetailsScreen;
diff --git a/Frontend/src/components/screens/AssetDetails/Masterdata.jsx b/Frontend/src/components/screens/AssetDetails/Masterdata.jsx
@@ -48,7 +48,7 @@ const Masterdata = props => {
         </List>
       </Grid>
       <Grid item>
-        <Divider orientation='vertical' flexItem sx={1} style={{height: '100%'}}/>
+        <Divider orientation='vertical' flexItem xs={1} style={{height: '100%'}}/>
       </Grid>
       <Grid item xs={5}>
         <List>

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/Dashboard/AllocationGraph.jsx b/Frontend/src/components/screens/Dashboard/AllocationGraph.jsx
@@ -11,7 +11,7 @@ import {DoughnutChart} from '../../common';
 
 const AllocationGraph = props => {
   const defaultMiddleDisplayLabel = `Value of ${props.activePortfolio}`;
-  const defaultMiddleDisplayValue = `${parseFloat(props.portfolioData.value.toFixed(2)).toLocaleString()} €`;
+  const defaultMiddleDisplayValue = props.portfolioData.value ?`${parseFloat(props.portfolioData.value).toFixed(2).toLocaleString()} €` : '0.00 €';
 
   const assets = props.getAllAssets();
 
@@ -29,7 +29,7 @@ const AllocationGraph = props => {
   })();
 
   const valueData = (() => {
-    let valueData = []
+    let valueData = [];
     assets.forEach(element => {
       valueData.push(parseFloat(element.value).toFixed(2));
     });

diff --git a/Frontend/src/components/screens/Dashboard/DashboardScreen.jsx b/Frontend/src/components/screens/Dashboard/DashboardScreen.jsx
@@ -72,8 +72,8 @@ const DashboardScreen = props => {
           </Box>
         </Box>
       </Grid>
-      {Object.keys(props.portfolioData[props.activePortfolio]['dailyDataForValueDevelopment']).length === 0 ? 
-        <Typography></Typography>
+      {props.portfolioData[props.activePortfolio]['dailyDataForValueDevelopment'] && Object.keys(props.portfolioData[props.activePortfolio]['dailyDataForValueDevelopment']).length === 0 ?
+        <Typography/>
         :
         <PortfolioCharts view={view} {...props}/>
       }

diff --git a/Frontend/src/components/screens/Dashboard/PortfolioCharts.jsx b/Frontend/src/components/screens/Dashboard/PortfolioCharts.jsx
@@ -1,18 +1,18 @@
 import React from 'react';
-import {Card, Container, CardContent, Box} from '@mui/material';
+import {Container, Box} from '@mui/material';
 import PortfolioPerformance from './PortfolioPerformance';
 import PortfolioValueChart from './PortfolioValuechart';
 
 export const PortfolioCharts = props => {
   return (
-        <Container className='d-flex flex-column flex-xl-row justify-content-center align-items-center'>
-          <Box className='col-12 col-xl-6 mb-4 mb-xl-0'>
-            <PortfolioValueChart {...props} view={props.view}/>
-          </Box>
-          <Box className='col-12 col-xl-6 ms-xl-4'>
-            <PortfolioPerformance {...props} view={props.view}/>
-          </Box>
-        </Container>
+    <Container className='d-flex flex-column flex-xl-row justify-content-center align-items-center'>
+      <Box className='col-12 col-xl-6 mb-4 mb-xl-0 me-xl-4'>
+        <PortfolioValueChart {...props} view={props.view}/>
+      </Box>
+      <Box className='col-12 col-xl-6 ms-xl-4'>
+        <PortfolioPerformance {...props} view={props.view}/>
+      </Box>
+    </Container>
   )
 }
 

diff --git a/Frontend/src/components/screens/Privacy.jsx b/Frontend/src/components/screens/Privacy.jsx
@@ -86,7 +86,7 @@ const Privacy = () => (
     <Typography variant='h7' className='pt-4 ps-3'>
       Scope of the processing of personal data
     </Typography>
-    <Typography>
+    <Typography variant='h7' className='pt-4 ps-3'>
       We process personal data of our users only insofar as this is necessary for the provision of a functional
       website and our content and services. The processing of personal data of our users is regularly only carried out
       with the consent of the user. An exception applies in those cases where obtaining prior consent is not possible
@@ -155,7 +155,7 @@ const Privacy = () => (
       device. Your browser accesses these files. The use of cookies increases the user-friendliness and security of
       this website.
     </Typography>
-    <Typography>
+    <Typography variant='h7' className='pt-4 ps-3'>
       If you do not want cookies to be stored on your end device for the purpose of measuring reach, you can object to
       the use of these files here:
     </Typography>

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();
   });
-Original file line number
+Diff line change
@@ -1,7 +1 @@
-    IBM
-    A
-    JPM-P-M
-    AMZN
-    AADI
-    K
-    FB
+    IBM