Extend markets

apps/api/src/app/endpoints/market-data/market-data.controller.ts

@@ -72,11 +72,13 @@ export class MarketDataController {
     ]);
 
     return {
-      CRYPTOCURRENCIES: {
-        ...marketDataFearAndGreedIndexCryptocurrencies
-      },
-      STOCKS: {
-        ...marketDataFearAndGreedIndexStocks
+      fearAndGreedIndex: {
+        CRYPTOCURRENCIES: {
+          ...marketDataFearAndGreedIndexCryptocurrencies
+        },
+        STOCKS: {
+          ...marketDataFearAndGreedIndexStocks
+        }
       }
     };
   }

apps/client/src/app/components/markets/markets.component.ts

@@ -6,12 +6,10 @@ import { resetHours } from '@ghostfolio/common/helper';
 import {
   Benchmark,
   HistoricalDataItem,
-  InfoItem,
   MarketDataOfMarketsResponse,
   ToggleOption,
   User
 } from '@ghostfolio/common/interfaces';
-import { hasPermission, permissions } from '@ghostfolio/common/permissions';
 import { FearAndGreedIndexMode } from '@ghostfolio/common/types';
 import { GfBenchmarkComponent } from '@ghostfolio/ui/benchmark';
 import { GfLineChartComponent } from '@ghostfolio/ui/line-chart';
