GitHub Activity Monitor Implementation

[Korbin-Hillan]

GitHub Activity Monitor Implementation

Overview

This PR implements a Git Activity Monitor for the Projects, projects/academy, projects/website, projects/gamedev, projects/mobile, projects/scraper page, offering real-time visibility into contributions across CodeDevils repositories. It enhances the project showcase by demonstrating ongoing development efforts.

---

🛠️ Changes Made

New Components

• GitMonitor.tsx: A new React component that fetches and displays GitHub activity.
  • Shows recent commits across repositories
  • Displays top contributors with commit counts
  • Provides repository selection functionality
  • Handles API rate limits gracefully

Modified Pages

• Page.tsx
• content.tsx
• GitMonitor.tsx

---

⚙️ Technical Implementation Details

• Implements rate limiting protection
• Supports GitHub token authentication for increased API limits to 5000 instead of 60.

---

🎨 Visual Improvements

• Clean, consistent styling matching the CodeDevils theme
• Loading indicators and clear error messaging
• Avatar images for contributors and commit authors

---

✅ Testing Performed

• Verified display of commits from multiple repositories
• Tested API rate limit error handling
• Confirmed repo filtering functions correctly
• Checked appearance on various screen sizes

---

📸 Screenshots

---

Add a token to .env.local for the activity to work properly.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
codedevils	❌ Failed (Inspect)		May 10, 2025 9:53pm