Merge branch 'main' into feature/add-data-providers-management-to-admin-control-panel

CHANGELOG.md

@@ -9,8 +9,17 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Added
 
+- Added the logotype to the footer
 - Added the data providers management to the admin control panel
 
+### Changed
+
+- Improved the backgrounds of the chart of the holdings tab on the home page (experimental)
+
+### Fixed
+
+- Fixed an issue in the carousel component for the testimonial section on the landing page
+
 ## 2.116.0 - 2024-10-17
 
 ### Added

apps/client/src/app/app.component.html

@@ -46,7 +46,7 @@
 </main>
 
 @if (showFooter) {
-  <footer class="d-flex justify-content-center py-4 w-100">
+  <footer class="justify-content-center overflow-hidden py-4 w-100">
     <div class="container">
       <div class="mb-3 row">
         <div class="col-sm">
@@ -187,7 +187,7 @@
           </ul>
         </div>
       </div>
-      <div class="row text-center">
+      <div class="mb-2 row text-center">
         <div class="col">
           © 2021 - {{ currentYear }}
           <a href="https://ghostfol.io">Ghostfolio</a>
@@ -195,12 +195,17 @@
       </div>
       <div class="row text-center text-muted">
         <div class="col">
-          <small i18n
+          <small class="d-block" i18n
             >The risk of loss in trading can be substantial. It is not advisable
             to invest money you may need in the short term.</small
           >
         </div>
       </div>
     </div>
+    <div class="container d-none d-md-block mt-5">
+      <div class="row justify-content-center">
+        <div class="font-weight-bold line-height-1 logotype">Ghostfolio</div>
+      </div>
+    </div>
   </footer>
 }

apps/client/src/app/app.component.scss

