From 8fd4509435f451447ab570533ed88f9895d688ac Mon Sep 17 00:00:00 2001
From: KenTandrian <kenricktan11@gmail.com>
Date: Tue, 3 Feb 2026 23:39:29 +0700
Subject: [PATCH] fix(libs): improve type safety for chart animations

---
 .../lib/line-chart/line-chart.component.ts    | 19 +++++++++----------
 1 file changed, 9 insertions(+), 10 deletions(-)

diff --git a/libs/ui/src/lib/line-chart/line-chart.component.ts b/libs/ui/src/lib/line-chart/line-chart.component.ts
index e6844c848..0454050c1 100644
--- a/libs/ui/src/lib/line-chart/line-chart.component.ts
+++ b/libs/ui/src/lib/line-chart/line-chart.component.ts
@@ -168,6 +168,11 @@ export class GfLineChartComponent
     };
 
     if (this.chartCanvas) {
+      const animations = {
+        x: this.getAnimationConfigurationForAxis({ labels, axis: 'x' }),
+        y: this.getAnimationConfigurationForAxis({ labels, axis: 'y' })
+      };
+
       if (this.chart) {
         this.chart.data = data;
 
@@ -177,21 +182,15 @@ export class GfLineChartComponent
 
         this.chart.options.plugins.tooltip =
           this.getTooltipPluginConfiguration();
-        this.chart.options.animation = this.isAnimated && {
-          // @ts-ignore
-          x: this.getAnimationConfigurationForAxis({ labels, axis: 'x' }),
-          y: this.getAnimationConfigurationForAxis({ labels, axis: 'y' })
-        };
+        this.chart.options.animations = this.isAnimated
+          ? animations
+          : undefined;
         this.chart.update();
       } else {
         this.chart = new Chart(this.chartCanvas.nativeElement, {
           data,
           options: {
-            animation: this.isAnimated && {
-              // @ts-ignore
-              x: this.getAnimationConfigurationForAxis({ labels, axis: 'x' }),
-              y: this.getAnimationConfigurationForAxis({ labels, axis: 'y' })
-            },
+            animations: this.isAnimated ? animations : undefined,
             aspectRatio: 16 / 9,
             elements: {
               point: {