fix: search matching aggregate metrics on people page (CircuitVerse#161)

Author: haaasini01

app/people/page.tsx

@@ -3,7 +3,7 @@
 import { useState, useEffect, useMemo } from "react";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent } from "@/components/ui/card";
-import { Loader2, Activity } from "lucide-react";
+import { Loader2, Activity, Users } from "lucide-react";
 import { PeopleStats } from "@/components/people/PeopleStats";
 import { PeopleGrid } from "@/components/people/PeopleGrid";
 import { ContributorDetail } from "@/components/people/ContributorDetail";
@@ -262,30 +262,16 @@ const filteredPeople = useMemo(() => {
           />
 
         <div className="mb-8">
-  {/* TITLE + SEARCH ROW */}
-    <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-4">
+  {/* TITLE */}
+    <div className="mb-4">
     <h2 className="text-3xl font-bold">
       <span className="text-black dark:text-white">Community </span>
       <span className="text-[#42B883]">Contributors</span>
     </h2>
-
-    {/* SEARCH BAR — RIGHT SIDE */}
-    <div className="relative w-full sm:w-72">
-      <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
-      <Input
-  type="text"
-  aria-label="Search contributors by name or username"
-  placeholder="Search contributors..."
-  value={searchQuery}
-  onChange={(e) => setSearchQuery(e.target.value)}
-  className="pl-9 h-9"
-/>
-
-    </div>
   </div>
 
   {/* DESCRIPTION */}
-  <p className="text-lg text-muted-foreground max-w-3xl">
+  <p className="text-lg text-muted-foreground max-w-3xl mb-6">
     Amazing community members who contribute to CircuitVerse through
     code, documentation, and more.
   </p>
@@ -298,6 +284,28 @@ const filteredPeople = useMemo(() => {
               onContributorClick={handleContributorClick}
             />
 
+            <div className="flex items-center justify-between gap-4 py-8">
+              <div className="flex items-center gap-2">
+                <Users className="w-5 h-5 text-muted-foreground" />
+                <span className="text-2xl font-bold text-foreground">
+                  {filteredPeople.length}{' '}
+                  <span className="text-[#42B883]">
+                    {filteredPeople.length === 1 ? 'Contributor' : 'Contributors'}
+                  </span>
+                  {searchQuery && <span className="text-foreground"> found</span>}
+                </span>
+              </div>
+              <div className="relative w-full sm:w-72">
+                <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
+                <Input
+                  type="text"
+                  placeholder="Search contributors..."
+                  value={searchQuery}
+                  onChange={(e) => setSearchQuery(e.target.value)}
+                  className="pl-9 h-10"
+                />
+              </div>
+            </div>
             <PeopleGrid
               contributors={filteredPeople}
               onContributorClick={handleContributorClick}