Merge branch 'main' into fix/issue-2859

Author: JhaSourav07

app/components/ScrollRestoration.massive-scaling.test.tsx

@@ -0,0 +1,83 @@
+import { render } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+
+import ScrollRestoration from './ScrollRestoration';
+
+const mockUsePathname = vi.fn();
+
+vi.mock('next/navigation', () => ({
+  usePathname: () => mockUsePathname(),
+}));
+
+describe('ScrollRestoration massive scaling behavior', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    sessionStorage.clear();
+    mockUsePathname.mockReturnValue('/');
+    window.scrollTo = vi.fn();
+  });
+
+  it('renders repeatedly without crashing under high mount volume', () => {
+    expect(() => {
+      for (let index = 0; index < 100; index++) {
+        render(<ScrollRestoration />);
+      }
+    }).not.toThrow();
+  });
+
+  it('handles many stored scroll positions without breaking restoration', () => {
+    for (let index = 0; index < 500; index++) {
+      sessionStorage.setItem(`scroll-position-/page-${index}`, String(index));
+    }
+
+    mockUsePathname.mockReturnValue('/page-499');
+
+    render(<ScrollRestoration />);
+
+    expect(window.scrollTo).toHaveBeenCalledWith(0, 499);
+  });
+
+  it('stores scroll position correctly after many scroll events', () => {
+    render(<ScrollRestoration />);
+
+    for (let index = 0; index < 100; index++) {
+      Object.defineProperty(window, 'scrollY', {
+        value: index,
+        configurable: true,
+      });
+
+      window.dispatchEvent(new Event('scroll'));
+    }
+
+    expect(sessionStorage.getItem('scroll-position-/')).toBe('99');
+  });
+
+  it('keeps pathname-specific keys isolated at scale', () => {
+    for (let index = 0; index < 50; index++) {
+      mockUsePathname.mockReturnValue(`/dashboard-${index}`);
+
+      const { unmount } = render(<ScrollRestoration />);
+
+      Object.defineProperty(window, 'scrollY', {
+        value: index * 10,
+        configurable: true,
+      });
+
+      window.dispatchEvent(new Event('scroll'));
+      unmount();
+    }
+
+    expect(sessionStorage.getItem('scroll-position-/dashboard-0')).toBe('0');
+    expect(sessionStorage.getItem('scroll-position-/dashboard-49')).toBe('490');
+  });
+  it('removes scroll listener safely after many unmount cycles', () => {
+    const removeEventListenerSpy = vi.spyOn(window, 'removeEventListener');
+
+    for (let index = 0; index < 25; index++) {
+      const { unmount } = render(<ScrollRestoration />);
+      unmount();
+    }
+
+    expect(removeEventListenerSpy).toHaveBeenCalledTimes(25);
+  });
+});

app/contributors/loading.type-compiler.test.tsx

@@ -0,0 +1,103 @@
+import { describe, it, expect, expectTypeOf } from 'vitest';
+import { z } from 'zod';
+
+// Test suite: verify TypeScript compiler stability and runtime schema boundaries
+describe('Contributors loading type & schema compiler checks (Variation 10)', () => {
+  // Baseline expected contributor shape (matches ContributorsClient internal shape)
+  type ExpectedContributor = {
+    id: number;
+    login: string;
+    avatar_url: string;
+    contributions: number;
+    html_url: string;
+  };
+
+  it('Case 1: Enforce field property configuration types match expected baseline structures exactly', () => {
+    // A matching shape should be exactly equal to the expected contributor type
+    type Matching = {
+      id: number;
+      login: string;
+      avatar_url: string;
+      contributions: number;
+      html_url: string;
+    };
+
+    expectTypeOf<Matching>().toEqualTypeOf<ExpectedContributor>();
+  });
+
+  it('Case 2: Assert that invalid parameter shapes are structurally incompatible', () => {
+    // Wrong types / missing required fields should not match ExpectedContributor
+    type InvalidContributor = {
+      id: string; // wrong type
+      login?: string; // optional where required
+    };
+
+    expectTypeOf<InvalidContributor>().not.toMatchTypeOf<ExpectedContributor>();
+  });
+
+  it('Case 3: Verify custom configurations accept optional parameters without compiler warnings', () => {
+    // Define an expected loading config with optional parameters
+    type LoadingConfig = {
+      limit?: number;
+      showAvatars?: boolean;
+      filters?: { org?: string } | undefined;
+    };
+
+    // A custom consumer may provide only a subset of optional parameters
+    const customConfig = { limit: 6 } satisfies LoadingConfig;
+
+    // runtime assertion to keep TS happy and ensure the optional property works
+    expect(customConfig.limit).toBe(6);
+
+    // compile-time: ensure the custom minimal shape is assignable to LoadingConfig
+    type CustomMinimal = typeof customConfig;
+    expectTypeOf<CustomMinimal>().toMatchTypeOf<LoadingConfig>();
+  });
+
+  it('Case 4: Runtime validation schemas flag structural boundary anomalies with strict error reports', () => {
+    const contributorSchema = z
+      .object({
+        id: z.number(),
+        login: z.string(),
+        avatar_url: z.string(),
+        contributions: z.number(),
+        html_url: z.string(),
+      })
+      .strict();
+
+    const badPayload = {
+      id: 1,
+      login: 'alice',
+      avatar_url: 'https://example.com/a.png',
+      contributions: 42,
+      html_url: 'https://github.com/alice',
+      unexpected_extra: 'surprise',
+    };
+
+    try {
+      contributorSchema.parse(badPayload);
+      // If parse does not throw, force a failure
+      expect(false).toBe(true);
+    } catch (err) {
+      // ZodError -> inspect issues for unrecognized keys
+      const zErr = err as z.ZodError;
+      const hasUnrecognized = zErr.issues.some((i) => i.code === z.ZodIssueCode.unrecognized_keys);
+      expect(hasUnrecognized).toBe(true);
+    }
+  });
+
+  it('Case 5: Ensure type parameters resolve down to stable readonly or structured object contracts', () => {
+    type ReadonlyContributor = Readonly<ExpectedContributor>;
+
+    // Expected readonly contract
+    type ExplicitReadonly = {
+      readonly id: number;
+      readonly login: string;
+      readonly avatar_url: string;
+      readonly contributions: number;
+      readonly html_url: string;
+    };
+
+    expectTypeOf<ReadonlyContributor>().toEqualTypeOf<ExplicitReadonly>();
+  });
+});

