Merge branch 'main' into fix/growth-chart-svg-id-collision

Author: JhaSourav07

app/compare/page.tsx

@@ -1,6 +1,7 @@
 import { Suspense } from 'react';
 import type { Metadata } from 'next';
 import CompareClient from './CompareClient';
+import { Footer } from '../components/Footer';
 
 export const metadata: Metadata = {
   title: 'Compare | CommitPulse',
@@ -14,14 +15,19 @@ export const metadata: Metadata = {
 
 export default function ComparePage() {
   return (
-    <Suspense
-      fallback={
-        <div className="min-h-screen flex items-center justify-center pt-28 pb-16">
-          <div className="w-8 h-8 rounded-full border-2 border-emerald-500 border-t-transparent animate-spin"></div>
-        </div>
-      }
-    >
-      <CompareClient />
-    </Suspense>
+    <>
+      <Suspense
+        fallback={
+          <div className="min-h-screen flex items-center justify-center pt-28 pb-16">
+            <div className="w-8 h-8 rounded-full border-2 border-emerald-500 border-t-transparent animate-spin"></div>
+          </div>
+        }
+      >
+        <CompareClient />
+      </Suspense>
+      <div className="mx-auto max-w-7xl px-6 pb-8">
+        <Footer />
+      </div>
+    </>
   );
 }

app/components/CopyRepoButton.tsx

@@ -0,0 +1,30 @@
+'use client';
+
+import { useState } from 'react';
+import { Copy } from 'lucide-react';
+
+export default function CopyRepoButton() {
+  const [copied, setCopied] = useState(false);
+
+  const repoUrl = 'https://github.com/JhaSourav07/commitpulse';
+
+  const handleCopy = async () => {
+    await navigator.clipboard.writeText(repoUrl);
+
+    setCopied(true);
+
+    setTimeout(() => {
+      setCopied(false);
+    }, 2000);
+  };
+
+  return (
+    <button
+      onClick={handleCopy}
+      className="inline-flex items-center gap-2 rounded-2xl border border-black/10 bg-white/60 px-8 py-4 font-semibold transition-all duration-300 hover:scale-105 dark:border-white/10 dark:bg-white/5"
+    >
+      <Copy className="h-5 w-5" />
+      {copied ? 'Copied!' : 'Copy URL'}
+    </button>
+  );
+}

app/contributors/page.tsx

@@ -1,10 +1,10 @@
 import Link from 'next/link';
 import { Globe, Sparkles, Users, GitPullRequest, ArrowRight } from 'lucide-react';
-
 import BrandParticles from '@/components/BrandParticles';
 import { Footer } from '@/app/components/Footer';
 import ContributorsSearch from './ContributorsSearch';
 import Leaderboard from '@/components/Leaderboard';
+import CopyRepoButton from '@/app/components/CopyRepoButton';
 
 interface Contributor {
   id: number;
@@ -231,6 +231,8 @@ export default async function ContributorsPage() {
                   View Repository
                 </Link>
 
+                <CopyRepoButton />
+
                 <Link
                   href="https://github.com/JhaSourav07/commitpulse/issues"
                   target="_blank"

app/customize/page.tsx

@@ -150,6 +150,32 @@ export default function CustomizePage(): ReactElement {
         // - Use a conservative URI whitelist to prevent javascript: URIs
         const sanitized = DOMPurify.sanitize(text, {
           USE_PROFILES: { svg: true },
+          ADD_TAGS: ['animate', 'style'],
+          ADD_ATTR: [
+            'fill',
+            'fill-opacity',
+            'stroke',
+            'stroke-width',
+            'stroke-opacity',
+            'x1',
+            'y1',
+            'x2',
+            'y2',
+            'stop-color',
+            'stop-opacity',
+            'offset',
+            'transform-origin',
+            'transform-box',
+            'transform',
+            'attributeName',
+            'from',
+            'to',
+            'dur',
+            'repeatCount',
+            'id',
+            'class',
+            'href',
+          ],
           FORBID_TAGS: ['foreignObject', 'iframe', 'object', 'embed', 'script'],
           FORBID_ATTR: ['xlink:href'],
           ALLOWED_URI_REGEXP: /^(?:(?:https?|mailto|data):|#)/i,

app/page.tsx

@@ -1,6 +1,5 @@
 'use client';
 import { trackUser } from '@/utils/tracking';
-import InteractiveViewer from '@/components/InteractiveViewer';
 import Link from 'next/link';
 import { useRef, useState, useEffect } from 'react';
 import { AnimatePresence, motion } from 'framer-motion';

components/FeatureCards.tsx

@@ -4,9 +4,7 @@ import { useRef, useState, useEffect, type ReactNode } from 'react';
 import gsap from 'gsap';
 import { ScrollTrigger } from 'gsap/ScrollTrigger';
 
-if (typeof window !== 'undefined') {
-  gsap.registerPlugin(ScrollTrigger);
-}
+let gsapRegistered = false;
 
 /* ─── Types ─── */
 interface FeatureCardProps {
@@ -44,7 +42,7 @@ function FloatingParticle({
     tl.to(ref.current, {
       opacity: 0.6,
       y: -60,
-      x: `random(-30, 30)`,
+      x: Math.random() * 60 - 30,
       duration: duration * 0.4,
       ease: 'power2.out',
     })
@@ -119,8 +117,6 @@ function AnimatedBorder({ color, isHovered }: { color: string; isHovered: boolea
       style={{
         opacity: 0,
         background: `conic-gradient(from 0deg, transparent, ${color}, transparent, ${color}44, transparent)`,
-        mask: 'linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0)',
-        maskComposite: 'exclude',
         WebkitMaskComposite: 'xor',
         padding: '1.5px',
       }}
@@ -417,6 +413,13 @@ export function FeatureCard({ icon, title, desc, accent, index, accentColor }: F
 
 /* ─── Section Wrapper (optional heading + background glow) ─── */
 export function FeatureCardsSection({ children }: { children: ReactNode }) {
+  useEffect(() => {
+    if (!gsapRegistered) {
+      gsap.registerPlugin(ScrollTrigger);
+      gsapRegistered = true;
+    }
+  }, []);
+
   const sectionRef = useRef<HTMLDivElement>(null);
   const headingRef = useRef<HTMLHeadingElement>(null);