diff --git a/src/components/dashboard/LeaderBoard/PRListModal.tsx b/src/components/dashboard/LeaderBoard/PRListModal.tsx
new file mode 100644
index 00000000..ace9e91c
--- /dev/null
+++ b/src/components/dashboard/LeaderBoard/PRListModal.tsx
@@ -0,0 +1,176 @@
+// src/components/dashboard/LeaderBoard/PRListModal.tsx
+import React from "react";
+import { motion, AnimatePresence } from "framer-motion";
+import { FaTimes, FaExternalLinkAlt, FaGithub } from "react-icons/fa";
+import { useColorMode } from "@docusaurus/theme-common";
+
+interface PRDetails {
+  title: string;
+  url: string;
+  mergedAt: string;
+  repoName: string;
+  number: number;
+}
+
+interface Contributor {
+  username: string;
+  avatar: string;
+  profile: string;
+  points: number;
+  prs: number;
+  prDetails?: PRDetails[];
+}
+
+interface PRListModalProps {
+  contributor: Contributor | null;
+  isOpen: boolean;
+  onClose: () => void;
+}
+
+export default function PRListModal({ contributor, isOpen, onClose }: PRListModalProps): JSX.Element | null {
+  const { colorMode } = useColorMode();
+  const isDark = colorMode === "dark";
+
+  if (!contributor) return null;
+
+  const formatDate = (dateString: string) => {
+    const date = new Date(dateString);
+    return date.toLocaleDateString('en-US', {
+      year: 'numeric',
+      month: 'short',
+      day: 'numeric'
+    });
+  };
+
+  const handleBackdropClick = (e: React.MouseEvent) => {
+    if (e.target === e.currentTarget) {
+      onClose();
+    }
+  };
+
+  const handleKeyDown = (e: React.KeyboardEvent) => {
+    if (e.key === 'Escape') {
+      onClose();
+    }
+  };
+
+  return (
+    <AnimatePresence>
+      {isOpen && (
+        <motion.div
+          className={`pr-modal-backdrop ${isDark ? "dark" : "light"}`}
+          initial={{ opacity: 0 }}
+          animate={{ opacity: 1 }}
+          exit={{ opacity: 0 }}
+          onClick={handleBackdropClick}
+          onKeyDown={handleKeyDown}
+          tabIndex={0}
+          role="dialog"
+          aria-modal="true"
+          aria-labelledby="pr-modal-title"
+        >
+          <motion.div
+            className={`pr-modal-container ${isDark ? "dark" : "light"}`}
+            initial={{ opacity: 0, scale: 0.9, y: 20 }}
+            animate={{ opacity: 1, scale: 1, y: 0 }}
+            exit={{ opacity: 0, scale: 0.9, y: 20 }}
+            transition={{ type: "spring", damping: 25, stiffness: 300 }}
+          >
+            {/* Modal Header */}
+            <div className={`pr-modal-header ${isDark ? "dark" : "light"}`}>
+              <div className="pr-modal-user-info">
+                <img 
+                  src={contributor.avatar} 
+                  alt={contributor.username} 
+                  className="pr-modal-avatar"
+                />
+                <div>
+                  <h2 id="pr-modal-title" className={`pr-modal-title ${isDark ? "dark" : "light"}`}>
+                    {contributor.username}'s Pull Requests
+                  </h2>
+                  <p className={`pr-modal-subtitle ${isDark ? "dark" : "light"}`}>
+                    {contributor.prs} merged PR{contributor.prs !== 1 ? 's' : ''} • {contributor.points} points
+                  </p>
+                </div>
+              </div>
+              <button
+                className={`pr-modal-close ${isDark ? "dark" : "light"}`}
+                onClick={onClose}
+                aria-label="Close modal"
+              >
+                <FaTimes />
+              </button>
+            </div>
+
+            {/* Modal Body */}
+            <div className={`pr-modal-body ${isDark ? "dark" : "light"}`}>
+              {contributor.prDetails && contributor.prDetails.length > 0 ? (
+                <div className="pr-list">
+                  {contributor.prDetails.map((pr, index) => (
+                    <motion.div
+                      key={`${pr.repoName}-${pr.number}`}
+                      className={`pr-item ${isDark ? "dark" : "light"}`}
+                      initial={{ opacity: 0, x: -20 }}
+                      animate={{ opacity: 1, x: 0 }}
+                      transition={{ delay: index * 0.05 }}
+                    >
+                      <div className="pr-item-header">
+                        <h3 className={`pr-item-title ${isDark ? "dark" : "light"}`}>
+                          {pr.title}
+                        </h3>
+                        <div className="pr-item-actions">
+                          <a 
+                            href={pr.url} 
+                            target="_blank" 
+                            rel="noopener noreferrer"
+                            className={`pr-item-link ${isDark ? "dark" : "light"}`}
+                            aria-label={`Open PR #${pr.number} in GitHub`}
+                          >
+                            <FaExternalLinkAlt />
+                          </a>
+                        </div>
+                      </div>
+                      <div className="pr-item-meta">
+                        <span className={`pr-item-repo ${isDark ? "dark" : "light"}`}>
+                          <FaGithub />
+                          {pr.repoName}
+                        </span>
+                        <span className={`pr-item-number ${isDark ? "dark" : "light"}`}>
+                          #{pr.number}
+                        </span>
+                        <span className={`pr-item-date ${isDark ? "dark" : "light"}`}>
+                          Merged on {formatDate(pr.mergedAt)}
+                        </span>
+                      </div>
+                    </motion.div>
+                  ))}
+                </div>
+              ) : (
+                <div className={`pr-empty-state ${isDark ? "dark" : "light"}`}>
+                  <FaGithub className="pr-empty-icon" />
+                  <p>No pull request details available</p>
+                  <p className="pr-empty-subtitle">
+                    PR details might not be loaded yet or this contributor has no merged PRs.
+                  </p>
+                </div>
+              )}
+            </div>
+
+            {/* Modal Footer */}
+            <div className={`pr-modal-footer ${isDark ? "dark" : "light"}`}>
+              <a
+                href={contributor.profile}
+                target="_blank"
+                rel="noopener noreferrer"
+                className={`pr-modal-profile-link ${isDark ? "dark" : "light"}`}
+              >
+                <FaGithub />
+                View GitHub Profile
+              </a>
+            </div>
+          </motion.div>
+        </motion.div>
+      )}
+    </AnimatePresence>
+  );
+}
\ No newline at end of file
diff --git a/src/components/dashboard/LeaderBoard/leaderboard.css b/src/components/dashboard/LeaderBoard/leaderboard.css
index df40d338..f31f1b3e 100644
--- a/src/components/dashboard/LeaderBoard/leaderboard.css
+++ b/src/components/dashboard/LeaderBoard/leaderboard.css
@@ -538,6 +538,25 @@
   font-weight: bold;
 }
 
