fix: resolve TypeScript ESLint warnings

Author: Srushti-Kamble14

src/components/BlogSearch/index.tsx

@@ -192,7 +192,7 @@ export default function BlogSearch({ initialSearchTerm = "", onSearchSubmit }: B
                 <div className="blog-search-section">
                   <h4 className="blog-search-section-title">MATCHING ARTICLES</h4>
                   <div className="blog-search-articles">
-                    {searchResults.articles.map((article, idx) => {
+                    {searchResults.articles.map((article) => {
                       const itemIndex = selectableItems.findIndex((item) => item.label === article.title);
                       return (
                         <Link 

src/components/Community/index.tsx

@@ -1,4 +1,4 @@
-import React, { type FC, useEffect, useState, useMemo } from "react";
+import React, { type FC, useMemo } from "react";
 import SlotCounter from "react-slot-counter";
 import "./LandingCommunity.css";
 import { useCommunityStatsContext } from "@site/src/lib/statsProvider";

src/components/FloatingContributors/index.tsx

@@ -439,26 +439,6 @@ const FloatingContributors: React.FC<FloatingContributorsProps> = ({
     }
   };
 
-  // Get icon for action type
-  const getActionIcon = (action: ContributorActivity["action"]): string => {
-    switch (action) {
-      case "pushed":
-        return "🚀";
-      case "created":
-        return "✨";
-      case "merged":
-        return "🔄";
-      case "opened":
-        return "📝";
-      case "commented":
-        return "💬";
-      case "closed":
-        return "✅";
-      default:
-        return "💻";
-    }
-  };
-
   // Get text for action type
   const getActionText = (action: ContributorActivity["action"]): string => {
     switch (action) {

src/components/blogCarousel/blogCarousel.tsx

@@ -82,7 +82,7 @@ export function BlogCarousel() {
             >
               <BlogCard
                 type={blog.category}
-                date={(blog as any).date}
+                date={blog.date}
                 title={blog.title}
                 content={blog.description}
                 imageUrl={blog.image}
@@ -119,4 +119,4 @@ export function BlogCarousel() {
       </Carousel>
     </div>
   );
-}
+}

src/components/dashboard/LeaderBoard/leaderboard.tsx

@@ -11,6 +11,7 @@ import { mockContributors } from "./mockData";
 import "./leaderboard.css";
 
 const GITHUB_ORG = "recodehive";
+type TimeFilter = "week" | "month" | "year" | "all";
 
 // Users to exclude from the leaderboard
 const EXCLUDED_USERS = [
@@ -44,12 +45,6 @@ interface Contributor {
   badges?: string[]; // Array of badge image paths
 }
 
-interface Stats {
-  flooredTotalPRs: number;
-  totalContributors: number;
-  flooredTotalPoints: number;
-}
-
 // Badge configuration - maps badge numbers to achievement criteria
 const BADGE_CONFIG = [
   {
@@ -212,63 +207,6 @@ function Badge({
   );
 }
 
-function TopPerformerCard({
-  contributor,
-  rank,
-  onPRClick,
-  onBadgeClick,
-}: {
-  contributor: Contributor;
-  rank: number;
-  onPRClick: (contributor: Contributor) => void;
-  onBadgeClick?: (contributor: Contributor) => void;
-}) {
-  const { isDark } = useSafeColorMode();
-  const rankClass = rank === 1 ? "top-1" : rank === 2 ? "top-2" : "top-3";
-  const badges = getContributorBadges(contributor, rank);
-
-  return (
-    <div className={`top-performer-card ${isDark ? "dark" : "light"}`}>
-      <img
-        src={contributor.avatar}
-        alt={contributor.username}
-        className="avatar large"
-      />
-      <div className={`rank-overlay ${rankClass}`}>
-        <span className="rank-text">{rank}</span>
-      </div>
-      <div className="performer-info">
-        <a
-          href={contributor.profile}
-          target="_blank"
-          rel="noreferrer"
-          className="username-link"
-        >
-          {contributor.username}
-        </a>
-        <ContributorBadges
-          badges={badges}
-          onClick={() => onBadgeClick?.(contributor)}
-        />
-        <div className="badges-container">
-          <Badge
-            count={contributor.prs}
-            label="PRs"
-            color={{ background: "#dbeafe", color: "#2563eb" }}
-            onClick={() => onPRClick(contributor)}
-            clickable={true}
-          />
-          <Badge
-            count={contributor.points}
-            label="Points"
-            color={{ background: "#ede9fe", color: "#7c3aed" }}
-          />
-        </div>
-      </div>
-    </div>
-  );
-}
-
 export default function LeaderBoard(): JSX.Element {
   // Get time filter functions from context
   const {
@@ -349,7 +287,6 @@ export default function LeaderBoard(): JSX.Element {
 
   const renderPaginationButtons = () => {
     const pages = [];
-    const maxVisibleButtons = 5; // Maximum number of page buttons to show directly
 
     // Special case: if we have 7 or fewer pages, show all of them without ellipsis
     if (totalPages <= 7) {
@@ -448,22 +385,6 @@ export default function LeaderBoard(): JSX.Element {
     return "regular";
   };
 
-  // Helper function for time filter display
-  const getTimeFilterLabel = (filter: string) => {
-    switch (filter) {
-      case "week":
-        return "📊 This Week";
-      case "month":
-        return "📆 This Month";
-      case "year":
-        return "📅 This Year";
-      case "all":
-        return "🏆 All Time";
-      default:
-        return "🏆 All Time";
-    }
-  };
-
   return (
     <div className={`leaderboard-container ${isDark ? "dark" : "light"}`}>
       <div className="leaderboard-content">
@@ -498,7 +419,7 @@ export default function LeaderBoard(): JSX.Element {
                   value={currentTimeFilter}
                   onChange={(e) => {
                     // Use setTimeFilter from context
-                    setTimeFilter(e.target.value as any);
+                    setTimeFilter(e.target.value as TimeFilter);
                     setCurrentPage(1);
                     setIsSelectChanged(true);
                     setTimeout(() => setIsSelectChanged(false), 1200);

src/components/faqs/faqs.tsx

@@ -44,7 +44,7 @@ const faqData = [
 
 const FAQs: React.FC = () => {
   const [activeIndex, setActiveIndex] = useState<number | null>(null);
-  const { colorMode, isDark } = useSafeColorMode();
+  const { isDark } = useSafeColorMode();
 
   const toggleAccordion = (index: number) => {
     setActiveIndex(activeIndex === index ? null : index);

src/components/navbar/NavbarIconInjector.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { createRoot } from "react-dom/client";
+import { createRoot, type Root } from "react-dom/client";
 import NavbarIcon from "./NavbarIcon";
 import {
   NAVBAR_ICONS,
@@ -8,7 +8,7 @@ import {
 
 export default function NavbarIconInjector() {
   useEffect(() => {
-    const roots = new Map<string, any>();
+    const roots = new Map<string, Root>();
 
     NAVBAR_ICONS.forEach((name: NavbarIconName) => {
       const id = `nav-${name.toLowerCase()}`;

src/components/ourProjects.tsx

@@ -50,7 +50,7 @@ export interface Props {
 const ShowcasePage: React.FC<Props> = ({
   Data: legacyData,
 }) => {
-  const { colorMode, isDark } = useSafeColorMode();
+  const { isDark } = useSafeColorMode();
 
   // Use JSON data by default, fallback to legacy props for backward compatibility
   // Convert legacy data to new format if needed
@@ -169,8 +169,6 @@ const SelectComponent = ({
   isDark: boolean;
 }) => {
   const [activeItem, setActiveItem] = useState(0);
-  const [isHovered, setIsHovered] = useState(false);
-
   return (
     <motion.div
       initial={{ opacity: 0, y: 20 }}

src/components/testimonials/TestimonialCard.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React from "react";
 import { motion } from "framer-motion";
 import { Quote } from "lucide-react";
 import { Avatar, AvatarFallback, AvatarImage } from "../ui/avatar";

src/components/topmate/TopMateCard.tsx

@@ -31,9 +31,6 @@ const TopMateCard: React.FC<TopMateCardProps> = ({
   const { isDark } = useSafeColorMode();
 
   const borderClr = isDark ? "rgba(255,255,255,0.06)" : "rgba(0,0,0,0.07)";
-  const mutedClr = isDark
-    ? "rgba(148,163,184,0.55)"
-    : "rgba(100,116,139,0.65)";
   const subtleClr = isDark
     ? "rgba(148,163,184,0.35)"
     : "rgba(100,116,139,0.45)";
@@ -324,4 +321,4 @@ const TopMateCard: React.FC<TopMateCardProps> = ({
   );
 };
 
-export default TopMateCard;
+export default TopMateCard;