From 6c47f8c7d544cf57cd12e4d7ee21c2b12af92af1 Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Wed, 21 Aug 2024 00:59:04 -0400
Subject: [PATCH 1/7] feat: Add github profile stats

---
 src/Components/About/About.tsx         | 53 +++++++++++++++++++++-----
 src/Components/About/getGitHubStats.ts |  7 ++++
 2 files changed, 51 insertions(+), 9 deletions(-)
 create mode 100644 src/Components/About/getGitHubStats.ts

diff --git a/src/Components/About/About.tsx b/src/Components/About/About.tsx
index a31f5fd..7b563b8 100644
--- a/src/Components/About/About.tsx
+++ b/src/Components/About/About.tsx
@@ -1,7 +1,32 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
+import { getGitHubProfileStats } from './getGitHubStats';
 import './About.scss';
 
+interface GitHubStats {
+  username: string;
+  public_repos: number;
+  followers: number;
+  following: number;
+}
+
 const About: React.FC = () => {
+  const [stats, setStats] = useState<GitHubStats | null>(null);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    const fetchGitHubStats = async () => {
+      try {
+        const fetchedStats = await getGitHubProfileStats();
+        setStats(fetchedStats);
+      } catch (error) {
+        console.error('Error fetching GitHub stats:', error);
+        setError('Failed to fetch GitHub stats.');
+      }
+    };
+
+    fetchGitHubStats();
+  }, []);
+
   return (
     <div className="AboutContainer">
       <div className="AboutContentContainer">
@@ -72,16 +97,26 @@ const About: React.FC = () => {
           </p>
         </div>
 
-          <div className="AboutImageContainer">
-            <img
-              className="AboutImage"
-              src={`${process.env.PUBLIC_URL}/carson.webp`}
-              alt="PlaceHolder"
-            />
-          </div>
+        <div className="AboutImageContainer">
+          <img
+            className="AboutImage"
+            src={`${process.env.PUBLIC_URL}/carson.webp`}
+            alt="Carson"
+          />
         </div>
+
+        {error ? (
+          <p className="errorText">{error}</p>
+        ) : stats ? (
+          <p>
+            Public Repos: {stats.public_repos} | Followers: {stats.followers} | Following: {stats.following}
+          </p>
+        ) : (
+          <p>Loading GitHub stats...</p>
+        )}
+      </div>
     </div>
   );
 };
 
-export default About;
+export default About;
\ No newline at end of file
diff --git a/src/Components/About/getGitHubStats.ts b/src/Components/About/getGitHubStats.ts
new file mode 100644
index 0000000..88dcbc2
--- /dev/null
+++ b/src/Components/About/getGitHubStats.ts
@@ -0,0 +1,7 @@
+// https://api.github.com/users/carsonSgit
+
+export const getGitHubProfileStats = async () => {
+    const response = await fetch('https://api.github.com/users/carsonSgit');
+    const data = await response.json();
+    return data;
+}

From a17657125881ddfc85cf161defc296bd1eac50ce Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Wed, 21 Aug 2024 01:05:16 -0400
Subject: [PATCH 2/7] chore: Separate into interface

---
 src/Components/About/About.tsx           | 10 ++--------
 src/Components/About/getGitHubStats.ts   |  7 +++++++
 src/Components/Interfaces/githubStats.ts |  6 ++++++
 3 files changed, 15 insertions(+), 8 deletions(-)
 create mode 100644 src/Components/Interfaces/githubStats.ts

diff --git a/src/Components/About/About.tsx b/src/Components/About/About.tsx
index 7b563b8..efa1a8b 100644
--- a/src/Components/About/About.tsx
+++ b/src/Components/About/About.tsx
@@ -1,14 +1,8 @@
 import React, { useEffect, useState } from 'react';
 import { getGitHubProfileStats } from './getGitHubStats';
+import { GitHubStats } from '../Interfaces/githubStats';
 import './About.scss';
 
