Merge branch 'main' into feat/optimize-api-requests-debounce

Author: mehul-m-prajapati

.github/workflows/auto-label-gssoc.yml

@@ -27,4 +27,5 @@ jobs:
         labels: |
             level:intermediate
             quality:clean
+            type:accessibility
             gssoc:approved

CONTRIBUTING.md

@@ -1,130 +1,130 @@
-# 🌟 Contributing to GitHub Tracker
+   # 🌟 Contributing to GitHub Tracker
 
-Thank you for showing interest in **GitHub Tracker**! 🚀  
-Whether you're here to fix a bug, propose an enhancement, or add a new feature, we’re thrilled to welcome you aboard. Let’s build something awesome together!
+   Thank you for showing interest in **GitHub Tracker**! 🚀  
+   Whether you're here to fix a bug, propose an enhancement, or add a new feature, we’re thrilled to welcome you aboard. Let’s build something awesome together!
 
-<br>
+   <br>
 
-## 🧑‍⚖️ Code of Conduct
+   ## 🧑‍⚖️ Code of Conduct
 
-Please make sure to read and adhere to our [Code of Conduct](https://github.com/GitMetricsLab/github_tracker/CODE_OF_CONDUCT.md) before contributing. We aim to foster a respectful and inclusive environment for everyone.
+   Please make sure to read and adhere to our [Code of Conduct](https://github.com/GitMetricsLab/github_tracker/CODE_OF_CONDUCT.md) before contributing. We aim to foster a respectful and inclusive environment for everyone.
 
-<br>
+   <br>
 
-## 🛠 Project Structure
+   ## 🛠 Project Structure
 
-```bash
-github_tracker/
-├── backend/                  # Node.js + Express backend
-│   ├── routes/               # API routes
-│   ├── controllers/          # Logic handlers
-│   └── index.js              # Entry point for server
-│
-├── frontend/                 # React + Vite frontend
-│   ├── components/           # Reusable UI components
-│   ├── pages/                # Main pages/routes
-│   └── main.jsx              # Root file
-│
-├── public/                   # Static assets like images
-│
-├── .gitignore
-├── README.md
-├── package.json
-├── tailwind.config.js
-└── CONTRIBUTING.md
-```
+   ```bash
+   github_tracker/
+   ├── backend/                  # Node.js + Express backend
+   │   ├── routes/               # API routes
+   │   ├── controllers/          # Logic handlers
+   │   └── index.js              # Entry point for server
+   │
+   ├── frontend/                 # React + Vite frontend
+   │   ├── components/           # Reusable UI components
+   │   ├── pages/                # Main pages/routes
+   │   └── main.jsx              # Root file
+   │
+   ├── public/                   # Static assets like images
+   │
+   ├── .gitignore
+   ├── README.md
+   ├── package.json
+   ├── tailwind.config.js
+   └── CONTRIBUTING.md
+   ```
 
----
+   ---
 
-## 🤝 How to Contribute
+   ## 🤝 How to Contribute
 
-### 🧭 First-Time Contribution Steps
+   ### 🧭 First-Time Contribution Steps
 
-1. **Fork the Repository** 🍴  
-   Click "Fork" to create your own copy under your GitHub account.
+   1. **Fork the Repository** 🍴  
+      Click "Fork" to create your own copy under your GitHub account.
 
-2. **Clone Your Fork** 📥  
-   ```bash
-   git clone https://github.com/<your-username>/github_tracker.git
-   ```
+   2. **Clone Your Fork** 📥  
+      ```bash
+      git clone https://github.com/<your-username>/github_tracker.git
+      ```
 
-3. **Navigate to the Project Folder** 📁  
-   ```bash
-   cd github_tracker
-   ```
+   3. **Navigate to the Project Folder** 📁  
+      ```bash
+      cd github_tracker
+      ```
 
-4. **Create a New Branch** 🌿  
-   ```bash
-   git checkout -b your-feature-name
-   ```
+   4. **Create a New Branch** 🌿  
+      ```bash
+      git checkout -b your-feature-name
+      ```
 
-5. **Make Your Changes** ✍  
-   After modifying files, stage and commit:
+   5. **Make Your Changes** ✍  
+      After modifying files, stage and commit:
 
-   ```bash
-   git add .
-   git commit -m "✨ Added [feature/fix]: your message"
-   ```
+      ```bash
+      git add .
+      git commit -m "✨ Added [feature/fix]: your message"
+      ```
 
-6. **Push Your Branch to GitHub** 🚀  
-   ```bash
-   git push origin your-feature-name
-   ```
+   6. **Push Your Branch to GitHub** 🚀  
+      ```bash
+      git push origin your-feature-name
+      ```
 
-7. **Open a Pull Request** 🔁  
-   Go to the original repo and click **Compare & pull request**.
-   
----
+   7. **Open a Pull Request** 🔁  
+      Go to the original repo and click **Compare & pull request**.
+      
+   ---
 
-## 🚦 Pull Request Guidelines
+   ## 🚦 Pull Request Guidelines
 
-### **Split Big Changes into Multiple Commits**
-- When making large or complex changes, break them into smaller, logical commits. 
-- Each commit should represent a single purpose or unit of change (e.g. refactoring, adding a feature, fixing a bug).
----
-- ✅ Ensure your code builds and runs without errors.
-- 🧪 Include tests where applicable.
-- 💬 Add comments if the logic is non-trivial.
-- 📸 Attach screenshots for UI-related changes.
-- 🔖 Use meaningful commit messages and titles.
+   ### **Split Big Changes into Multiple Commits**
+   - When making large or complex changes, break them into smaller, logical commits. 
+   - Each commit should represent a single purpose or unit of change (e.g. refactoring, adding a feature, fixing a bug).
+   ---
+   - ✅ Ensure your code builds and runs without errors.
+   - 🧪 Include tests where applicable.
+   - 💬 Add comments if the logic is non-trivial.
+   - 📸 Attach screenshots for UI-related changes.
+   - 🔖 Use meaningful commit messages and titles.
 
----
+   ---
 
-## 🐞 Reporting Issues
+   ## 🐞 Reporting Issues
 
-If you discover a bug or have a suggestion:
+   If you discover a bug or have a suggestion:
 
-➡️ [Open an Issue](https://github.com/GitMetricsLab/github_tracker/issues/new/choose)
+   ➡️ [Open an Issue](https://github.com/GitMetricsLab/github_tracker/issues/new/choose)
 
-Please include:
+   Please include:
 
-- **Steps to Reproduce**
-- **Expected vs. Actual Behavior**
-- **Screenshots/Logs (if any)**
+   - **Steps to Reproduce**
+   - **Expected vs. Actual Behavior**
+   - **Screenshots/Logs (if any)**
 
----
+   ---
 
-## 🧠 Good Coding Practices
+   ## 🧠 Good Coding Practices
 
-1. **Consistent Style**  
-   Stick to the project's linting and formatting conventions (e.g., ESLint, Prettier, Tailwind classes).
+   1. **Consistent Style**  
+      Stick to the project's linting and formatting conventions (e.g., ESLint, Prettier, Tailwind classes).
 
-2. **Meaningful Naming**  
-   Use self-explanatory names for variables and functions.
+   2. **Meaningful Naming**  
+      Use self-explanatory names for variables and functions.
 
-3. **Avoid Duplication**  
-   Keep your code DRY (Don't Repeat Yourself).
+   3. **Avoid Duplication**  
+      Keep your code DRY (Don't Repeat Yourself).
 
-4. **Testing**  
-   Add unit or integration tests for any new logic.
+   4. **Testing**  
+      Add unit or integration tests for any new logic.
 
-5. **Review Others’ PRs**  
-   Help others by reviewing their PRs too!
+   5. **Review Others’ PRs**  
+      Help others by reviewing their PRs too!
 
----
+   ---
 
-## 🙌 Thank You!
+   ## 🙌 Thank You!
 
-We’re so glad you’re here. Your time and effort are deeply appreciated. Feel free to reach out via Issues or Discussions if you need any help.
+   We’re so glad you’re here. Your time and effort are deeply appreciated. Feel free to reach out via Issues or Discussions if you need any help.
 
-**Happy Coding!** 💻🚀  
+   **Happy Coding!** 💻🚀  

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "GitHub Tracker",
+  "name": "github-tracker",
   "private": true,
   "version": "0.0.0",
   "type": "module",

src/App.tsx

@@ -12,7 +12,7 @@ function App() {
   const isFullscreen = FULLSCREEN_ROUTES.includes(location.pathname);
 
   return (
-      <div className="relative flex flex-col min-h-screen">
+      <div className="relative bg-[#1F2937] flex flex-col min-h-screen">
         {!isFullscreen && <ScrollProgressBar />}
 
         {!isFullscreen && <Navbar />}

src/Routes/Router.tsx

@@ -6,6 +6,7 @@ import Contributors from "../pages/Contributors/Contributors";
 import Signup from "../pages/Signup/Signup.tsx";
 import Login from "../pages/Login/Login.tsx";
 import ContributorProfile from "../pages/ContributorProfile/ContributorProfile.tsx";
+import Custom404 from "../pages/404.tsx";
 import Home from "../pages/Home/Home.tsx";
 import Activity from "../pages/Activity.tsx"; 
 
@@ -20,6 +21,7 @@ const Router = () => {
       <Route path="/contact" element={<Contact />} />
       <Route path="/contributors" element={<Contributors />} />
       <Route path="/contributor/:username" element={<ContributorProfile />} />
+      <Route path="*" element={<Custom404 />} />
 
       {/* ✅ new route */}
       <Route path="/activity" element={<Activity />} />

src/components/Footer.tsx

@@ -1,4 +1,6 @@
-import { useState } from 'react';
+import React, { useState } from 'react';
+import { FaGithub, FaDiscord, FaArrowRight } from 'react-icons/fa';
+import { FaXTwitter } from 'react-icons/fa6';
 import { Link } from 'react-router-dom';
 import {
   FaGithub,
@@ -154,15 +156,14 @@ function Footer() {
             >
               <FaGithub className="h-6 w-6" />
             </a>
-
-            <a
-              href="https://x.com/your_handle"
-              target="_blank"
-              rel="noopener noreferrer"
-              className="text-zinc-400 dark:text-zinc-500 hover:text-sky-500 dark:hover:text-zinc-100 transition-all duration-300 hover:-translate-y-1 hover:scale-110"
-              aria-label="Twitter"
+            <a 
+              href="https://x.com/your_handle" 
+              target="_blank" 
+              rel="noopener noreferrer" 
+              className="text-zinc-400 dark:text-zinc-500 hover:text-sky-500 dark:hover:text-zinc-100 transition-colors duration-200" 
+              aria-label="X"
             >
-              <FaTwitter className="h-6 w-6" />
+              <FaXTwitter className="h-7 w-7" />
             </a>
 
             <a

src/hooks/useGitHubAuth.ts

@@ -1,25 +1,45 @@
-import { useState, useMemo } from 'react';
-import { Octokit } from '@octokit/core';
+import { useState, useEffect } from 'react';
+import { Octokit } from 'octokit';
 
 export const useGitHubAuth = () => {
-  const [username, setUsername] = useState('');
-  const [token, setToken] = useState('');
+  const [username, setUsername] = useState(() => sessionStorage.getItem('tracker_username') || '');
+  const [token, setToken] = useState(() => sessionStorage.getItem('tracker_token') || '');
+  const [error, setError] = useState('');
 
-  const octokit = useMemo(() => {
-    if (!username) return null;
-    if(token){
-    return new Octokit({ auth: token });
+  useEffect(() => {
+    if (username) {
+      sessionStorage.setItem('tracker_username', username);
+    } else {
+      sessionStorage.removeItem('tracker_username');
+    }
+    if (token) {
+      sessionStorage.setItem('tracker_token', token);
+    } else {
+      sessionStorage.removeItem('tracker_token');
     }
-    return new Octokit();
   }, [username, token]);
 
-  const getOctokit = () => octokit;
+  const getOctokit = () => {
+    try {
+      setError('');
+      if (!username) return null;
+      if (token) {
+        return new Octokit({ auth: token });
+      }
+      return new Octokit();
+    } catch (err: any) {
+      setError(err instanceof Error ? err.message : String(err));
+      return null;
+    }
+  };
 
   return {
     username,
     setUsername,
     token,
     setToken,
+    error,
+    setError,
     getOctokit,
   };
 };

src/pages/404.tsx

@@ -0,0 +1,28 @@
+import { Link } from "react-router-dom";
+
+export default function Custom404() {
+  return (
+    <section className="min-h-screen w-full flex items-center justify-center bg-gradient-to-br from-gray-50 to-blue-100 px-6">
+      <div className="text-center">
+        <h1 className="text-7xl md:text-8xl font-extrabold text-blue-600 mb-4">
+          404
+        </h1>
+
+        <h2 className="text-2xl md:text-3xl font-bold text-gray-900 mb-4">
+          Page Not Found
+        </h2>
+
+        <p className="text-gray-600 text-lg mb-8 max-w-md">
+          The page you are looking for does not exist or has been moved.
+        </p>
+
+        <Link
+          to="/"
+          className="inline-block bg-blue-600 text-white px-8 py-4 rounded-lg font-semibold hover:bg-blue-700 transition-all transform hover:scale-105 shadow-lg"
+        >
+          Go Back Home
+        </Link>
+      </div>
+    </section>
+  );
+}