diff --git a/components/following-users.tsx b/components/following-users.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..8f140b7b8a2eef0c2c44f8af617c98ba53f683cc
--- /dev/null
+++ b/components/following-users.tsx
@@ -0,0 +1,34 @@
+"use client"
+
+import { useEffect, useState } from "react";
+import { getUsers } from "@/lib/api";
+import { IUser } from "@/types/types";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import User from "./user-item";
+
+export default function Following() {
+  const [followedUsers, setFollowedUsers] = useState<IUser[]>([]);
+ 
+
+  useEffect(() => {
+    fetchFollowedUsers();
+  }, []);
+
+  const fetchFollowedUsers = async () => {
+    try {
+      const users = await getUsers();
+      setFollowedUsers(users);
+    } catch (error) {
+      console.error("Error fetching followed users:", error);
+    }
+  };
+
+  return (
+    <div>
+      <h1>Followed Users</h1>
+      {followedUsers.map((user) => (
+        <User key={user.id} id={user.id} name={user.name} avatar={user.avatar} />
+      ))}
+    </div>
+  );
+};
diff --git a/components/user-item.tsx b/components/user-item.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391