Proposal - Visualize stock charts

It should be possible to visualize historical stock price data.

This issue should collect and discuss ideas on this topic.

Description

As a user I want to be able to visualize stock charts for my assets.

There are multiple possible locations where a chart could be shown

• Single security - display a chart for a single security
• Security account - display a chart for all securities in a securities account
• Portfolio - display a chart for all securities in all securities accounts of the current portfolio
• Global - display a chart for all portfolios

Stock charts

Currently portfolio performance only saves one value per day. Displaying the already available data should be the first goal.

But in order to have a future proof concept the initial data model should already be prepared to overcome these limitations.

There are many different charts on how to display the data. The most relevant are

• line chart
• candle stick chart

Where a single value per time frame is enough for line chart for a candle stick chart we need 4 values

• open (for intraday this could be omitted because it will be the close price of the last record)
• high
• low
• close

Time frames

• intraday - shows data for the current day, usually divided into 5 / 10 or 20 minutes segments
• week - shows data for the last 7 days, usually divided into 1 hour segments
• month - shows data for the last 30 days, usually divided into 1 or only a few segments per day (maybe open and close)
• year - shows data for the last 30 days, usually divided into 1 segment per day
• ytd - shows data for the current year, usually divided into 1 segment per day

Portfolio Performance it self has the following time periods (1M, 2M, 6M, 1Y, 2Y, 3Y, 5Y, 10Y, YTD, H(olding period), A(ll available data))

Different assets may have different points in the daily chart (while securites are usually only updated while the market is open, cryptos are traded 24/7).

Implementation

The implementation consists of different parts

Api

There should be an api to query the data. Since the "raw" data might not necessarily be in the correct format, the data could be prepared on the server side (on the fly or even persisted in the database).

Web

In the web frontend there should be the possibility to fetch the data from the backend api and assign it to a reactive property.

The visual part should be a single component that takes the data and displays it. It should be possible to

• toggling between time frames (which triggers a reload)
• focusing a single record and view its value (mobile frindly)

However, we should keep in mind that the users might have added their own logic to fetch the data, so there should be a provider model on a per security basis where the default implementation fetches the data from the backend api.

Stock chart visualisation

We need to find and implement a good library to display the charts.

Because it looks promissing, has tons of examples and even a financial plugin, we should focus on chart.js atm.

• chartjs examples: https://www.chartjs.org/samples/latest/
• chartjs financial line chart (without plugin): https://www.chartjs.org/samples/latest/scales/time/financial.html
• chartjs-financial: https://www.chartjs.org/chartjs-chart-financial/
• vue-chartjs: https://vue-chartjs.org/
• example for backend / frontend vue app with realtime data (based on a cloud service but might be a good best practice starting point): https://pusher.com/tutorials/chart-vuejs/

Hello,

I have noticed, that the amount of shares I hold in some securities after the PP Sync is too high. I assume that some, but not all, sell transactions didn't get synced.

If an unknown currencyCode is received in the API, the request currently fails with internal server error due to violation of db constraints.

Request should fail with error 400 and proper error message send back to client.

Problem

If the session is not valid anymore, you can't logout because of the following exception.

xhr.js?cdfe:177 POST http://localhost:3000/auth/logout 401 (Unauthorized)
createError.js?d8a1:16 Uncaught (in promise) Error: Request failed with status code 401
    at createError (createError.js?d8a1:16)
    at settle (settle.js?6840:17)
    at XMLHttpRequest.handleLoad (xhr.js?cdfe:62)​

Steps to reproduce

• Login in to frontend
• Remove session from sessions table
• Try to logut

Solution

The first step is to ignore 401 errors during logout. This way you can login again without deleting your browser cache.

On the long term a global axios intercepter that redirects to the login screen on 401 errors would be great.

• Store selected portfolio (whenever user selects a portfolio)
• Open selected portfolio on login

Problem

• Use attached sample portfolio or create your own with a security with historic prices above 100 EUR, i.e. LYYA
• Use sync tool to upload the portfilio
• Upload will fail with error 500 for rout /portfolios/<portfolio_id>/securities/<security_id>/prices
• The api backend will log the error

query failed: INSERT INTO "securities_prices"("security_id", "date", "value") VALUES ($1, $2, $3), ($4, $5, $6), ...
 -- PARAMETERS: [54,"2019-05-06","1640400",54,"2019-05-07","1623000",...]
