@ -8,11 +8,12 @@ import { UserService } from '@ghostfolio/client/services/user/user.service';
import { MAX_TOP_HOLDINGS , UNKNOWN_KEY } from '@ghostfolio/common/config' ; import { MAX_TOP_HOLDINGS , UNKNOWN_KEY } from '@ghostfolio/common/config' ;
import { import {
canOpenHoldingDetail , canOpenHoldingDetail ,
convertValuesToPercentagesOfTotal ,
getAssetProfileIdentifier , getAssetProfileIdentifier ,
getCountryName getCountryName ,
isCashPosition
} from '@ghostfolio/common/helper' ; } from '@ghostfolio/common/helper' ;
import { import {
AssetProfileIdentifier ,
HoldingWithParents , HoldingWithParents ,
PortfolioDetails , PortfolioDetails ,
PortfolioPosition , PortfolioPosition ,
@ -22,7 +23,10 @@ import { hasPermission, permissions } from '@ghostfolio/common/permissions';
import { hasScope , scopes } from '@ghostfolio/common/scopes' ; import { hasScope , scopes } from '@ghostfolio/common/scopes' ;
import { MarketAdvanced } from '@ghostfolio/common/types' ; import { MarketAdvanced } from '@ghostfolio/common/types' ;
import { translate } from '@ghostfolio/ui/i18n' ; import { translate } from '@ghostfolio/ui/i18n' ;
import { GfPortfolioProportionChartComponent } from '@ghostfolio/ui/portfolio-proportion-chart' ; import {
GfPortfolioProportionChartComponent ,
PortfolioProportionChartClickEvent
} from '@ghostfolio/ui/portfolio-proportion-chart' ;
import { GfPremiumIndicatorComponent } from '@ghostfolio/ui/premium-indicator' ; import { GfPremiumIndicatorComponent } from '@ghostfolio/ui/premium-indicator' ;
import { DataService } from '@ghostfolio/ui/services' ; import { DataService } from '@ghostfolio/ui/services' ;
import { GfTopHoldingsComponent } from '@ghostfolio/ui/top-holdings' ; import { GfTopHoldingsComponent } from '@ghostfolio/ui/top-holdings' ;
@ -206,7 +210,9 @@ export class GfAllocationsPageComponent implements OnInit {
this . initialize ( ) ; this . initialize ( ) ;
} }
protected onAccountChartClicked ( { accountId } : { accountId : string } ) { protected onAccountChartClicked ( event : PortfolioProportionChartClickEvent ) {
const accountId = 'accountId' in event ? event.accountId : undefined ;
if ( accountId && accountId !== UNKNOWN_KEY ) { if ( accountId && accountId !== UNKNOWN_KEY ) {
void this . router . navigate ( [ ] , { void this . router . navigate ( [ ] , {
queryParams : { accountId , accountDetailDialog : true } queryParams : { accountId , accountDetailDialog : true }
@ -214,10 +220,9 @@ export class GfAllocationsPageComponent implements OnInit {
} }
} }
protected onSymbolChartClicked ( { protected onSymbolChartClicked ( event : PortfolioProportionChartClickEvent ) {
dataSource , const { dataSource , symbol } = 'symbol' in event ? event : { } ;
symbol
} : AssetProfileIdentifier ) {
if ( dataSource && symbol ) { if ( dataSource && symbol ) {
void this . router . navigate ( [ ] , { void this . router . navigate ( [ ] , {
queryParams : { dataSource , symbol , holdingDetailDialog : true } queryParams : { dataSource , symbol , holdingDetailDialog : true }
@ -267,6 +272,20 @@ export class GfAllocationsPageComponent implements OnInit {
return UNKNOWN_KEY ; return UNKNOWN_KEY ;
} }
private extractValue ( {
valueInBaseCurrency ,
valueInPercentage
} : {
valueInBaseCurrency? : PortfolioPosition [ 'valueInBaseCurrency' ] ;
valueInPercentage? : PortfolioPosition [ 'valueInPercentage' ] ;
} ) {
return (
( isNumber ( valueInBaseCurrency )
? valueInBaseCurrency
: valueInPercentage ) ? ? 0
) ;
}
private fetchPortfolioDetails() { private fetchPortfolioDetails() {
return this . dataService . fetchPortfolioDetails ( { return this . dataService . fetchPortfolioDetails ( {
filters : this.userService.getFilters ( ) , filters : this.userService.getFilters ( ) ,
@ -370,6 +389,8 @@ export class GfAllocationsPageComponent implements OnInit {
} ; } ;
} }
let totalValueExcludingCashPositions = 0 ;
for ( const position of this . portfolioDetails . holdings ) { for ( const position of this . portfolioDetails . holdings ) {
const assetProfileIdentifier = getAssetProfileIdentifier ( const assetProfileIdentifier = getAssetProfileIdentifier (
position . assetProfile position . assetProfile
@ -394,111 +415,104 @@ export class GfAllocationsPageComponent implements OnInit {
: ( position . valueInBaseCurrency ? ? 0 ) : ( position . valueInBaseCurrency ? ? 0 )
} ; } ;
// Prepare analysis data by continents, countries, holdings and sectors
if ( ! isCashPosition ( position . assetProfile ) ) {
// Prepare analysis data by continents, countries, holdings and sectors
if ( position . assetProfile . countries . length > 0 ) { // except for cash
for ( const country of position . assetProfile . countries ) {
const { code , continent , weight } = country ; totalValueExcludingCashPositions += this . extractValue ( position ) ;
const value =
( isNumber ( position . valueInBaseCurrency ) if ( position . assetProfile . countries . length > 0 ) {
? position . valueInBaseCurrency for ( const country of position . assetProfile . countries ) {
: position . valueInPercentage ) ? ? 0 ; const { code , continent , weight } = country ;
const value = this . extractValue ( position ) ;
const continentData = this . continents [ continent ] ;
if ( continentData ) {
continentData . value += weight * value ;
} else {
this . continents [ continent ] = {
name : translate ( continent ) ,
value : weight * value
} ;
}
const countryData = this . countries [ code ] ;
if ( countryData ) {
countryData . value += weight * value ;
} else {
this . countries [ code ] = {
name : getCountryName ( { code } ) ,
value : weight * value
} ;
}
}
} else {
const value = this . extractValue ( position ) ;
const continentData = this . continents [ continent ] ; const continentData = this . continents [ UNKNOWN_KEY ] ;
if ( continentData ) { if ( continentData ) {
continentData . value += weight * value ; continentData . value += value ;
} else {
this . continents [ continent ] = {
name : translate ( continent ) ,
value : weight * value
} ;
} }
const countryData = this . countries [ code ] ; const countryData = this . countries [ UNKNOWN_KEY ] ;
if ( countryData ) { if ( countryData ) {
countryData . value += weight * value ; countryData . value += value ;
} else {
this . countries [ code ] = {
name : getCountryName ( { code } ) ,
value : weight * value
} ;
} }
} }
} else {
const value =
( isNumber ( position . valueInBaseCurrency )
? position . valueInBaseCurrency
: position . valueInPercentage ) ? ? 0 ;
const continentData = this . continents [ UNKNOWN_KEY ] ;
if ( continentData ) {
continentData . value += value ;
}
const countryData = this . countries [ UNKNOWN_KEY ] ;
if ( countryData ) {
countryData . value += value ;
}
}
if ( position . assetProfile . holdings . length > 0 ) { if ( position . assetProfile . holdings . length > 0 ) {
for ( const { for ( const {
allocationInPercentage , allocationInPercentage ,
name , name ,
valueInBaseCurrency valueInBaseCurrency
} of position . assetProfile . holdings ) { } of position . assetProfile . holdings ) {
const normalizedAssetName = this . normalizeAssetName ( name ) ; const normalizedAssetName = this . normalizeAssetName ( name ) ;
const value = isNumber ( valueInBaseCurrency ) const value = isNumber ( valueInBaseCurrency )
? valueInBaseCurrency ? valueInBaseCurrency
: allocationInPercentage * ( position . valueInPercentage ? ? 0 ) ; : allocationInPercentage * ( position . valueInPercentage ? ? 0 ) ;
const holdingData = this . topHoldingsMap [ normalizedAssetName ] ; const holdingData = this . topHoldingsMap [ normalizedAssetName ] ;
if ( holdingData ) { if ( holdingData ) {
holdingData . value += value ; holdingData . value += value ;
} else { } else {
this . topHoldingsMap [ normalizedAssetName ] = { this . topHoldingsMap [ normalizedAssetName ] = {
name , name ,
value value
} ; } ;
}
} }
} }
}
if ( position . assetProfile . sectors . length > 0 ) { if ( position . assetProfile . sectors . length > 0 ) {
for ( const sector of position . assetProfile . sectors ) { for ( const sector of position . assetProfile . sectors ) {
const { name , weight } = sector ; const { name , weight } = sector ;
const value = const value = this . extractValue ( position ) ;
( isNumber ( position . valueInBaseCurrency )
? position . valueInBaseCurrency const sectorData = this . sectors [ name ] ;
: position . valueInPercentage ) ? ? 0 ;
if ( sectorData ) {
sectorData . value += weight * value ;
} else {
this . sectors [ name ] = {
name : translate ( name ) ,
value : weight * value
} ;
}
}
} else {
const value = this . extractValue ( position ) ;
const sectorData = this . sectors [ name ] ; const sectorData = this . sectors [ UNKNOWN_KEY ] ;
if ( sectorData ) { if ( sectorData ) {
sectorData . value += weight * value ; sectorData . value += value ;
} else {
this . sectors [ name ] = {
name : translate ( name ) ,
value : weight * value
} ;
} }
} }
} else {
const value =
( isNumber ( position . valueInBaseCurrency )
? position . valueInBaseCurrency
: position . valueInPercentage ) ? ? 0 ;
const sectorData = this . sectors [ UNKNOWN_KEY ] ;
if ( sectorData ) {
sectorData . value += value ;
}
} }
if ( this . holdings [ assetProfileIdentifier ] . assetSubClass === 'ETF' ) { if ( this . holdings [ assetProfileIdentifier ] . assetSubClass === 'ETF' ) {
@ -507,10 +521,7 @@ export class GfAllocationsPageComponent implements OnInit {
const symbol = position . assetProfile . symbol ; const symbol = position . assetProfile . symbol ;
const value = const value = this . extractValue ( position ) ;
( isNumber ( position . valueInBaseCurrency )
? position . valueInBaseCurrency
: position . valueInPercentage ) ? ? 0 ;
const symbolData = this . symbols [ symbol ] ; const symbolData = this . symbols [ symbol ] ;
@ -530,6 +541,17 @@ export class GfAllocationsPageComponent implements OnInit {
} }
} }
if ( this . showValuesInPercentage ( ) ) {
// The values are percentages of the whole portfolio, but the analysis
// data does not contain the cash positions
for ( const values of [ this . continents , this . countries , this . sectors ] ) {
convertValuesToPercentagesOfTotal ( {
values ,
total : totalValueExcludingCashPositions
} ) ;
}
}
this . markets = this . portfolioDetails . markets ; this . markets = this . portfolioDetails . markets ;
if ( this . portfolioDetails . marketsAdvanced ) { if ( this . portfolioDetails . marketsAdvanced ) {
Thomas Kaul
2 months ago
GitHub