Improve dynamic numerical precision

apps/client/src/app/components/holding-detail-dialog/holding-detail-dialog.component.ts

@@ -3,7 +3,11 @@ import { GfDialogFooterModule } from '@ghostfolio/client/components/dialog-foote
 import { GfDialogHeaderModule } from '@ghostfolio/client/components/dialog-header/dialog-header.module';
 import { DataService } from '@ghostfolio/client/services/data.service';
 import { UserService } from '@ghostfolio/client/services/user/user.service';
-import { NUMERICAL_PRECISION_THRESHOLD } from '@ghostfolio/common/config';
+import {
+  NUMERICAL_PRECISION_THRESHOLD_3_FIGURES,
+  NUMERICAL_PRECISION_THRESHOLD_5_FIGURES,
+  NUMERICAL_PRECISION_THRESHOLD_6_FIGURES
+} from '@ghostfolio/common/config';
 import { DATE_FORMAT, downloadAsFile } from '@ghostfolio/common/helper';
 import {
   DataProviderInfo,
@@ -101,6 +105,7 @@ export class GfHoldingDetailDialogComponent implements OnDestroy, OnInit {
   public assetClass: string;
   public assetSubClass: string;
   public averagePrice: number;
+  public averagePricePrecision = 2;
   public benchmarkDataItems: LineChartItem[];
   public benchmarkLabel = $localize`Average Unit Price`;
   public countries: {
@@ -122,11 +127,15 @@ export class GfHoldingDetailDialogComponent implements OnDestroy, OnInit {
   public marketDataItems: MarketData[] = [];
   public marketPrice: number;
   public marketPriceMax: number;
+  public marketPriceMaxPrecision = 2;
   public marketPriceMin: number;
+  public marketPriceMinPrecision = 2;
+  public marketPricePrecision = 2;
   public netPerformance: number;
   public netPerformancePrecision = 2;
   public netPerformancePercent: number;
   public netPerformancePercentWithCurrencyEffect: number;
+  public netPerformancePercentWithCurrencyEffectPrecision = 2;
   public netPerformanceWithCurrencyEffect: number;
   public netPerformanceWithCurrencyEffectPrecision = 2;
   public quantity: number;
@@ -274,6 +283,14 @@ export class GfHoldingDetailDialogComponent implements OnDestroy, OnInit {
           value
         }) => {
           this.averagePrice = averagePrice;
+
+          if (
+            this.data.deviceType === 'mobile' &&
+            this.averagePrice >= NUMERICAL_PRECISION_THRESHOLD_6_FIGURES
+          ) {
+            this.averagePricePrecision = 0;
+          }
+
           this.benchmarkDataItems = [];
           this.countries = {};
           this.dataProviderInfo = dataProviderInfo;
@@ -281,7 +298,8 @@ export class GfHoldingDetailDialogComponent implements OnDestroy, OnInit {
 
           if (
             this.data.deviceType === 'mobile' &&
-            this.dividendInBaseCurrency >= NUMERICAL_PRECISION_THRESHOLD
+            this.dividendInBaseCurrency >=
+              NUMERICAL_PRECISION_THRESHOLD_6_FIGURES
           ) {
             this.dividendInBaseCurrencyPrecision = 0;
           }
@@ -320,19 +338,42 @@ export class GfHoldingDetailDialogComponent implements OnDestroy, OnInit {
           if (
             this.data.deviceType === 'mobile' &&
             this.investmentInBaseCurrencyWithCurrencyEffect >=
-              NUMERICAL_PRECISION_THRESHOLD
+              NUMERICAL_PRECISION_THRESHOLD_6_FIGURES
           ) {
             this.investmentInBaseCurrencyWithCurrencyEffectPrecision = 0;
           }
 
           this.marketPrice = marketPrice;
           this.marketPriceMax = marketPriceMax;
+
+          if (
+            this.data.deviceType === 'mobile' &&
+            this.marketPriceMax >= NUMERICAL_PRECISION_THRESHOLD_6_FIGURES
+          ) {
+            this.marketPriceMaxPrecision = 0;
+          }
+
           this.marketPriceMin = marketPriceMin;
+
+          if (
+            this.data.deviceType === 'mobile' &&
+            this.marketPriceMin >= NUMERICAL_PRECISION_THRESHOLD_6_FIGURES
+          ) {
+            this.marketPriceMinPrecision = 0;
+          }
+
+          if (
+            this.data.deviceType === 'mobile' &&
+            this.marketPrice >= NUMERICAL_PRECISION_THRESHOLD_6_FIGURES
+          ) {
+            this.marketPricePrecision = 0;
+          }
+
           this.netPerformance = netPerformance;
 
           if (
             this.data.deviceType === 'mobile' &&
-            this.netPerformance >= NUMERICAL_PRECISION_THRESHOLD
+            this.netPerformance >= NUMERICAL_PRECISION_THRESHOLD_6_FIGURES
           ) {
             this.netPerformancePrecision = 0;
           }
@@ -342,13 +383,21 @@ export class GfHoldingDetailDialogComponent implements OnDestroy, OnInit {
           this.netPerformancePercentWithCurrencyEffect =
             netPerformancePercentWithCurrencyEffect;
 
+          if (
+            this.data.deviceType === 'mobile' &&
+            this.netPerformancePercentWithCurrencyEffect >=
+              NUMERICAL_PRECISION_THRESHOLD_3_FIGURES
+          ) {
+            this.netPerformancePercentWithCurrencyEffectPrecision = 0;
+          }
+
           this.netPerformanceWithCurrencyEffect =
             netPerformanceWithCurrencyEffect;
 
           if (
             this.data.deviceType === 'mobile' &&
             this.netPerformanceWithCurrencyEffect >=
-              NUMERICAL_PRECISION_THRESHOLD
+              NUMERICAL_PRECISION_THRESHOLD_5_FIGURES
           ) {
             this.netPerformanceWithCurrencyEffectPrecision = 0;
           }

apps/client/src/app/components/holding-detail-dialog/holding-detail-dialog.html

@@ -77,6 +77,7 @@
                 [colorizeSign]="true"
                 [isPercent]="true"
                 [locale]="data.locale"
+                [precision]="netPerformancePercentWithCurrencyEffectPrecision"
                 [value]="netPerformancePercentWithCurrencyEffect"
               >
                 @if (
@@ -95,6 +96,7 @@
                 size="medium"
                 [isCurrency]="true"
                 [locale]="data.locale"
+                [precision]="averagePricePrecision"
                 [unit]="SymbolProfile?.currency"
                 [value]="averagePrice"
                 >Average Unit Price</gf-value
@@ -106,6 +108,7 @@
                 size="medium"
                 [isCurrency]="true"
                 [locale]="data.locale"
+                [precision]="marketPricePrecision"
                 [unit]="SymbolProfile?.currency"
                 [value]="marketPrice"
                 >Market Price</gf-value
@@ -122,6 +125,7 @@
                     marketPriceMin?.toFixed(2) === marketPrice?.toFixed(2) &&
                     marketPriceMax?.toFixed(2) !== marketPriceMin?.toFixed(2)
                 }"
+                [precision]="marketPriceMinPrecision"
                 [unit]="SymbolProfile?.currency"
                 [value]="marketPriceMin"
                 >Minimum Price</gf-value
@@ -138,6 +142,7 @@
                     marketPriceMax?.toFixed(2) === marketPrice?.toFixed(2) &&
                     marketPriceMax?.toFixed(2) !== marketPriceMin?.toFixed(2)
                 }"
+                [precision]="marketPriceMaxPrecision"
                 [unit]="SymbolProfile?.currency"
                 [value]="marketPriceMax"
                 >Maximum Price</gf-value
@@ -208,6 +213,7 @@
               <gf-value
                 i18n
                 size="medium"
+                [deviceType]="data.deviceType"
                 [isDate]="true"
                 [locale]="data.locale"
                 [value]="firstBuyDate"

apps/client/src/app/components/home-overview/home-overview.component.ts

@@ -3,7 +3,7 @@ import { LayoutService } from '@ghostfolio/client/core/layout.service';
 import { DataService } from '@ghostfolio/client/services/data.service';
 import { ImpersonationStorageService } from '@ghostfolio/client/services/impersonation-storage.service';
 import { UserService } from '@ghostfolio/client/services/user/user.service';
-import { NUMERICAL_PRECISION_THRESHOLD } from '@ghostfolio/common/config';
+import { NUMERICAL_PRECISION_THRESHOLD_6_FIGURES } from '@ghostfolio/common/config';
 import {
   AssetProfileIdentifier,
   LineChartItem,
@@ -143,7 +143,7 @@ export class GfHomeOverviewComponent implements OnDestroy, OnInit {
         if (
           this.deviceType === 'mobile' &&
           this.performance.currentValueInBaseCurrency >=
-            NUMERICAL_PRECISION_THRESHOLD
+            NUMERICAL_PRECISION_THRESHOLD_6_FIGURES
         ) {
           this.precision = 0;
         }

libs/common/src/lib/config.ts

@@ -136,7 +136,9 @@ export const HEADER_KEY_SKIP_INTERCEPTOR = 'X-Skip-Interceptor';
 
 export const MAX_TOP_HOLDINGS = 50;
 
-export const NUMERICAL_PRECISION_THRESHOLD = 100000;
+export const NUMERICAL_PRECISION_THRESHOLD_3_FIGURES = 100;
+export const NUMERICAL_PRECISION_THRESHOLD_5_FIGURES = 10000;
+export const NUMERICAL_PRECISION_THRESHOLD_6_FIGURES = 100000;
 
 export const PROPERTY_API_KEY_GHOSTFOLIO = 'API_KEY_GHOSTFOLIO';
 export const PROPERTY_API_KEY_OPENROUTER = 'API_KEY_OPENROUTER';