+.badge.clickable {
+  transition: all 0.2s ease;
+  position: relative;
+}
+
+.badge.clickable:hover {
+  transform: translateY(-1px);
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+}
+
+.badge.clickable:focus {
+  outline: 2px solid #6366f1;
+  outline-offset: 2px;
+}
+
+.badge.clickable:active {
+  transform: translateY(0);
+}
+
 .rank-badge {
   display: flex;
   justify-content: center;
@@ -863,4 +882,424 @@
     height: 32px;
     font-size: 14px;
   }
+}
+
+/* PR List Modal Styles */
+.pr-modal-backdrop {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 1000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 20px;
+  backdrop-filter: blur(4px);
+}
+
+.pr-modal-backdrop.light {
+  background: rgba(0, 0, 0, 0.5);
+}
+
+.pr-modal-backdrop.dark {
+  background: rgba(0, 0, 0, 0.7);
+}
+
+.pr-modal-container {
+  width: 100%;
+  max-width: 700px;
+  max-height: 80vh;
+  border-radius: 16px;
+  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
+
+.pr-modal-container.light {
+  background: white;
+  border: 1px solid #e5e7eb;
+}
+
+.pr-modal-container.dark {
+  background: #1f2937;
+  border: 1px solid #374151;
+}
+
+/* Modal Header */
+.pr-modal-header {
+  padding: 24px 24px 16px;
+  border-bottom: 1px solid;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-shrink: 0;
+}
+
+.pr-modal-header.light {
+  border-color: #e5e7eb;
+  background: #fafafa;
+}
+
+.pr-modal-header.dark {
+  border-color: #374151;
+  background: #111827;
+}
+
+.pr-modal-user-info {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.pr-modal-avatar {
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  border: 2px solid;
+}
+
+.pr-modal-container.light .pr-modal-avatar {
+  border-color: #e5e7eb;
+}
+
+.pr-modal-container.dark .pr-modal-avatar {
+  border-color: #374151;
+}
+
+.pr-modal-title {
+  font-size: 20px;
+  font-weight: 600;
+  margin: 0 0 4px 0;
+}
+
+.pr-modal-title.light {
+  color: #111827;
+}
+
+.pr-modal-title.dark {
+  color: #f9fafb;
+}
+
+.pr-modal-subtitle {
+  font-size: 14px;
+  margin: 0;
+  opacity: 0.7;
+}
+
+.pr-modal-subtitle.light {
+  color: #6b7280;
+}
+
+.pr-modal-subtitle.dark {
+  color: #9ca3af;
+}
+
+.pr-modal-close {
+  width: 40px;
+  height: 40px;
+  border-radius: 8px;
+  border: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  flex-shrink: 0;
+}
+
+.pr-modal-close.light {
+  background: #f3f4f6;
+  color: #6b7280;
+}
+
+.pr-modal-close.light:hover {
+  background: #e5e7eb;
+  color: #374151;
+}
+
+.pr-modal-close.dark {
+  background: #374151;
+  color: #9ca3af;
+}
+
+.pr-modal-close.dark:hover {
+  background: #4b5563;
+  color: #f3f4f6;
+}
+
+/* Modal Body */
+.pr-modal-body {
+  flex: 1;
+  overflow-y: auto;
+  padding: 0 24px;
+}
+
+.pr-list {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  padding: 16px 0;
+}
+
+.pr-item {
+  padding: 16px;
+  border-radius: 8px;
+  border: 1px solid;
+  transition: all 0.2s ease;
+}
+
+.pr-item.light {
+  background: #fafafa;
+  border-color: #e5e7eb;
+}
+
+.pr-item.light:hover {
+  background: #f3f4f6;
+  border-color: #d1d5db;
+}
+
+.pr-item.dark {
+  background: #111827;
+  border-color: #374151;
+}
+
+.pr-item.dark:hover {
+  background: #1f2937;
+  border-color: #4b5563;
+}
+
+.pr-item-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 12px;
+  margin-bottom: 8px;
+}
+
+.pr-item-title {
+  font-size: 16px;
+  font-weight: 500;
+  margin: 0;
+  line-height: 1.4;
+  flex: 1;
+}
+
+.pr-item-title.light {
+  color: #111827;
+}
+
+.pr-item-title.dark {
+  color: #f9fafb;
+}
+
+.pr-item-actions {
+  display: flex;
+  gap: 8px;
+  flex-shrink: 0;
+}
+
+.pr-item-link {
+  width: 32px;
+  height: 32px;
+  border-radius: 6px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-decoration: none;
+  transition: all 0.2s ease;
+  border: 1px solid;
+}
+
+.pr-item-link.light {
+  background: #f9fafb;
+  border-color: #e5e7eb;
+  color: #6b7280;
+}
+
+.pr-item-link.light:hover {
+  background: #f3f4f6;
+  border-color: #d1d5db;
+  color: #374151;
+}
+
+.pr-item-link.dark {
+  background: #374151;
+  border-color: #4b5563;
+  color: #9ca3af;
+}
+
+.pr-item-link.dark:hover {
+  background: #4b5563;
+  border-color: #6b7280;
+  color: #f3f4f6;
+}
+
+.pr-item-meta {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  flex-wrap: wrap;
+  font-size: 13px;
+  opacity: 0.8;
+}
+
+.pr-item-repo {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-weight: 500;
+}
+
+.pr-item-repo.light {
+  color: #6366f1;
+}
+
+.pr-item-repo.dark {
+  color: #818cf8;
+}
+
+.pr-item-number {
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
+  font-weight: 500;
+}
+
+.pr-item-number.light {
+  color: #059669;
+}
+
+.pr-item-number.dark {
+  color: #10b981;
+}
+
+.pr-item-date.light {
+  color: #6b7280;
+}
+
+.pr-item-date.dark {
+  color: #9ca3af;
+}
+
+/* Empty State */
+.pr-empty-state {
+  text-align: center;
+  padding: 48px 24px;
+}
+
+.pr-empty-icon {
+  font-size: 48px;
+  margin-bottom: 16px;
+  opacity: 0.4;
+}
+
+.pr-empty-state p {
+  margin: 0 0 8px 0;
+  font-size: 16px;
+  font-weight: 500;
+}
+
+.pr-empty-state.light p {
+  color: #374151;
+}
+
+.pr-empty-state.dark p {
+  color: #d1d5db;
+}
+
+.pr-empty-subtitle {
+  font-size: 14px !important;
+  font-weight: 400 !important;
+  opacity: 0.7;
+  max-width: 300px;
+  margin: 0 auto !important;
+}
+
+/* Modal Footer */
+.pr-modal-footer {
+  padding: 16px 24px 24px;
+  border-top: 1px solid;
+  flex-shrink: 0;
+}
+
+.pr-modal-footer.light {
+  border-color: #e5e7eb;
+  background: #fafafa;
+}
+
+.pr-modal-footer.dark {
+  border-color: #374151;
+  background: #111827;
+}
+
+.pr-modal-profile-link {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 16px;
+  border-radius: 8px;
+  text-decoration: none;
+  font-size: 14px;
+  font-weight: 500;
+  transition: all 0.2s ease;
+  border: 1px solid;
+}
+
+.pr-modal-profile-link.light {
+  background: #f3f4f6;
+  border-color: #d1d5db;
+  color: #374151;
+}
+
+.pr-modal-profile-link.light:hover {
+  background: #e5e7eb;
+  border-color: #9ca3af;
+  color: #111827;
+}
+
+.pr-modal-profile-link.dark {
+  background: #374151;
+  border-color: #4b5563;
+  color: #d1d5db;
+}
+
+.pr-modal-profile-link.dark:hover {
+  background: #4b5563;
+  border-color: #6b7280;
+  color: #f9fafb;
+}
+
+/* Responsive Design */
+@media (max-width: 768px) {
+  .pr-modal-container {
+    max-height: 90vh;
+    margin: 20px;
+  }
+  
+  .pr-modal-header {
+    padding: 20px 20px 12px;
+  }
+  
+  .pr-modal-body {
+    padding: 0 20px;
+  }
+  
+  .pr-modal-footer {
+    padding: 12px 20px 20px;
+  }
+  
+  .pr-item-header {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 8px;
+  }
+  
+  .pr-item-actions {
+    align-self: flex-end;
+  }
+  
+  .pr-item-meta {
+    gap: 12px;
+  }
 }
\ No newline at end of file
diff --git a/src/components/dashboard/LeaderBoard/leaderboard.tsx b/src/components/dashboard/LeaderBoard/leaderboard.tsx
index 1eff8b7f..a2770b6c 100644
--- a/src/components/dashboard/LeaderBoard/leaderboard.tsx
+++ b/src/components/dashboard/LeaderBoard/leaderboard.tsx
@@ -12,6 +12,8 @@ import {
 import { ChevronRight, ChevronLeft } from "lucide-react";
 import { useColorMode } from "@docusaurus/theme-common";
 import { useCommunityStatsContext } from "@site/src/lib/statsProvider";
+import PRListModal from "./PRListModal";
+import { mockContributors } from "./mockData";
 import "./leaderboard.css";
 
 const GITHUB_ORG = "recodehive"; 
@@ -19,12 +21,21 @@ const GITHUB_ORG = "recodehive";
 // Users to exclude from the leaderboard
 const EXCLUDED_USERS = ["sanjay-kv", "allcontributors", "allcontributors[bot]"];
 
+interface PRDetails {
+  title: string;
+  url: string;
+  mergedAt: string;
+  repoName: string;
+  number: number;
+}
+
 interface Contributor {
   username: string;
   avatar: string;
   profile: string;
   points: number;
   prs: number;
+  prDetails?: PRDetails[];
 }
 
 interface Stats {
@@ -33,15 +44,62 @@ interface Stats {
   flooredTotalPoints: number;
 }
 
-function Badge({ count, label, color }: { count: number; label: string; color: { background: string; color: string } }) {
+function Badge({ 
+  count, 
+  label, 
+  color, 
+  onClick,
+  clickable = false 
+}: { 
+  count: number; 
+  label: string; 
+  color: { background: string; color: string };
+  onClick?: () => void;
+  clickable?: boolean;
+}) {
+  const badgeStyle = {
+    ...color,
+    cursor: clickable ? 'pointer' : 'default',
+    transition: clickable ? 'all 0.2s ease' : 'none',
+  };
+
+  const handleClick = () => {
+    if (clickable && onClick) {
+      onClick();
+    }
+  };
+
+  const handleKeyDown = (e: React.KeyboardEvent) => {
+    if (clickable && (e.key === 'Enter' || e.key === ' ')) {
+      e.preventDefault();
+      if (onClick) onClick();
+    }
+  };
+
   return (
-    <span className="badge" style={{ ...color }}>
+    <span 
+      className={`badge ${clickable ? 'clickable' : ''}`}
+      style={badgeStyle}
+      onClick={handleClick}
+      onKeyDown={handleKeyDown}
+      tabIndex={clickable ? 0 : -1}
+      role={clickable ? 'button' : undefined}
+      aria-label={clickable ? `View ${label.toLowerCase()} details` : undefined}
+    >
       {count} {label}
     </span>
   );
 }
 
-function TopPerformerCard({ contributor, rank }: { contributor: Contributor; rank: number }) {
+function TopPerformerCard({ 
+  contributor, 
+  rank, 
+  onPRClick 
+}: { 
+  contributor: Contributor; 
+  rank: number;
+  onPRClick: (contributor: Contributor) => void;
+}) {
   const { colorMode } = useColorMode();
   const isDark = colorMode === "dark";
   const rankClass = rank === 1 ? "top-1" : rank === 2 ? "top-2" : "top-3";
@@ -57,7 +115,13 @@ function TopPerformerCard({ contributor, rank }: { contributor: Contributor; ran
           {contributor.username}
         </a>
         <div className="badges-container">
-          <Badge count={contributor.prs} label="PRs" color={{ background: "#dbeafe", color: "#2563eb" }} />
+          <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>
@@ -75,9 +139,33 @@ export default function LeaderBoard(): JSX.Element {
 
   const [searchQuery, setSearchQuery] = useState("");
   const [currentPage, setCurrentPage] = useState(1);
+  const [selectedContributor, setSelectedContributor] = useState<Contributor | null>(null);
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const itemsPerPage = 10;
+
+  // Modal handlers
+  const handlePRClick = (contributor: Contributor) => {
+    setSelectedContributor(contributor);
+    setIsModalOpen(true);
+  };
+
+  const handleCloseModal = () => {
+    setIsModalOpen(false);
+    setSelectedContributor(null);
+  };
+
+  // Use mock data only in development mode when there's an error or no contributors
+  const displayContributors =
+    (error || contributors.length === 0)
+      ? (typeof process !== "undefined" && process.env.NODE_ENV === "development"
+          ? mockContributors
+          : [])
+      : contributors;
+
+  
   const [timePeriod, setTimePeriod] = useState<TimePeriod>("all");
   const [isSelectChanged, setIsSelectChanged] = useState(false);
-  const itemsPerPage = 10;
+ 
 
   // Get contributions within the selected time period
   const getContributionsWithinTimePeriod = (contributors: Contributor[]) => {
@@ -272,7 +360,7 @@ export default function LeaderBoard(): JSX.Element {
         </motion.div>
 
         {/* Top 3 Performers Section */}
-        {!loading && !error && filteredContributors.length > 2 && (
+        {!loading && filteredContributors.length > 2 && (
           <div className="top-performers-container">
             <div className="title-filter-container">
               <h2 className={`top-performers-title ${isDark ? "dark" : "light"}`}>RecodeHive Top Performers</h2>
@@ -297,15 +385,10 @@ export default function LeaderBoard(): JSX.Element {
               </div>
             </div>
             <div className="top-performers-grid">
-              {filteredContributors.length >= 2 && (
-                <TopPerformerCard contributor={filteredContributors[1]} rank={2} />
-              )}
-              {filteredContributors.length >= 1 && (
-                <TopPerformerCard contributor={filteredContributors[0]} rank={1} />
-              )}
-              {filteredContributors.length >= 3 && (
-                <TopPerformerCard contributor={filteredContributors[2]} rank={3} />
-              )}
+
+              <TopPerformerCard contributor={filteredContributors[1]} rank={2} onPRClick={handlePRClick} />
+              <TopPerformerCard contributor={filteredContributors[0]} rank={1} onPRClick={handlePRClick} />
+              <TopPerformerCard contributor={filteredContributors[2]} rank={3} onPRClick={handlePRClick} />
             </div>
           </div>
         )}
@@ -389,20 +472,33 @@ export default function LeaderBoard(): JSX.Element {
           </div>
         )}
 
-        {error && (
+        {error && displayContributors.length === 0 && (
           <div className="no-contributors">
             <p>Error: {error}</p>
           </div>
         )}
 
-        {!loading && !error && filteredContributors.length === 0 && (
+        {!loading && filteredContributors.length === 0 && (
           <div className="no-contributors">
             <p>No contributors found.</p>
           </div>
         )}
 
-        {!loading && !error && filteredContributors.length > 0 && (
+        {!loading && filteredContributors.length > 0 && (
           <div className={`contributors-container ${isDark ? "dark" : "light"}`}>
+            {error && (
+              <div className="error-banner" style={{ 
+                padding: '12px', 
+                backgroundColor: isDark ? '#fee8e7' : '#fee8e7', 
+                color: '#dc2626', 
+                borderRadius: '8px', 
+                marginBottom: '16px',
+                fontSize: '14px',
+                textAlign: 'center'
+              }}>
+                Demo Mode: Showing sample data due to API configuration issue
+              </div>
+            )}
             <div className="contributors-header">
                 <div className="contributor-cell rank">Rank</div>
                 <div className="contributor-cell avatar-cell">Avatar</div>
@@ -436,7 +532,13 @@ export default function LeaderBoard(): JSX.Element {
                     </a>
                 </div>
                 <div className="contributor-cell prs-cell">
-                  <Badge count={contributor.prs} label="PRs" color={{ background: "#dbeafe", color: "#2563eb" }} />
+                  <Badge 
+                    count={contributor.prs} 
+                    label="PRs" 
+                    color={{ background: "#dbeafe", color: "#2563eb" }}
+                    onClick={() => handlePRClick(contributor)}
+                    clickable={true}
+                  />
                 </div>
                 <div className="contributor-cell points-cell">
                   <Badge count={contributor.points} label="Points" color={{ background: "#ede9fe", color: "#7c3aed" }} />
@@ -485,6 +587,13 @@ export default function LeaderBoard(): JSX.Element {
           </div>
         )}
       </div>
+
+      {/* PR List Modal */}
+      <PRListModal
+        contributor={selectedContributor}
+        isOpen={isModalOpen}
+        onClose={handleCloseModal}
+      />
     </div>
   );
 }
\ No newline at end of file
diff --git a/src/components/dashboard/LeaderBoard/mockData.ts b/src/components/dashboard/LeaderBoard/mockData.ts
new file mode 100644
index 00000000..19193cae
--- /dev/null
+++ b/src/components/dashboard/LeaderBoard/mockData.ts
@@ -0,0 +1,100 @@
+// Temporary mock data for testing the PR list modal functionality
+export const mockContributors = [
+  {
+    username: "testuser1",
+    avatar: "https://github.com/testuser1.png",
+    profile: "https://github.com/testuser1",
+    points: 50,
+    prs: 5,
+    prDetails: [
+      {
+        title: "Add new feature: user authentication system",
+        url: "https://github.com/recodehive/repo1/pull/123",
+        mergedAt: "2024-01-15T10:30:00Z",
+        repoName: "auth-service",
+        number: 123
+      },
+      {
+        title: "Fix: resolve security vulnerability in login flow",
+        url: "https://github.com/recodehive/repo1/pull/124",
+        mergedAt: "2024-01-14T14:22:00Z",
+        repoName: "auth-service",
+        number: 124
+      },
+      {
+        title: "Update documentation for API endpoints",
+        url: "https://github.com/recodehive/repo2/pull/45",
+        mergedAt: "2024-01-13T09:15:00Z",
+        repoName: "api-docs",
+        number: 45
+      },
+      {
+        title: "Implement dark mode toggle component",
+        url: "https://github.com/recodehive/repo3/pull/67",
+        mergedAt: "2024-01-12T16:45:00Z",
+        repoName: "ui-components",
+        number: 67
+      },
+      {
+        title: "Optimize database queries for better performance",
+        url: "https://github.com/recodehive/repo1/pull/125",
+        mergedAt: "2024-01-11T11:30:00Z",
+        repoName: "backend-core",
+        number: 125
+      }
+    ]
+  },
+  {
+    username: "testuser2",
+    avatar: "https://github.com/testuser2.png",
+    profile: "https://github.com/testuser2",
+    points: 30,
+    prs: 3,
+    prDetails: [
+      {
+        title: "Add responsive design to landing page",
+        url: "https://github.com/recodehive/repo4/pull/89",
+        mergedAt: "2024-01-10T13:20:00Z",
+        repoName: "frontend-website",
+        number: 89
+      },
+      {
+        title: "Fix mobile navigation menu issue",
+        url: "https://github.com/recodehive/repo4/pull/90",
+        mergedAt: "2024-01-09T08:45:00Z",
+        repoName: "frontend-website",
+        number: 90
+      },
+      {
+        title: "Add unit tests for utility functions",
+        url: "https://github.com/recodehive/repo5/pull/12",
+        mergedAt: "2024-01-08T15:30:00Z",
+        repoName: "utils-library",
+        number: 12
+      }
+    ]
+  },
+  {
+    username: "testuser3",
+    avatar: "https://github.com/testuser3.png",
+    profile: "https://github.com/testuser3",
+    points: 20,
+    prs: 2,
+    prDetails: [
+      {
+        title: "Update README with installation instructions",
+        url: "https://github.com/recodehive/repo6/pull/23",
+        mergedAt: "2024-01-07T12:15:00Z",
+        repoName: "documentation",
+        number: 23
+      },
+      {
+        title: "Add error handling for API failures",
+        url: "https://github.com/recodehive/repo7/pull/34",
+        mergedAt: "2024-01-06T10:00:00Z",
+        repoName: "error-handling",
+        number: 34
+      }
+    ]
+  }
+];
\ No newline at end of file
diff --git a/src/lib/statsProvider.tsx b/src/lib/statsProvider.tsx
index 09d6bf60..7455e9aa 100644
--- a/src/lib/statsProvider.tsx
+++ b/src/lib/statsProvider.tsx
@@ -34,12 +34,21 @@ interface ICommunityStatsContext {
 }
 
 // Define types for leaderboard data
+interface PRDetails {
+  title: string;
+  url: string;
+  mergedAt: string;
+  repoName: string;
+  number: number;
+}
+
 interface Contributor {
   username: string;
   avatar: string;
   profile: string;
   points: number;
   prs: number;
+  prDetails?: PRDetails[];
 }
 
 interface Stats {
@@ -55,6 +64,9 @@ interface PullRequestItem {
     html_url: string;
   };
   merged_at?: string | null;
+  title?: string;
+  html_url?: string;
+  number?: number;
 }
 
 export const CommunityStatsContext = createContext<ICommunityStatsContext | undefined>(undefined);
@@ -196,7 +208,7 @@ export function CommunityStatsProvider({ children }: CommunityStatsProviderProps
       const results = await Promise.all(promises);
       
       // Process results from this batch
-      results.forEach(({ mergedPRs }) => {
+      results.forEach(({ mergedPRs, repoName }) => {
         totalMergedPRs += mergedPRs.length;
         
         mergedPRs.forEach((pr) => {
@@ -208,11 +220,24 @@ export function CommunityStatsProvider({ children }: CommunityStatsProviderProps
               profile: pr.user.html_url,
               points: 0,
               prs: 0,
+              prDetails: [],
             });
           }
           const contributor = contributorMap.get(username)!;
           contributor.prs++;
           contributor.points += POINTS_PER_PR;
+          
+          // Add detailed PR information
+          if (pr.title && pr.html_url && pr.merged_at && pr.number) {
+            contributor.prDetails = contributor.prDetails || [];
+            contributor.prDetails.push({
+              title: pr.title,
+              url: pr.html_url,
+              mergedAt: pr.merged_at,
+              repoName,
+              number: pr.number,
+            });
+          }
         });
       });
     }