From dc372ea659e58f8720d754d65bdb885fab489eab Mon Sep 17 00:00:00 2001
From: Chetna Singh <chetnasinghcs05@gmail.com>
Date: Fri, 1 Aug 2025 17:09:51 +0530
Subject: [PATCH 1/3] =?UTF-8?q?=E2=9C=A8=20Feat:=20Add=20GitHub=20metrics?=
 =?UTF-8?q?=20preview=20on=20user=20profile=20page=20(Fixes=20#50)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/MetricCard.tsx         | 30 +++++++++++++
 src/pages/UserProfile/UserProfile.tsx | 63 +++++++++++++++++++++++++++
 2 files changed, 93 insertions(+)
 create mode 100644 src/components/MetricCard.tsx
 create mode 100644 src/pages/UserProfile/UserProfile.tsx

diff --git a/src/components/MetricCard.tsx b/src/components/MetricCard.tsx
new file mode 100644
index 0000000..35f1ad3
--- /dev/null
+++ b/src/components/MetricCard.tsx
@@ -0,0 +1,30 @@
+import React, { useState } from "react";
+
+interface MetricCardProps {
+  username: string;
+}
+
+const MetricCard: React.FC<MetricCardProps> = ({ username }) => {
+  const [loading, setLoading] = useState(true);
+
+  if (!username) return null;
+
+  const metricsURL = `https://metrics.lecoq.io/${username}`;
+
+  return (
+    <div className="w-full flex flex-col items-center p-4">
+      {loading && <p className="text-gray-500 mb-2">Loading metrics...</p>}
+      <iframe
+        src={metricsURL}
+        width="100%"
+        height="400"
+        frameBorder="0"
+        title="GitHub Metrics"
+        className="rounded-lg shadow-md"
+        onLoad={() => setLoading(false)}
+      ></iframe>
+    </div>
+  );
+};
+
+export default MetricCard;
diff --git a/src/pages/UserProfile/UserProfile.tsx b/src/pages/UserProfile/UserProfile.tsx
new file mode 100644
index 0000000..03d764e
--- /dev/null
+++ b/src/pages/UserProfile/UserProfile.tsx
@@ -0,0 +1,63 @@
+import { useParams } from "react-router-dom";
+import { useEffect, useState } from "react";
+import MetricCard from "../../components/MetricCard";
+
+type PR = {
+  title: string;
+  html_url: string;
+  repository_url: string;
+};
+
+export default function UserProfile() {
+  const { username } = useParams();
+  const [profile, setProfile] = useState<any>(null);
+  const [prs, setPRs] = useState<PR[]>([]);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    async function fetchData() {
+      if (!username) return;
+
+      const userRes = await fetch(`https://api.github.com/users/${username}`);
+      const userData = await userRes.json();
+      setProfile(userData);
+
+      const prsRes = await fetch(`https://api.github.com/search/issues?q=author:${username}+type:pr`);
+      const prsData = await prsRes.json();
+      setPRs(prsData.items);
+      setLoading(false);
+    }
+
+    fetchData();
+  }, [username]);
+
+  if (loading) return <div className="text-center mt-10">Loading...</div>;
+
+  return (
+    <div className="max-w-3xl mx-auto mt-10 p-4 bg-white shadow-xl rounded-xl">
+      {profile && (
+        <div className="text-center">
+          <img src={profile.avatar_url} className="w-24 h-24 mx-auto rounded-full" />
+          <h2 className="text-2xl font-bold mt-2">{profile.login}</h2>
+          <p className="text-gray-600">{profile.bio}</p>
+        </div>
+      )}
+
+      {/* GitHub Metrics Preview */}
+      <h3 className="text-xl font-semibold mt-6 mb-2">GitHub Metrics</h3>
+      <MetricCard username={username || ""} />
+
+
+      <h3 className="text-xl font-semibold mt-6 mb-2">Pull Requests</h3>
+      <ul className="list-disc ml-6 space-y-2">
+        {prs.map((pr, i) => (
+          <li key={i}>
+            <a href={pr.html_url} target="_blank" className="text-blue-600 hover:underline">
+              {pr.title}
+            </a>
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+}

From 7a0e33bd8b6681c19849ec970e3de669d395b41e Mon Sep 17 00:00:00 2001
From: Mehul <mehulprajapati2802@gmail.com>
Date: Fri, 1 Aug 2025 17:49:38 +0530
Subject: [PATCH 2/3] add card in correct place

---
 src/pages/ContributorProfile/ContributorProfile.tsx | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/pages/ContributorProfile/ContributorProfile.tsx b/src/pages/ContributorProfile/ContributorProfile.tsx
index b4ab931..39a71ac 100644
--- a/src/pages/ContributorProfile/ContributorProfile.tsx
+++ b/src/pages/ContributorProfile/ContributorProfile.tsx
@@ -1,6 +1,7 @@
 import { useParams } from "react-router-dom";
 import { useEffect, useState } from "react";
 import toast from "react-hot-toast";
+import MetricCard from "../../components/MetricCard";
 
 type PR = {
   title: string;
@@ -68,6 +69,10 @@ export default function ContributorProfile() {
         </button>
       </div>
 
+      {/* GitHub Metrics Preview */}
+      <h3 className="text-xl font-semibold mt-6 mb-2">GitHub Metrics</h3>
+      <MetricCard username={username || ""} />
+
       <h3 className="text-xl font-semibold mt-6 mb-2">Pull Requests</h3>
       {prs.length > 0 ? (
         <ul className="list-disc ml-6 space-y-2">

From dba30f81ae07abb22280f78e1fd0c41f2c7c6bf1 Mon Sep 17 00:00:00 2001
From: Mehul <mehulprajapati2802@gmail.com>
Date: Fri, 1 Aug 2025 17:53:02 +0530
Subject: [PATCH 3/3] sync with master

---
 src/pages/UserProfile/UserProfile.tsx | 63 ---------------------------
 1 file changed, 63 deletions(-)
 delete mode 100644 src/pages/UserProfile/UserProfile.tsx

diff --git a/src/pages/UserProfile/UserProfile.tsx b/src/pages/UserProfile/UserProfile.tsx
deleted file mode 100644
index 03d764e..0000000
--- a/src/pages/UserProfile/UserProfile.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-import { useParams } from "react-router-dom";
-import { useEffect, useState } from "react";
-import MetricCard from "../../components/MetricCard";
-
-type PR = {
-  title: string;
-  html_url: string;
-  repository_url: string;
-};
-
-export default function UserProfile() {
-  const { username } = useParams();
-  const [profile, setProfile] = useState<any>(null);
-  const [prs, setPRs] = useState<PR[]>([]);
-  const [loading, setLoading] = useState(true);
-
-  useEffect(() => {
-    async function fetchData() {
-      if (!username) return;
-
-      const userRes = await fetch(`https://api.github.com/users/${username}`);
-      const userData = await userRes.json();
-      setProfile(userData);
-
-      const prsRes = await fetch(`https://api.github.com/search/issues?q=author:${username}+type:pr`);
-      const prsData = await prsRes.json();
-      setPRs(prsData.items);
-      setLoading(false);
-    }
-
-    fetchData();
-  }, [username]);
-
-  if (loading) return <div className="text-center mt-10">Loading...</div>;
-
-  return (
-    <div className="max-w-3xl mx-auto mt-10 p-4 bg-white shadow-xl rounded-xl">
-      {profile && (
-        <div className="text-center">
-          <img src={profile.avatar_url} className="w-24 h-24 mx-auto rounded-full" />
-          <h2 className="text-2xl font-bold mt-2">{profile.login}</h2>
-          <p className="text-gray-600">{profile.bio}</p>
-        </div>
-      )}
-
-      {/* GitHub Metrics Preview */}
-      <h3 className="text-xl font-semibold mt-6 mb-2">GitHub Metrics</h3>
-      <MetricCard username={username || ""} />
-
-
-      <h3 className="text-xl font-semibold mt-6 mb-2">Pull Requests</h3>
-      <ul className="list-disc ml-6 space-y-2">
-        {prs.map((pr, i) => (
-          <li key={i}>
-            <a href={pr.html_url} target="_blank" className="text-blue-600 hover:underline">
-              {pr.title}
-            </a>
-          </li>
-        ))}
-      </ul>
-    </div>
-  );
-}