refactor(dashboard): extract heatmap intensity utility (JhaSourav07#606)

## Description
Extracted the heatmap intensity-to-class mapping into a standalone
utility and added unit tests for all intensity levels including
out-of-range values.

Fixes JhaSourav07#363 

## 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

## 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.
- [ ] 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/Heatmap.test.ts

@@ -0,0 +1,28 @@
+import { describe, it, expect } from 'vitest';
+import { getIntensityColor } from './heatmapUtils';
+
+describe('getIntensityColor', () => {
+  it('returns correct color for intensity 0', () => {
+    expect(getIntensityColor(0)).toBe('bg-gray-200 dark:bg-[#161616]');
+  });
+
+  it('returns correct color for intensity 1', () => {
+    expect(getIntensityColor(1)).toBe('bg-gray-400 dark:bg-zinc-700');
+  });
+
+  it('returns correct color for intensity 2', () => {
+    expect(getIntensityColor(2)).toBe('bg-gray-500 dark:bg-zinc-500');
+  });
+
+  it('returns correct color for intensity 3', () => {
+    expect(getIntensityColor(3)).toBe('bg-gray-700 dark:bg-zinc-300');
+  });
+
+  it('returns correct color for intensity 4', () => {
+    expect(getIntensityColor(4)).toBe('bg-black dark:bg-white');
+  });
+
+  it('returns default color for out-of-range intensity', () => {
+    expect(getIntensityColor(999)).toBe('bg-gray-200 dark:bg-[#161616]');
+  });
+});

components/dashboard/Heatmap.tsx

@@ -3,6 +3,7 @@
 import { useEffect, useRef, useState } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { ActivityData } from '@/types/dashboard';
+import { getIntensityColor } from './heatmapUtils';
 
 const CELL = 14;
 const GAP = 3;
@@ -37,23 +38,6 @@ export default function Heatmap({ data }: { data: ActivityData[] }) {
     return () => observer.disconnect();
   }, [naturalWidth]);
 
-  const getIntensityColor = (intensity: number) => {
-    switch (intensity) {
-      case 0:
-        return 'bg-gray-200 dark:bg-[#161616]';
-      case 1:
-        return 'bg-gray-400 dark:bg-zinc-700';
-      case 2:
-        return 'bg-gray-500 dark:bg-zinc-500';
-      case 3:
-        return 'bg-gray-700 dark:bg-zinc-300';
-      case 4:
-        return 'bg-black dark:bg-white';
-      default:
-        return 'bg-gray-200 dark:bg-[#161616]';
-    }
-  };
-
   const handleMouseEnter = (e: React.MouseEvent<HTMLDivElement>, day: ActivityData) => {
     const rect = e.currentTarget.getBoundingClientRect();
     setTooltip({

components/dashboard/heatmapUtils.ts

@@ -0,0 +1,16 @@
+export const getIntensityColor = (intensity: number): string => {
+  switch (intensity) {
+    case 0:
+      return 'bg-gray-200 dark:bg-[#161616]';
+    case 1:
+      return 'bg-gray-400 dark:bg-zinc-700';
+    case 2:
+      return 'bg-gray-500 dark:bg-zinc-500';
+    case 3:
+      return 'bg-gray-700 dark:bg-zinc-300';
+    case 4:
+      return 'bg-black dark:bg-white';
+    default:
+      return 'bg-gray-200 dark:bg-[#161616]';
+  }
+};