@@ -47,17 +45,15 @@ export class MarketsComponent implements OnDestroy, OnInit {
   public benchmarks: Benchmark[];
   public deviceType: string;
   public fearAndGreedIndex: number;
-  public fearAndGreedIndexData: MarketDataOfMarketsResponse;
+  public fearAndGreedIndexData: MarketDataOfMarketsResponse['fearAndGreedIndex'];
   public fearLabel = $localize`Fear`;
   public greedLabel = $localize`Greed`;
-  public hasPermissionToAccessFearAndGreedIndex: boolean;
   public historicalDataItems: HistoricalDataItem[];
   public fearAndGreedIndexMode: FearAndGreedIndexMode = 'STOCKS';
   public fearAndGreedIndexModeOptions: ToggleOption[] = [
     { label: $localize`Stocks`, value: 'STOCKS' },
     { label: $localize`Cryptocurrencies`, value: 'CRYPTOCURRENCIES' }
   ];
-  public info: InfoItem;
   public readonly numberOfDays = 365;
   public user: User;
 
@@ -70,7 +66,6 @@ export class MarketsComponent implements OnDestroy, OnInit {
     private userService: UserService
   ) {
     this.deviceType = this.deviceService.getDeviceInfo().deviceType;
-    this.info = this.dataService.fetchInfo();
 
     this.userService.stateChanged
       .pipe(takeUntil(this.unsubscribeSubject))
@@ -84,23 +79,16 @@ export class MarketsComponent implements OnDestroy, OnInit {
   }
 
   public ngOnInit() {
-    this.hasPermissionToAccessFearAndGreedIndex = hasPermission(
-      this.info?.globalPermissions,
-      permissions.enableFearAndGreedIndex
-    );
-
-    if (this.hasPermissionToAccessFearAndGreedIndex) {
-      this.dataService
-        .fetchMarketDataOfMarkets({ includeHistoricalData: this.numberOfDays })
-        .pipe(takeUntil(this.unsubscribeSubject))
-        .subscribe((fearAndGreedIndexData) => {
-          this.fearAndGreedIndexData = fearAndGreedIndexData;
+    this.dataService
+      .fetchMarketDataOfMarkets({ includeHistoricalData: this.numberOfDays })
+      .pipe(takeUntil(this.unsubscribeSubject))
+      .subscribe(({ fearAndGreedIndex }) => {
+        this.fearAndGreedIndexData = fearAndGreedIndex;
 
-          this.initialize();
+        this.initialize();
 
-          this.changeDetectorRef.markForCheck();
-        });
-    }
+        this.changeDetectorRef.markForCheck();
+      });
 
     this.dataService
       .fetchBenchmarks()

apps/client/src/app/components/markets/markets.html

@@ -1,45 +1,41 @@
 <div class="container">
   <h1 class="d-none d-sm-block h3 mb-4 text-center" i18n>Markets</h1>
-  @if (hasPermissionToAccessFearAndGreedIndex) {
-    <div class="mb-5 row">
-      <div class="col-xs-12 col-md-10 offset-md-1">
-        <div class="d-flex">
-          <div
-            class="align-items-center d-flex flex-grow-1 justify-content-end"
-          >
-            <gf-toggle
-              class="d-none d-lg-block"
-              [defaultValue]="fearAndGreedIndexMode"
-              [isLoading]="false"
-              [options]="fearAndGreedIndexModeOptions"
-              (change)="onChangeFearAndGreedIndexMode($event.value)"
-            />
-          </div>
-        </div>
-        <div class="mb-2 text-center text-muted">
-          <small i18n>Last {{ numberOfDays }} Days</small>
+  <div class="mb-5 row">
+    <div class="col-xs-12 col-md-10 offset-md-1">
+      <div class="d-flex">
+        <div class="align-items-center d-flex flex-grow-1 justify-content-end">
+          <gf-toggle
+            class="d-none d-lg-block"
+            [defaultValue]="fearAndGreedIndexMode"
+            [isLoading]="false"
+            [options]="fearAndGreedIndexModeOptions"
+            (change)="onChangeFearAndGreedIndexMode($event.value)"
+          />
         </div>
-        <gf-line-chart
-          class="mb-3"
-          symbol="Fear & Greed Index"
-          [colorScheme]="user?.settings?.colorScheme"
-          [historicalDataItems]="historicalDataItems"
-          [isAnimated]="true"
-          [locale]="user?.settings?.locale || undefined"
-          [showXAxis]="true"
-          [showYAxis]="true"
-          [yMax]="100"
-          [yMaxLabel]="greedLabel"
-          [yMin]="0"
-          [yMinLabel]="fearLabel"
-        />
-        <gf-fear-and-greed-index
-          class="d-flex justify-content-center"
-          [fearAndGreedIndex]="fearAndGreedIndex"
-        />
       </div>
+      <div class="mb-2 text-center text-muted">
+        <small i18n>Last {{ numberOfDays }} Days</small>
+      </div>
+      <gf-line-chart
+        class="mb-3"
+        symbol="Fear & Greed Index"
+        [colorScheme]="user?.settings?.colorScheme"
+        [historicalDataItems]="historicalDataItems"
+        [isAnimated]="true"
+        [locale]="user?.settings?.locale || undefined"
+        [showXAxis]="true"
+        [showYAxis]="true"
+        [yMax]="100"
+        [yMaxLabel]="greedLabel"
+        [yMin]="0"
+        [yMinLabel]="fearLabel"
+      />
+      <gf-fear-and-greed-index
+        class="d-flex justify-content-center"
+        [fearAndGreedIndex]="fearAndGreedIndex"
+      />
     </div>
-  }
+  </div>
 
   <div class="mb-3 row">
     <div class="col-xs-12 col-md-10 offset-md-1">

apps/client/src/app/services/data.service.ts

@@ -497,11 +497,12 @@ export class DataService {
 
     return this.http.get<any>('/api/v1/market-data/markets', { params }).pipe(
       map((data) => {
-        for (const item of data.CRYPTOCURRENCIES.historicalData) {
+        for (const item of data.fearAndGreedIndex.CRYPTOCURRENCIES
+          .historicalData) {
           item.date = parseISO(item.date);
         }
 
-        for (const item of data.STOCKS.historicalData) {
+        for (const item of data.fearAndGreedIndex.STOCKS.historicalData) {
           item.date = parseISO(item.date);
         }
 

libs/common/src/lib/interfaces/responses/market-data-of-markets-response.interface.ts

@@ -1,6 +1,8 @@
 import { SymbolItem } from '@ghostfolio/api/app/symbol/interfaces/symbol-item.interface';
 
 export interface MarketDataOfMarketsResponse {
-  CRYPTOCURRENCIES: SymbolItem;
-  STOCKS: SymbolItem;
+  fearAndGreedIndex: {
+    CRYPTOCURRENCIES: SymbolItem;
+    STOCKS: SymbolItem;
+  };
 }