From de8c4d6a827a032a8b4bdb27afa518c8f0906fb0 Mon Sep 17 00:00:00 2001
From: Bhumika <sharmabhmi@gmail.com>
Date: Fri, 25 Oct 2024 19:35:26 +0530
Subject: [PATCH] Fixed UI and functionality

---
 src/css/Contributor.css                     |  18 ++-
 src/pages/contributor/ContributorDetail.jsx | 131 ++++++++++----------
 2 files changed, 76 insertions(+), 73 deletions(-)

diff --git a/src/css/Contributor.css b/src/css/Contributor.css
index 40181b6..1b0865e 100644
--- a/src/css/Contributor.css
+++ b/src/css/Contributor.css
@@ -6,7 +6,7 @@
     background: rgba(255, 255, 255, 0.15);
     backdrop-filter: blur(10px);
     border: 1px solid rgba(255, 255, 255, 0.2);
-    box-shadow: 0 8px 32px 0 rgba(52, 91, 57, 0.328)   ;
+    box-shadow: 0 8px 32px 0 rgba(52, 91, 57, 0.328);
     transition: all 0.3s ease;
   }
   .dark .card{
@@ -15,6 +15,7 @@
     color: white ;
     
   }
+  
   .card:hover {
     transform: translateY(-5px);
     box-shadow: 0 15px 30px rgba(92, 92, 92, 0.674);
@@ -29,21 +30,24 @@
   
   .card-body {
     padding: 1.5rem;
+    background-color: #FEFAE0;
   }
   
   .card-title {
     font-size: 1.25rem;
     font-weight: bold;
-    color: #fff;
-    margin-bottom: 0.75rem;
+    color: #31511E !important;
+    margin-bottom: 1rem !important;
   }
   
-  .btn-primary {
+  .btn-primary{
     display: inline-block;
     padding: 0.5rem 1rem;
-    background-color: #007bff; 
+    background-color: #72BF78 !important; 
+    font-size: smaller !important;
     color: #fff;
     text-decoration: none;
+    border:2px solid #72BF78 !important;
     border-radius: 6px;
     transition: background-color 0.3s ease, color 0.3s ease;
   }
@@ -51,4 +55,6 @@
   .btn-primary:hover {
     background-color: #0056b3; 
     color: #fff; 
-  }
\ No newline at end of file
+  }
+
+ 
\ No newline at end of file
diff --git a/src/pages/contributor/ContributorDetail.jsx b/src/pages/contributor/ContributorDetail.jsx
index a9f1b6b..80ee797 100644
--- a/src/pages/contributor/ContributorDetail.jsx
+++ b/src/pages/contributor/ContributorDetail.jsx
@@ -1,96 +1,93 @@
 import React, { useState, useEffect } from 'react';
 import axios from 'axios';
 
-function ContributorDetail(props) {
-
+function ContributorDetail() {
   const contributorName = localStorage.getItem('contributorName');
-
   const [mergedPRs, setMergedPRs] = useState([]);
   const [error, setError] = useState(null);
 
-  const owner = 'Avdhesh-Varshney'; // Replace with actual owner username/organization
-  const repo = 'chanakya-niti'; // Replace with actual repo name
-  const contributor_username = contributorName; // Replace with contributor username
+  const owner = 'Avdhesh-Varshney'; // Replace with your GitHub owner/org
+  const repo = 'chanakya-niti'; // Replace with your repository name
+
+  // Function to recursively fetch all PRs using pagination
+  const fetchAllPRs = async (page = 1, allPRs = []) => {
+    try {
+      const url = `https://api.github.com/repos/${owner}/${repo}/pulls?state=closed&per_page=100&page=${page}`;
+      const response = await axios.get(url);
 
+      console.log(`Fetched PRs from page ${page}:`, response.data);
+
+      // If no more PRs are returned, stop fetching
+      if (response.data.length === 0) return allPRs;
+
+      // Recursively fetch the next page of PRs
+      return await fetchAllPRs(page + 1, [...allPRs, ...response.data]);
+    } catch (error) {
+      setError(error);
+      console.error('Error fetching PRs:', error);
+      return allPRs; // Return what has been fetched so far
+    }
+  };
+
+  // Fetch and filter the merged PRs
   const fetchMergedPRs = async () => {
     try {
-      const baseUrl = 'https://api.github.com';
-      const url = `${baseUrl}/repos/${owner}/${repo}/pulls?state=closed&author=${contributor_username}`;
+      const allPRs = await fetchAllPRs();
+      console.log('All fetched PRs:', allPRs);
 
-      const response = await axios.get(url);
-      let data = response.data;
-      const arr = await data.filter((pr) => {
-        return pr.user.login === `${contributorName}` && pr.merged_at != null;
+      // Filter PRs authored by the contributor and merged
+      const filteredPRs = allPRs.filter(
+        (pr) =>
+          pr.user?.login.toLowerCase() === contributorName.toLowerCase() &&
+          pr.merged_at !== null
+      );
 
-      })
-      setMergedPRs(arr);
-      // console.log(arr);
+      console.log('Filtered PRs:', filteredPRs);
+      setMergedPRs(filteredPRs);
     } catch (error) {
       setError(error);
-      console.error('Error fetching merged PRs:', error);
+      console.error('Error filtering PRs:', error);
     }
   };
+
   useEffect(() => {
     fetchMergedPRs();
-  }, [])
+  }, []);
 
   return (
     <>
-      {mergedPRs.length > 0 &&
-        <div className='d-flex flex-wrap justify-content-center'>
-          <div className="common">
-            <div className="card mx-1 my-2" style={{ width: "18rem" }}>
-              <img src={mergedPRs[0].user.avatar_url} className="card-img-top" alt="..." />
-              <div className="card-body ">
-                <h5 className="card-title">{contributorName}</h5>
-                <div className="card-header">
-                  No of contributions : {localStorage.getItem('contributions')}
-                </div>
-                <div className="card-header">
-                  <p><a href={mergedPRs[0].user.html_url} target='_blank' className="link-info link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">Github &#8599;</a></p>
-                </div>
+      <h2 className="text-center my-4">Merged PRs by {contributorName}</h2>
+
+      {error && <div className="alert alert-danger">Error: {error.message}</div>}
 
+      {mergedPRs.length > 0 ? (
+        <div className="d-flex flex-wrap justify-content-center">
+          {mergedPRs.map((pr) => (
+            <div key={pr.number} className="card my-3 mx-2" style={{ width: '350px' }}>
+              <div className="card-header fw-bold">PR #{pr.number}</div>
+              <div className="card-body">
+                <h5 className="card-title">{pr.title}</h5>
+               
+                <a
+                  href={pr.html_url}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="btn btn-primary my-2"
+                >
+                  View on GitHub
+                </a>
+               
               </div>
             </div>
-          </div>
-            {
-              mergedPRs.map((element) => {
-                return <div key={element.number} className="card my-3 mx-2" style={{width:"350px"}}>
-                  <div className="card-header fw-bold">
-                    #{element.number}
-                  </div>
-                  <div className="card-body">
-                    <h5 className="card-title">Title: {element.title}</h5>
-                    <div className="card-text">
-                      <p className='fw-bold'> Labels:</p> 
-                      {
-                        element.labels.length > 0 &&
-                        element.labels.map((label) => {
-                          return<div key={label.description} className="ms-2 me-auto">
-                            <div className="fw-bold">*{label.name}</div>
-                            -{label.description}
-                          </div>
-                        })
-                      }
-                    </div>
-                    <a href={element.html_url} target='_blank' className="btn btn-primary my-2">View PR</a>
-                    <p className='fw-bold'>Created at: {element.created_at.substring(0,10).split("-").reverse().join("-")}</p>
-                    <p className='fw-bold'>Closed at: {element.closed_at.substring(0,10).split("-").reverse().join("-")}</p>
-                  </div>
-                </div>
-
-              })
-            }
+          ))}
         </div>
-      }
-      {
-        mergedPRs.length < 1 && <div>
-          Sorry not merged prs available
+      ) : (
+        <div className="text-center my-4">
+          No merged PRs available for {contributorName}.
         </div>
-      }
-
+      )}
     </>
-  )
+  );
 }
 
-export default ContributorDetail
\ No newline at end of file
+export default ContributorDetail;