error: error: Feldüberlauf bei Typ »numeric«
    at Parser.parseErrorMessage (D:\github\pr\node_modules\pg-protocol\dist\parser.js:278:15)
    at Parser.handlePacket (D:\github\pr\node_modules\pg-protocol\dist\parser.js:126:29)
    at Parser.parse (D:\github\pr\node_modules\pg-protocol\dist\parser.js:39:38)
    at Socket.<anonymous> (D:\github\pr\node_modules\pg-protocol\dist\index.js:10:42)
    at Socket.emit (events.js:223:5)
    at addChunk (_stream_readable.js:309:12)
    at readableAddChunk (_stream_readable.js:290:11)
    at Socket.Readable.push (_stream_readable.js:224:10)
    at TCP.onStreamRead (internal/stream_base_commons.js:181:23) {
  length: 256,
  name: 'error',
  severity: 'FEHLER',
  code: '22003',
  detail: 'Ein Feld mit Präzision 10, Skala 4 muss beim Runden einen Betrag von weniger als 10^6 ergeben.',
  hint: undefined,
  position: undefined,
  internalPosition: undefined,
  internalQuery: undefined,
  where: undefined,
  schema: undefined,
  table: undefined,
  column: undefined,
  dataType: undefined,
  constraint: undefined,
  file: 'd:\\pginstaller_13.auto\\postgres.windows-x64\\src\\backend\\utils\\adt\\numeric.c',
  line: '6612',
  routine: 'apply_typmod'
}

Solution

Currently prices are stored as interger values in the portfolio.xml

The following value is equivalent to 225,07 EUR

<price t="2021-01-20" v="22507000000"/>

During update the value is converted to json value

{"date":"2021-01-20","value":"2250700.0000"}

Most likely the problem is the sync-tool which should convert the xml data to

{"date":"2021-01-20","value":"225.07000000"}

instead.

test.zip

On a side note: Even if the bug is fixed, a precision of 10,4 might not be enough for the future (maybe some PP users have Berkshire Hathaway stocks :-)

Hello,

i just wanted to test teh app but failed to run the docker on my raspberry pi.

First issue was taht i needed to increase the network-timeout for the yarn install command.

after i solved this i now have the following issue. It looks like there is an error with the DB?
Could may someone help me?