@@ -35,6 +35,13 @@
   footer {
     background-color: rgba(var(--palette-foreground-text), 0.05);
     font-size: 90%;
+
+    .logotype {
+      font-size: 13vw;
+      letter-spacing: -0.03em;
+      margin-bottom: -5svw;
+      opacity: 0.05;
+    }
   }
 
   header {

libs/common/src/lib/personal-finance-tools.ts

@@ -115,6 +115,7 @@ export const personalFinanceTools: Product[] = [
   },
   {
     founded: 2022,
+    isArchived: true,
     key: 'capmon',
     name: 'CapMon.org',
     origin: 'Germany',
@@ -303,6 +304,7 @@ export const personalFinanceTools: Product[] = [
   {
     hasFreePlan: true,
     hasSelfHostingAbility: false,
+    isArchived: true,
     key: 'intuit-mint',
     name: 'Intuit Mint',
     note: 'Intuit Mint was discontinued in 2023',
@@ -413,6 +415,7 @@ export const personalFinanceTools: Product[] = [
   {
     founded: 1991,
     hasSelfHostingAbility: true,
+    isArchived: true,
     key: 'microsoft-money',
     name: 'Microsoft Money',
     note: 'Microsoft Money was discontinued in 2010',
@@ -520,6 +523,7 @@ export const personalFinanceTools: Product[] = [
   },
   {
     hasFreePlan: true,
+    isArchived: true,
     key: 'portfoloo',
     name: 'Portfoloo',
     note: 'Portfoloo was discontinued',
@@ -558,6 +562,7 @@ export const personalFinanceTools: Product[] = [
   {
     founded: 2019,
     hasSelfHostingAbility: false,
+    isArchived: true,
     key: 'sarmaaya.pk',
     name: 'Sarmaaya.pk Portfolio Tracking',
     note: 'Sarmaaya.pk Portfolio Tracking was discontinued in 2024',
@@ -594,6 +599,7 @@ export const personalFinanceTools: Product[] = [
   },
   {
     hasFreePlan: true,
+    isArchived: true,
     key: 'sharesmaster',
     name: 'SharesMaster',
     note: 'SharesMaster was discontinued',
@@ -634,6 +640,7 @@ export const personalFinanceTools: Product[] = [
   },
   {
     founded: 2008,
+    isArchived: true,
     key: 'stockmarketeye',
     name: 'StockMarketEye',
     origin: 'France',
@@ -746,6 +753,7 @@ export const personalFinanceTools: Product[] = [
     founded: 2021,
     hasFreePlan: true,
     hasSelfHostingAbility: false,
+    isArchived: true,
     key: 'yeekatee',
     languages: ['Deutsch', 'English', 'Español', 'Français', 'Italiano'],
     name: 'yeekatee',

libs/ui/src/lib/carousel/carousel.component.scss

@@ -3,7 +3,7 @@
   position: relative;
 
   ::ng-deep {
-    [gf-carousel-item] {
+    [gfCarouselItem] {
       flex-shrink: 0;
       width: 100%;
     }

libs/ui/src/lib/logo/logo.component.scss

@@ -1,6 +1,7 @@
 :host {
   .label {
     font-weight: 600;
+    letter-spacing: -0.03em;
   }
 
   .logo {

libs/ui/src/lib/treemap-chart/treemap-chart.component.ts

@@ -57,8 +57,6 @@ export class GfTreemapChartComponent
 
   @ViewChild('chartCanvas') chartCanvas: ElementRef<HTMLCanvasElement>;
 
-  public static readonly HEAT_MULTIPLIER = 5;
-
   public chart: Chart<'treemap'>;
   public isLoading = true;
 
@@ -87,6 +85,44 @@ export class GfTreemapChartComponent
 
     const { endDate, startDate } = getIntervalFromDateRange(this.dateRange);
 
+    const netPerformancePercentsWithCurrencyEffect = this.holdings.map(
+      ({ dateOfFirstActivity, netPerformancePercentWithCurrencyEffect }) => {
+        return getAnnualizedPerformancePercent({
+          daysInMarket: differenceInDays(
+            endDate,
+            max([dateOfFirstActivity ?? new Date(0), startDate])
+          ),
+          netPerformancePercentage: new Big(
+            netPerformancePercentWithCurrencyEffect
+          )
+        }).toNumber();
+      }
+    );
+
+    const positiveNetPerformancePercents =
+      netPerformancePercentsWithCurrencyEffect.filter(
+        (annualizedNetPerformancePercent) => {
+          return annualizedNetPerformancePercent > 0;
+        }
+      );
+
+    const positiveNetPerformancePercentsRange = {
+      max: Math.max(...positiveNetPerformancePercents),
+      min: Math.min(...positiveNetPerformancePercents)
+    };
+
+    const negativeNetPerformancePercents =
+      netPerformancePercentsWithCurrencyEffect.filter(
+        (annualizedNetPerformancePercent) => {
+          return annualizedNetPerformancePercent < 0;
+        }
+      );
+
+    const negativeNetPerformancePercentsRange = {
+      max: Math.max(...negativeNetPerformancePercents),
+      min: Math.min(...negativeNetPerformancePercents)
+    };
+
     const data: ChartConfiguration['data'] = {
       datasets: [
         {
@@ -112,46 +148,58 @@ export class GfTreemapChartComponent
               ) / 100;
 
             if (
-              annualizedNetPerformancePercentWithCurrencyEffect >
-              0.03 * GfTreemapChartComponent.HEAT_MULTIPLIER
-            ) {
-              return green[9];
-            } else if (
-              annualizedNetPerformancePercentWithCurrencyEffect >
-              0.02 * GfTreemapChartComponent.HEAT_MULTIPLIER
-            ) {
-              return green[7];
-            } else if (
-              annualizedNetPerformancePercentWithCurrencyEffect >
-              0.01 * GfTreemapChartComponent.HEAT_MULTIPLIER
-            ) {
-              return green[5];
-            } else if (annualizedNetPerformancePercentWithCurrencyEffect > 0) {
-              return green[3];
-            } else if (
               Math.abs(annualizedNetPerformancePercentWithCurrencyEffect) === 0
             ) {
               annualizedNetPerformancePercentWithCurrencyEffect = Math.abs(
                 annualizedNetPerformancePercentWithCurrencyEffect
               );
               return gray[3];
-            } else if (
-              annualizedNetPerformancePercentWithCurrencyEffect >
-              -0.01 * GfTreemapChartComponent.HEAT_MULTIPLIER
-            ) {
-              return red[3];
-            } else if (
-              annualizedNetPerformancePercentWithCurrencyEffect >
-              -0.02 * GfTreemapChartComponent.HEAT_MULTIPLIER
-            ) {
-              return red[5];
-            } else if (
-              annualizedNetPerformancePercentWithCurrencyEffect >
-              -0.03 * GfTreemapChartComponent.HEAT_MULTIPLIER
-            ) {
-              return red[7];
+            } else if (annualizedNetPerformancePercentWithCurrencyEffect > 0) {
+              const range =
+                positiveNetPerformancePercentsRange.max -
+                positiveNetPerformancePercentsRange.min;
+
+              if (
+                annualizedNetPerformancePercentWithCurrencyEffect >=
+                positiveNetPerformancePercentsRange.max - range * 0.25
+              ) {
+                return green[9];
+              } else if (
+                annualizedNetPerformancePercentWithCurrencyEffect >=
+                positiveNetPerformancePercentsRange.max - range * 0.5
+              ) {
+                return green[7];
+              } else if (
+                annualizedNetPerformancePercentWithCurrencyEffect >=
+                positiveNetPerformancePercentsRange.max - range * 0.75
+              ) {
+                return green[5];
+              }
+
+              return green[3];
             } else {
-              return red[9];
+              const range =
+                negativeNetPerformancePercentsRange.min -
+                negativeNetPerformancePercentsRange.max;
+
+              if (
+                annualizedNetPerformancePercentWithCurrencyEffect <=
+                negativeNetPerformancePercentsRange.min + range * 0.25
+              ) {
+                return red[9];
+              } else if (
+                annualizedNetPerformancePercentWithCurrencyEffect <=
+                negativeNetPerformancePercentsRange.min + range * 0.5
+              ) {
+                return red[7];
+              } else if (
+                annualizedNetPerformancePercentWithCurrencyEffect <=
+                negativeNetPerformancePercentsRange.min + range * 0.75
+              ) {
+                return red[5];
+              }
+
+              return red[3];
             }
           },
           borderRadius: 4,