test(ui): verify responsive rendering and axis scaling of RadarChart (JhaSourav07#1713)

## Description
Adds a new test case to verify that RadarChart scales axis points
dynamically based on max score in data, and renders correct HTML nodes
across responsive viewports.

Fixes JhaSourav07#1539

## Pillar
- [ ] 🎨 Pillar 1 — New Theme Design
- [ ] 📐 Pillar 2 — Geometric SVG Improvement
- [ ] 🕐 Pillar 3 — Timezone Logic Optimization
- [x] 🛠️ Other (Bug fix, refactoring, docs)

## Visual Preview
N/A — test file only, no visual output changes.

## Checklist before requesting a review:
- [x] I have read the `CONTRIBUTING.md` file.
- [x] I have tested these changes locally
(`localhost:3000/api/streak?user=YOUR_USERNAME`).
- [x] I have run `npm run format` and `npm run lint` locally and
resolved all errors (CI will fail otherwise).
- [x] My commits follow the Conventional Commits format (e.g.,
`feat(themes): ...`, `fix(calculate): ...`).
- [ ] I have updated `README.md` if I added a new theme or URL
parameter.
- [x] I have started the repo.
- [x] I have made sure that i have only one commit to merge in this PR.
- [ ] The SVG output matches the CommitPulse "premium quality" aesthetic
standard (no raw elements, smooth animations, correct fonts).
- [x] (Recommended) I joined the CommitPulse Discord community for
contributor discussions, mentorship, and faster PR support.

Author: JhaSourav07

components/dashboard/RadarChart.test.tsx

@@ -52,7 +52,6 @@ describe('RadarChart', () => {
     expect(screen.getByText('User A')).toBeDefined();
     expect(screen.getByText('User B')).toBeDefined();
 
-    // Check that top languages are rendered as axes
     expect(screen.getAllByText('TypeScript')).toBeDefined();
     expect(screen.getAllByText('Python')).toBeDefined();
     expect(screen.getAllByText('JavaScript')).toBeDefined();
@@ -61,7 +60,6 @@ describe('RadarChart', () => {
   it('handles empty input arrays cleanly using pad languages', () => {
     render(<RadarChart languagesA={[]} languagesB={[]} labelA="User A" labelB="User B" />);
 
-    // Padding should supply common ones
     expect(screen.getAllByText('TypeScript')).toBeDefined();
     expect(screen.getAllByText('JavaScript')).toBeDefined();
     expect(screen.getAllByText('Python')).toBeDefined();
@@ -78,4 +76,40 @@ describe('RadarChart', () => {
     expect(screen.getAllByText('JavaScript')).toBeDefined();
     expect(screen.getAllByText('Python')).toBeDefined();
   });
+
+  it('scales axis points dynamically based on max score in data', () => {
+    const highScoreLangs = [
+      { name: 'TypeScript', percentage: 100, color: '#3178c6' },
+      { name: 'Python', percentage: 80, color: '#3572A5' },
+      { name: 'JavaScript', percentage: 60, color: '#f1e05a' },
+    ];
+
+    const lowScoreLangs = [
+      { name: 'TypeScript', percentage: 10, color: '#3178c6' },
+      { name: 'Python', percentage: 5, color: '#3572A5' },
+      { name: 'JavaScript', percentage: 2, color: '#f1e05a' },
+    ];
+
+    const { container } = render(
+      <RadarChart
+        languagesA={highScoreLangs}
+        languagesB={lowScoreLangs}
+        labelA="High Scorer"
+        labelB="Low Scorer"
+      />
+    );
+
+    expect(screen.getAllByText('TypeScript')).toBeDefined();
+    expect(screen.getAllByText('Python')).toBeDefined();
+    expect(screen.getAllByText('JavaScript')).toBeDefined();
+
+    expect(screen.getByText('100%')).toBeDefined();
+    expect(screen.getByText('10%')).toBeDefined();
+
+    const svg = container.querySelector('svg');
+    expect(svg).not.toBeNull();
+
+    const circles = container.querySelectorAll('circle');
+    expect(circles.length).toBeGreaterThan(0);
+  });
 });