feat(client): use viewChild signals

apps/client/src/app/components/investment-chart/investment-chart.component.ts

@@ -24,7 +24,7 @@ import {
   Input,
   OnChanges,
   OnDestroy,
-  ViewChild
+  viewChild
 } from '@angular/core';
 import {
   BarController,
@@ -66,7 +66,8 @@ export class GfInvestmentChartComponent implements OnChanges, OnDestroy {
   @Input() public locale = getLocale();
   @Input() public savingsRate = 0;
 
-  @ViewChild('chartCanvas') private chartCanvas: ElementRef<HTMLCanvasElement>;
+  private readonly chartCanvas =
+    viewChild.required<ElementRef<HTMLCanvasElement>>('chartCanvas');
 
   private chart: Chart<'bar' | 'line'>;
   private investments: InvestmentItem[];
@@ -172,7 +173,9 @@ export class GfInvestmentChartComponent implements OnChanges, OnDestroy {
 
         this.chart.update();
       } else {
-        this.chart = new Chart<'bar' | 'line'>(this.chartCanvas.nativeElement, {
+        this.chart = new Chart<'bar' | 'line'>(
+          this.chartCanvas().nativeElement,
+          {
             data: chartData,
             options: {
               animation: false,
@@ -278,10 +281,11 @@ export class GfInvestmentChartComponent implements OnChanges, OnDestroy {
               }
             },
             plugins: [
-            getVerticalHoverLinePlugin(this.chartCanvas, this.colorScheme)
+              getVerticalHoverLinePlugin(this.chartCanvas(), this.colorScheme)
             ],
             type: this.groupBy ? 'bar' : 'line'
-        });
+          }
+        );
       }
     }
   }