pi@raspberrypi:/media/usbstick/pr $ docker build . -f Dockerfile
Sending build context to Docker daemon 1.095MB
Step 1/20 : FROM node:14 AS builder
---> d55eec34ac24
Step 2/20 : WORKDIR /app
---> Using cache
---> 36b142f09c08
Step 3/20 : COPY package.json yarn.lock ./
---> Using cache
---> f4685b7b67f9
Step 4/20 : COPY api/package.json api/
---> Using cache
---> 6cfff37b652b
Step 5/20 : COPY web/package.json web/
---> Using cache
---> f3c8a15860ca
Step 6/20 : RUN yarn install --frozen-lockfile --network-timeout 300000
---> Using cache
---> aba49b5d90eb
Step 7/20 : COPY api api
---> Using cache
---> 2a12947565af
Step 8/20 : RUN yarn api build
---> Running in 91ba09194416
yarn run v1.22.5
$ yarn workspace pr-api build
$ rimraf dist
$ nest build
src/auth/auth.service.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'User'.
2 import { User } from '@prisma/client'
src/auth/bearer-session.strategy.ts:4:10 - error TS2305: Module '"@prisma/client"' has no exported member 'User'.
4 import { User } from '@prisma/client'
src/auth/local.strategy.ts:4:10 - error TS2305: Module '"@prisma/client"' has no exported member 'User'.
4 import { User } from '@prisma/client'
src/auth/sessions/sessions.controller.ts:9:10 - error TS2305: Module '"@prisma/client"' has no exported member 'User'.
9 import { User } from '@prisma/client'
src/auth/sessions/sessions.service.ts:3:10 - error TS2305: Module '"@prisma/client"' has no exported member 'User'.
3 import { User, Session } from '@prisma/client'
src/auth/sessions/sessions.service.ts:3:16 - error TS2305: Module '"@prisma/client"' has no exported member 'Session'.
3 import { User, Session } from '@prisma/client'
src/auth/users/users.service.ts:6:10 - error TS2305: Module '"@prisma/client"' has no exported member 'User'.
6 import { User } from '@prisma/client'
src/currencies/currencies.conversion.service.ts:7:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
7 import { Prisma } from '@prisma/client'
src/currencies/currencies.service.ts:3:10 - error TS2305: Module '"@prisma/client"' has no exported member 'ExchangeratePrice'.
3 import { ExchangeratePrice, Prisma } from '@prisma/client'
src/currencies/currencies.service.ts:3:29 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
3 import { ExchangeratePrice, Prisma } from '@prisma/client'
src/currencies/dto/convert.currencies.dto.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
2 import { Prisma } from '@prisma/client'
src/currencies/price.entity.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
2 import { Prisma } from '@prisma/client'
src/portfolios/accounts/accounts.kpis.service.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
2 import { Prisma } from '@prisma/client'
src/portfolios/accounts/accounts.service.ts:6:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Account'.
6 import { Account } from '@prisma/client'
src/portfolios/dto/CreateUpdatePortfolioSecurityPrice.dto.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
2 import { Prisma } from '@prisma/client'
src/portfolios/dto/CreateUpdateTransaction.dto.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
2 import { Prisma } from '@prisma/client'
src/portfolios/portfolios.service.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Portfolio'.
2 import { Portfolio } from '@prisma/client'
src/portfolios/securities/prices/price.entity.ts:3:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
3 import { Prisma } from '@prisma/client'
src/portfolios/securities/prices/prices.service.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
2 import { Prisma } from '@prisma/client'
src/portfolios/securities/securities.kpis.service.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
2 import { Prisma, TransactionType } from '@prisma/client'
src/portfolios/securities/securities.kpis.service.ts:2:18 - error TS2305: Module '"@prisma/client"' has no exported member 'TransactionType'.
2 import { Prisma, TransactionType } from '@prisma/client'
src/portfolios/securities/securities.service.ts:6:10 - error TS2305: Module '"@prisma/client"' has no exported member 'PortfolioSecurity'.
6 import { PortfolioSecurity, Prisma } from '@prisma/client'
src/portfolios/securities/securities.service.ts:6:29 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
6 import { PortfolioSecurity, Prisma } from '@prisma/client'
src/portfolios/transactions/transaction.entity.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
2 import { Prisma } from '@prisma/client'
src/portfolios/transactions/transactions.service.ts:6:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
6 import { Prisma, Transaction, TransactionUnit } from '@prisma/client'
src/portfolios/transactions/transactions.service.ts:6:18 - error TS2305: Module '"@prisma/client"' has no exported member 'Transaction'.
6 import { Prisma, Transaction, TransactionUnit } from '@prisma/client'
src/portfolios/transactions/transactions.service.ts:6:31 - error TS2305: Module '"@prisma/client"' has no exported member 'TransactionUnit'.
6 import { Prisma, Transaction, TransactionUnit } from '@prisma/client'
src/portfolios/transactions/transactions.service.ts:219:17 - error TS2339: Property 'type' does not exist on type 'unknown'.
219 right.type,
src/portfolios/transactions/transactions.service.ts:220:17 - error TS2339: Property 'amount' does not exist on type 'unknown'.
220 right.amount,
src/portfolios/transactions/transactions.service.ts:221:17 - error TS2339: Property 'currencyCode' does not exist on type 'unknown'.
221 right.currencyCode,
src/portfolios/transactions/transactions.service.ts:222:17 - error TS2339: Property 'originalAmount' does not exist on type 'unknown'.
222 right.originalAmount,
src/portfolios/transactions/transactions.service.ts:223:17 - error TS2339: Property 'originalCurrencyCode' does not exist on type 'unknown'.
223 right.originalCurrencyCode,
src/portfolios/transactions/transactions.service.ts:224:17 - error TS2339: Property 'exchangeRate' does not exist on type 'unknown'.
224 right.exchangeRate,
src/portfolios/transactions/transactions.service.ts:231:45 - error TS2339: Property 'id' does not exist on type 'unknown'.
231 id: { in: unmatchedDbs.map((u) => u.id) },
src/portfolios/transactions/unit.entity.ts:3:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
3 import { Prisma } from '@prisma/client'
src/securities/dto/security.taxonomy.dto.ts:2:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
2 import { Prisma } from '@prisma/client'
src/securities/securities.service.ts:9:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
9 import { Prisma } from '@prisma/client'
src/stats/stats.controller.ts:19:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
19 import { Prisma } from '@prisma/client'
src/taxonomies/taxonomies.controller.ts:20:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
20 import { Prisma } from '@prisma/client'
src/utils/decimal.parser.ts:1:10 - error TS2305: Module '"@prisma/client"' has no exported member 'Prisma'.
1 import { Prisma } from '@prisma/client'
Found 40 error(s).
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command failed.
Exit code: 1
Command: /usr/local/bin/node
Arguments: /opt/yarn-v1.22.5/lib/cli.js build
Directory: /app/api
Output:
info Visit https://yarnpkg.com/en/docs/cli/workspace for documentation about this command.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
The command '/bin/sh -c yarn api build' returned a non-zero code: 1

I have a pushed a rudimentary sync to the branch feature_server_sync in buchen/portfolio. It is very drafty: PortfolioReportSync

If you want to test it:

• paste the session token into the preferences
• choose Online -> Sync with portfolio-report from the menu

Things I noticed:

• I was successfully able to create a portfolio and some securities, but I only could read some portfolios (the list did not include all) and never was able to read securities. And even for the portfolios, it took quite some time until the portfolios showed up after creation. Do you see the same behavior?
• When creating a new security, I need to provide an empty string for wkn, ticker, note, etc. Is it possible to have these field nullable, i.e., I can leave them out?

Running API and web in dev mode.
Followed installation instructions, created user account and an example portfolio.
After execution of
pr-sync-win-x64.exe upload kommer.xml --username <user> --password <password> --portfolio 1
the error
Error: Username/password is incorrect. at Function.<anonymous> (C:\snapshot\pr-sync\dist\Api.js) at Generator.throw (<anonymous>) at rejected (C:\snapshot\pr-sync\dist\Api.js) at processTicksAndRejections (internal/process/task_queues.js:97:5)
occurs.

Any ideas?