From 508078ae29535f63fbaa3214988ede7f9d1ee404 Mon Sep 17 00:00:00 2001
From: Tech4Aditya <techaditya.workmail@gmail.com>
Date: Tue, 26 May 2026 20:58:59 +0530
Subject: [PATCH] feat: add reusable empty state component for activity feed

---
 src/components/ActivityFeed.tsx | 11 ++++++++---
 src/components/EmptyState.tsx   | 25 +++++++++++++++++++++++++
 2 files changed, 33 insertions(+), 3 deletions(-)
 create mode 100644 src/components/EmptyState.tsx

diff --git a/src/components/ActivityFeed.tsx b/src/components/ActivityFeed.tsx
index d770dfee..7a03d866 100644
--- a/src/components/ActivityFeed.tsx
+++ b/src/components/ActivityFeed.tsx
@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-
+import EmptyState from "./EmptyState";
 interface EventType {
   id: string;
   type: string;
@@ -56,9 +56,14 @@ export default function ActivityFeed({ username }: { username: string }) {
       </h2>
 
       {loading ? (
-        <p className="text-center">Loading...</p>
+      <div className="text-center py-6 text-gray-500">
+        Fetching recent activity...
+        </div>
       ) : events.length === 0 ? (
-        <p className="text-center">No activity found</p>
+      <EmptyState
+        title="No activity found"
+        description="This user has no recent public GitHub activity."
+/>
       ) : (
         events.slice(0, 10).map((event) => (
           <div
diff --git a/src/components/EmptyState.tsx b/src/components/EmptyState.tsx
new file mode 100644
index 00000000..d9157d0b
--- /dev/null
+++ b/src/components/EmptyState.tsx
@@ -0,0 +1,25 @@
+interface EmptyStateProps {
+  title: string;
+  description?: string;
+}
+
+export default function EmptyState({
+  title,
+  description,
+}: EmptyStateProps) {
+  return (
+    <div className="flex flex-col items-center justify-center py-10 text-center">
+      <div className="text-5xl mb-3">📭</div>
+
+      <h2 className="text-lg font-semibold text-gray-700 dark:text-gray-200">
+        {title}
+      </h2>
+
+      {description && (
+        <p className="mt-2 text-sm text-gray-500 dark:text-gray-400 max-w-md">
+          {description}
+        </p>
+      )}
+    </div>
+  );
+}
\ No newline at end of file