Update Chart

package.json

@@ -16,7 +16,7 @@
         "recharts": "^2.9.3",
         "tailwind-merge": "^2.0.0",
         "tailwind-styled-components": "^2.2.0",
-        "uno-js": "^3.56.0"
+        "uno-js": "^3.57.0"
     },
     "devDependencies": {
         "@rspack/cli": "^0.3.11",
@@ -38,10 +38,10 @@
         "husky": "^8.0.3",
         "jest": "^29.7.0",
         "jest-environment-jsdom": "^29.7.0",
-        "lint-staged": "^15.0.2",
+        "lint-staged": "^15.1.0",
         "object-hash": "^3.0.0",
         "postcss-loader": "^7.3.3",
-        "prettier": "^3.0.3",
+        "prettier": "^3.1.0",
         "tailwindcss": "^3.3.5",
         "ts-jest": "^29.1.1",
         "typescript": "^5.2.2"

src/ChartBar/ChartBar.spec.tsx

@@ -48,6 +48,15 @@ describe('ChartBar', () => {
     expect(getByText('Ref Line')).toBeInTheDocument();
   });
 
+  it('renders loading', () => {
+    const undefinedValue: number[] | undefined = undefined;
+    const callback = (data: number[]) => [];
+
+    const { container } = render(<ChartBar rawData={undefinedValue} dataCallback={callback} />);
+
+    expect(container.querySelector('.loading-shimmer')).toBeInTheDocument();
+  });
+
   it('renders the no data legend', () => {
     const { getByText } = render(<ChartBar rawData={[]} dataCallback={identity} />);
     expect(getByText('No record found')).toBeInTheDocument();

src/DataChart/DataChart.spec.tsx

@@ -14,6 +14,15 @@ describe('DataChart', () => {
     render(<DataChart rawData={[]} dataCallback={identity} />);
   });
 
+  it('renders loading', () => {
+    const undefinedValue: number[] | undefined = undefined;
+    const callback = (data: number[]) => [];
+
+    const { container } = render(<DataChart rawData={undefinedValue} dataCallback={callback} />);
+
+    expect(container.querySelector('.loading-shimmer')).toBeInTheDocument();
+  });
+
   it('renders the no data legend', () => {
     const { getByText } = render(<DataChart rawData={[]} dataCallback={identity} />);
     expect(getByText('No record found')).toBeInTheDocument();

src/PieChart/PieChart.spec.tsx

@@ -24,7 +24,16 @@ describe('PieChart', () => {
         const slices = container.querySelectorAll('.recharts-pie-sector');
         expect(slices.length).toBe(dataStore.length);
     });
-
+
+    it('renders loading', () => {
+        const undefinedValue: number[] | undefined = undefined;
+        const callback = (data: number[]) => [];
+
+        const { container } = render(<PieChart rawData={undefinedValue} dataCallback={callback} />);
+
+        expect(container.querySelector('.loading-shimmer')).toBeInTheDocument();
+    });
+
     it('renders the no data legend', () => {
         const { getByText } = render(<PieChart rawData={[]} dataCallback={identity} />);
         expect(getByText('No record found')).toBeInTheDocument();