LG-5588 Fix array field updates in chart options merge (#3351)

* feat: correctly merge array-fields (choose full override, no recursive)

* docs

Author: nima-taheri-mongodb

.changeset/calm-buckets-admire.md

@@ -0,0 +1,6 @@
+---
+'@lg-charts/core': patch
+---
+
+Ensure array fields like `labels` in `<XAxis>` are updated as expected in the chart options.
+This update changes the recursive merge function in the EChart options utility to treat arrays as atoms: instead of merging their elements, it now replaces arrays entirely. Previously, arrays were being merged like objects, resulting in arrays becoming plain objects with numeric keys. With this fix, when merging, any existing array field (such as `labels` on `<XAxis>`) is now overwritten by the new array rather than partially merged.

charts/core/src/Echart/utils/updateUtils.spec.ts

@@ -53,22 +53,28 @@ describe('@lg-charts/core/Chart/hooks/updateUtils', () => {
   test('updateOptions should merge chart options non-destructively', () => {
     const currentOptions: Partial<EChartOptions> = {
       xAxis: {
+        type: 'category',
         show: true,
+        data: ['series1', 'series2', 'series3'],
         splitLine: {
           show: true,
         },
       },
     };
     const updatedOptions = updateOptions(currentOptions, {
       xAxis: {
+        type: 'category',
         show: false, // This should only update the show property and not other properties
+        data: ['series4', 'series5'],
       },
       grid: {
         show: true,
       },
     });
     // @ts-ignore: Property 'show' does not exist on type 'Arrayable<AriaOption>'.
     expect(updatedOptions?.xAxis?.show).toBe(false);
+    // @ts-ignore: Property 'data' does not exist on type 'Arrayable<XAXisOption>'.
+    expect(updatedOptions?.xAxis?.data).toEqual(['series4', 'series5']);
     // @ts-ignore: Property 'show' does not exist on type 'Arrayable<AriaOption>'.
     expect(updatedOptions?.xAxis?.splitLine?.show).toBe(true);
     // @ts-ignore: Property 'show' does not exist on type 'Arrayable<GridOption>'.

charts/core/src/Echart/utils/updateUtils.ts

@@ -1,3 +1,5 @@
+import { isPlainObject } from 'lodash';
+
 import { EChartOptions, EChartSeriesOption } from '../Echart.types';
 
 export function addSeries(
@@ -46,10 +48,7 @@ function recursiveMerge(
   const updatedObj = { ...target };
 
   for (const key in source) {
-    if (
-      typeof source[key] === 'object' &&
-      typeof updatedObj[key] === 'object'
-    ) {
+    if (isPlainObject(source[key]) && isPlainObject(updatedObj[key])) {
       // Recursively update nested objects
       updatedObj[key] = recursiveMerge(updatedObj[key], source[key]);
     } else {