feat(lib): make chartCanvas a view child signal

libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts

@@ -18,7 +18,7 @@ import {
   OnChanges,
   OnDestroy,
   Output,
-  ViewChild
+  viewChild
 } from '@angular/core';
 import { DataSource } from '@prisma/client';
 import { Big } from 'big.js';
@@ -83,11 +83,11 @@ export class GfPortfolioProportionChartComponent
 
   @Output() proportionChartClicked = new EventEmitter<AssetProfileIdentifier>();
 
-  @ViewChild('chartCanvas') chartCanvas: ElementRef<HTMLCanvasElement>;
-
   public chart: Chart<'doughnut'>;
   public isLoading = true;
 
+  private readonly chartCanvas =
+    viewChild.required<ElementRef<HTMLCanvasElement>>('chartCanvas');
   private readonly OTHER_KEY = 'OTHER';
 
   private colorMap: {
@@ -336,7 +336,6 @@ export class GfPortfolioProportionChartComponent
       labels
     };
 
-    if (this.chartCanvas) {
     if (this.chart) {
       this.chart.data = data;
       this.chart.options.plugins ??= {};
@@ -345,7 +344,7 @@ export class GfPortfolioProportionChartComponent
 
       this.chart.update();
     } else {
-        this.chart = new Chart<'doughnut'>(this.chartCanvas.nativeElement, {
+      this.chart = new Chart<'doughnut'>(this.chartCanvas().nativeElement, {
         data,
         options: {
           animation: false,
@@ -406,7 +405,6 @@ export class GfPortfolioProportionChartComponent
         type: 'doughnut'
       });
     }
-    }
 
     this.isLoading = false;
   }