app/customize/page.tsx

@@ -20,6 +20,7 @@ import type {
   Language,
   Timezone,
 } from './types';
+import { useDebounce } from '@/hooks/useDebounce';
 import { getExportSnippet, buildQueryParams } from './utils';
 
 // ─── Main Page ────────────────────────────────────────────────────────────────
@@ -54,6 +55,7 @@ function CustomizePageInner(): ReactElement {
   const [svgState, setSvgState] = useState<'idle' | 'loading' | 'loaded' | 'error'>('idle');
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
   const trimmedUsername = username.trim();
+  const debouncedUsername = useDebounce(trimmedUsername, 400);
   const hasUsername = trimmedUsername.length > 0;
   const isRandomTheme = theme === 'random';
 
@@ -146,7 +148,32 @@ function CustomizePageInner(): ReactElement {
     language,
     timezone,
   });
-  const previewSrc = `/api/streak?${queryString}`;
+
+  const previewQueryString = buildQueryParams({
+    username: debouncedUsername,
+    theme,
+    bgHex,
+    accentHex,
+    textHex,
+    scale,
+    speed,
+    font,
+    year,
+    radius,
+    size,
+    hideTitle,
+    hideBackground,
+    hideStats,
+    viewMode,
+    deltaFormat,
+    badgeWidth,
+    badgeHeight,
+    grace,
+    language,
+    timezone,
+  });
+
+  const previewSrc = `/api/streak?${previewQueryString}`;
 
   // On change sync state to URL
   useEffect(() => {
@@ -169,6 +196,13 @@ function CustomizePageInner(): ReactElement {
       return;
     }
 
+    if (!validateGitHubUsername(debouncedUsername)) {
+      setSvgContent('');
+      setSvgState('error');
+      setErrorMessage("That doesn't look like a valid GitHub username");
+      return;
+    }
+
     setSvgState('loading');
     const controller = new AbortController();
 
@@ -235,7 +269,7 @@ function CustomizePageInner(): ReactElement {
       });
 
     return () => controller.abort();
-  }, [previewSrc, hasUsername, trimmedUsername]);
+  }, [previewSrc, hasUsername, debouncedUsername]);
 
   const exportSnippet = getExportSnippet(exportFormat, queryString);
 

lib/hooks/useDebounce.test.ts

@@ -0,0 +1,62 @@
+import { renderHook, act } from '@testing-library/react';
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import { useDebounce } from './useDebounce';
+
+describe('useDebounce', () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it('updates only after the delay', () => {
+    const { result, rerender } = renderHook(({ value }) => useDebounce(value, 400), {
+      initialProps: { value: 'a' },
+    });
+
+    expect(result.current).toBe('a');
+
+    rerender({ value: 'ab' });
+    rerender({ value: 'abc' });
+
+    act(() => {
+      vi.advanceTimersByTime(399);
+    });
+
+    expect(result.current).toBe('a');
+
+    act(() => {
+      vi.advanceTimersByTime(1);
+    });
+
+    expect(result.current).toBe('abc');
+  });
+
+  it('resets the timer when value changes repeatedly', () => {
+    const { result, rerender } = renderHook(({ value }) => useDebounce(value, 400), {
+      initialProps: { value: 'a' },
+    });
+
+    rerender({ value: 'ab' });
+
+    act(() => {
+      vi.advanceTimersByTime(200);
+    });
+
+    rerender({ value: 'abc' });
+
+    act(() => {
+      vi.advanceTimersByTime(200);
+    });
+
+    expect(result.current).toBe('a');
+
+    act(() => {
+      vi.advanceTimersByTime(200);
+    });
+
+    expect(result.current).toBe('abc');
+  });
+});

lib/hooks/useDebounce.ts

@@ -0,0 +1,15 @@
+import { useEffect, useState } from 'react';
+
+export function useDebounce<T>(value: T, delay: number) {
+  const [debouncedValue, setDebouncedValue] = useState(value);
+
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      setDebouncedValue(value);
+    }, delay);
+
+    return () => clearTimeout(timer);
+  }, [value, delay]);
+
+  return debouncedValue;
+}