-interface GitHubStats {
-  username: string;
-  public_repos: number;
-  followers: number;
-  following: number;
-}
-
 const About: React.FC = () => {
   const [stats, setStats] = useState<GitHubStats | null>(null);
   const [error, setError] = useState<string | null>(null);
@@ -109,7 +103,7 @@ const About: React.FC = () => {
           <p className="errorText">{error}</p>
         ) : stats ? (
           <p>
-            Public Repos: {stats.public_repos} | Followers: {stats.followers} | Following: {stats.following}
+            Username: {stats.login}, Public Repos: {stats.public_repos} | Followers: {stats.followers} | Following: {stats.following}
           </p>
         ) : (
           <p>Loading GitHub stats...</p>
diff --git a/src/Components/About/getGitHubStats.ts b/src/Components/About/getGitHubStats.ts
index 88dcbc2..d301aa8 100644
--- a/src/Components/About/getGitHubStats.ts
+++ b/src/Components/About/getGitHubStats.ts
@@ -5,3 +5,10 @@ export const getGitHubProfileStats = async () => {
     const data = await response.json();
     return data;
 }
+
+export const getGitHubProfileLanguages = async () => {
+    const response = await fetch('https://api.github.com/users/carsonSgit/repos');
+    const data = await response.json();
+    return data;
+
+}
diff --git a/src/Components/Interfaces/githubStats.ts b/src/Components/Interfaces/githubStats.ts
new file mode 100644
index 0000000..6cc1101
--- /dev/null
+++ b/src/Components/Interfaces/githubStats.ts
@@ -0,0 +1,6 @@
+export interface GitHubStats {
+    login: string;
+    public_repos: number;
+    followers: number;
+    following: number;
+  }
\ No newline at end of file

From 85c15188a4b936d50c64d6001d7b9336fdaac43e Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Wed, 21 Aug 2024 01:07:22 -0400
Subject: [PATCH 3/7] feat: Script to hit all public repos of mine and return
 the languages

---
 src/Components/About/getGitHubStats.ts | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/Components/About/getGitHubStats.ts b/src/Components/About/getGitHubStats.ts
index d301aa8..520a30b 100644
--- a/src/Components/About/getGitHubStats.ts
+++ b/src/Components/About/getGitHubStats.ts
@@ -7,8 +7,16 @@ export const getGitHubProfileStats = async () => {
 }
 
 export const getGitHubProfileLanguages = async () => {
-    const response = await fetch('https://api.github.com/users/carsonSgit/repos');
-    const data = await response.json();
-    return data;
+    const reposResponse = await fetch('https://api.github.com/users/carsonSgit/repos');
+    const repos = await reposResponse.json();
+
+    const languagesPromises = repos.map(async (repo: { name: string }) => {
+        const languagesResponse = await fetch(`https://api.github.com/repos/carsonSgit/${repo.name}/languages`);
+        const languages = await languagesResponse.json();
+        return { repo: repo.name, languages };
+    });
 
+    const languagesData = await Promise.all(languagesPromises);
+    
+    return languagesData;
 }

From b590a466af6d934ce45e7f42d4e7914dc5bcd2ca Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Wed, 21 Aug 2024 01:26:15 -0400
Subject: [PATCH 4/7] feat: Get public repo stats

---
 src/Components/About/About.tsx           | 29 ++++++++++++++++++++++-
 src/Components/About/getGitHubStats.ts   | 30 ++++++++++++++++--------
 src/Components/Interfaces/githubStats.ts | 11 ++++++++-
 3 files changed, 58 insertions(+), 12 deletions(-)

diff --git a/src/Components/About/About.tsx b/src/Components/About/About.tsx
index efa1a8b..522fda8 100644
--- a/src/Components/About/About.tsx
+++ b/src/Components/About/About.tsx
@@ -1,10 +1,11 @@
 import React, { useEffect, useState } from 'react';
-import { getGitHubProfileStats } from './getGitHubStats';
+import { getGitHubProfileStats, getGitHubProfileLanguages } from './getGitHubStats';
 import { GitHubStats } from '../Interfaces/githubStats';
 import './About.scss';
 
 const About: React.FC = () => {
   const [stats, setStats] = useState<GitHubStats | null>(null);
+  const [topLanguages, setTopLanguages] = useState<{ language: string; bytes: number }[]>([]);
   const [error, setError] = useState<string | null>(null);
 
   useEffect(() => {
@@ -18,7 +19,18 @@ const About: React.FC = () => {
       }
     };
 
+    const fetchGitHubLanguages = async () => {
+      try {
+        const fetchedLanguages = await getGitHubProfileLanguages();
+        setTopLanguages(fetchedLanguages);
+      } catch (error) {
+        console.error('Error fetching GitHub languages:', error);
+        setError('Failed to fetch GitHub languages.');
+      }
+    };
+
     fetchGitHubStats();
+    fetchGitHubLanguages();
   }, []);
 
   return (
@@ -108,6 +120,21 @@ const About: React.FC = () => {
         ) : (
           <p>Loading GitHub stats...</p>
         )}
+
+        <div className="LanguagesContainer">
+          <h3>Top 4 Languages Used:</h3>
+          {topLanguages.length > 0 ? (
+            <ul>
+              {topLanguages.map(({ language, bytes }) => (
+                <li key={language}>
+                  {language}: {bytes} bytes
+                </li>
+              ))}
+            </ul>
+          ) : (
+            <p>Loading languages...</p>
+          )}
+        </div>
       </div>
     </div>
   );
diff --git a/src/Components/About/getGitHubStats.ts b/src/Components/About/getGitHubStats.ts
index 520a30b..1951f93 100644
--- a/src/Components/About/getGitHubStats.ts
+++ b/src/Components/About/getGitHubStats.ts
@@ -1,22 +1,32 @@
 // https://api.github.com/users/carsonSgit
 
+import { TopLanguage, LanguageData } from '../Interfaces/githubStats';
+
 export const getGitHubProfileStats = async () => {
     const response = await fetch('https://api.github.com/users/carsonSgit');
     const data = await response.json();
     return data;
 }
 
-export const getGitHubProfileLanguages = async () => {
+export const getGitHubProfileLanguages = async (): Promise<TopLanguage[]> => {
     const reposResponse = await fetch('https://api.github.com/users/carsonSgit/repos');
-    const repos = await reposResponse.json();
+    const reposData = await reposResponse.json();
+
+    const languageMap: Record<string, number> = {};
 
-    const languagesPromises = repos.map(async (repo: { name: string }) => {
+    for (const repo of reposData) {
         const languagesResponse = await fetch(`https://api.github.com/repos/carsonSgit/${repo.name}/languages`);
-        const languages = await languagesResponse.json();
-        return { repo: repo.name, languages };
-    });
+        const languagesData: LanguageData = await languagesResponse.json();
 
-    const languagesData = await Promise.all(languagesPromises);
-    
-    return languagesData;
-}
+        for (const [language, bytes] of Object.entries(languagesData)) {
+        if (language !== 'Jupyter Notebook' && language !== 'HTML' && language !== 'CSS' && language !== 'Mermaid' && language !== 'SCSS') {
+            languageMap[language] = (languageMap[language] || 0) + bytes;
+        }
+        }
+    }
+
+    return Object.entries(languageMap)
+        .sort(([, a], [, b]) => b - a)
+        .slice(0, 5)
+        .map(([language, bytes]) => ({ language, bytes }));
+};
diff --git a/src/Components/Interfaces/githubStats.ts b/src/Components/Interfaces/githubStats.ts
index 6cc1101..7a46a09 100644
--- a/src/Components/Interfaces/githubStats.ts
+++ b/src/Components/Interfaces/githubStats.ts
@@ -3,4 +3,13 @@ export interface GitHubStats {
     public_repos: number;
     followers: number;
     following: number;
-  }
\ No newline at end of file
+  }
+
+export interface LanguageData {
+    [key: string]: number;
+}
+  
+export interface TopLanguage {
+    language: string;
+    bytes: number;
+}
\ No newline at end of file

From f8b386690223f0f0031cea167b24a86451038ebe Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Wed, 21 Aug 2024 02:02:09 -0400
Subject: [PATCH 5/7] chore: DELETE STUFF

---
 src/Components/About/About.tsx | 12 +-----------
 1 file changed, 1 insertion(+), 11 deletions(-)

diff --git a/src/Components/About/About.tsx b/src/Components/About/About.tsx
index 522fda8..b171f8b 100644
--- a/src/Components/About/About.tsx
+++ b/src/Components/About/About.tsx
@@ -111,23 +111,13 @@ const About: React.FC = () => {
           />
         </div>
 
-        {error ? (
-          <p className="errorText">{error}</p>
-        ) : stats ? (
-          <p>
-            Username: {stats.login}, Public Repos: {stats.public_repos} | Followers: {stats.followers} | Following: {stats.following}
-          </p>
-        ) : (
-          <p>Loading GitHub stats...</p>
-        )}
-
         <div className="LanguagesContainer">
           <h3>Top 4 Languages Used:</h3>
           {topLanguages.length > 0 ? (
             <ul>
               {topLanguages.map(({ language, bytes }) => (
                 <li key={language}>
-                  {language}: {bytes} bytes
+                  {language}
                 </li>
               ))}
             </ul>

From 8fcaf182e78a67f2714bf4cccaba25f05143a6bf Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Wed, 21 Aug 2024 02:03:13 -0400
Subject: [PATCH 6/7] chore: Remove GitHub code from About

---
 src/Components/About/About.tsx                | 48 +------------------
 .../{About => Data}/getGitHubStats.ts         |  0
 2 files changed, 1 insertion(+), 47 deletions(-)
 rename src/Components/{About => Data}/getGitHubStats.ts (100%)

diff --git a/src/Components/About/About.tsx b/src/Components/About/About.tsx
index b171f8b..03f121d 100644
--- a/src/Components/About/About.tsx
+++ b/src/Components/About/About.tsx
@@ -1,38 +1,7 @@
-import React, { useEffect, useState } from 'react';
-import { getGitHubProfileStats, getGitHubProfileLanguages } from './getGitHubStats';
-import { GitHubStats } from '../Interfaces/githubStats';
+import React from 'react';
 import './About.scss';
 
 const About: React.FC = () => {
-  const [stats, setStats] = useState<GitHubStats | null>(null);
-  const [topLanguages, setTopLanguages] = useState<{ language: string; bytes: number }[]>([]);
-  const [error, setError] = useState<string | null>(null);
-
-  useEffect(() => {
-    const fetchGitHubStats = async () => {
-      try {
-        const fetchedStats = await getGitHubProfileStats();
-        setStats(fetchedStats);
-      } catch (error) {
-        console.error('Error fetching GitHub stats:', error);
-        setError('Failed to fetch GitHub stats.');
-      }
-    };
-
-    const fetchGitHubLanguages = async () => {
-      try {
-        const fetchedLanguages = await getGitHubProfileLanguages();
-        setTopLanguages(fetchedLanguages);
-      } catch (error) {
-        console.error('Error fetching GitHub languages:', error);
-        setError('Failed to fetch GitHub languages.');
-      }
-    };
-
-    fetchGitHubStats();
-    fetchGitHubLanguages();
-  }, []);
-
   return (
     <div className="AboutContainer">
       <div className="AboutContentContainer">
@@ -110,21 +79,6 @@ const About: React.FC = () => {
             alt="Carson"
           />
         </div>
-
-        <div className="LanguagesContainer">
-          <h3>Top 4 Languages Used:</h3>
-          {topLanguages.length > 0 ? (
-            <ul>
-              {topLanguages.map(({ language, bytes }) => (
-                <li key={language}>
-                  {language}
-                </li>
-              ))}
-            </ul>
-          ) : (
-            <p>Loading languages...</p>
-          )}
-        </div>
       </div>
     </div>
   );
diff --git a/src/Components/About/getGitHubStats.ts b/src/Components/Data/getGitHubStats.ts
similarity index 100%
rename from src/Components/About/getGitHubStats.ts
rename to src/Components/Data/getGitHubStats.ts

From d837bccbc546de2a7f5f501e2f0266bb618b42f7 Mon Sep 17 00:00:00 2001
From: carsonSgit <92652800+carsonSgit@users.noreply.github.com>
Date: Wed, 21 Aug 2024 02:11:35 -0400
Subject: [PATCH 7/7] chore: Comment out About image

---
 src/Components/About/About.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Components/About/About.tsx b/src/Components/About/About.tsx
index 03f121d..ea974b1 100644
--- a/src/Components/About/About.tsx
+++ b/src/Components/About/About.tsx
@@ -72,13 +72,13 @@ const About: React.FC = () => {
           </p>
         </div>
 
-        <div className="AboutImageContainer">
+        {/*<div className="AboutImageContainer">
           <img
             className="AboutImage"
             src={`${process.env.PUBLIC_URL}/carson.webp`}
             alt="Carson"
           />
-        </div>
+        </div>*/}
       </div>
     </div>
   );