feat: make top institutions clickable to filter tender search

frontend/app/page.tsx

@@ -178,10 +178,14 @@ export default function HomePage() {
     window.history.pushState({}, '', `?tab=agent_analysis`);
   };
 
-  const handleFilterClick = (type: "sector" | "region", value: string) => {
+  const handleFilterClick = (type: "sector" | "region" | "buyer", value: string) => {
     setSearchKeyword(value);
     setActiveTab("Tender Search");
-    handleSearch({ keyword: value });
+    if (type === "buyer") {
+      handleSearch({ buyer: value });
+    } else {
+      handleSearch({ keyword: value });
+    }
     window.history.pushState({}, '', `?tab=tender_search&q=${encodeURIComponent(value)}`);
   };
 
@@ -352,7 +356,7 @@ export default function HomePage() {
             )}
             {activeTab === "Proposal Draft" && <ProposalDraft proposal={analysisResult?.proposal_draft ?? ""} />}
             {activeTab === "History" && <AnalysisHistory history={analysisHistory} searchHistory={searchHistory} />}
-            {activeTab === "Database" && <DBManager />}
+            {activeTab === "Database" && <DBManager onFilterClick={handleFilterClick} />}
             {activeTab === "About" && <SystemInfo />}
           </div>
         </main>

frontend/components/DBManager.tsx

@@ -4,7 +4,11 @@ import { useState, useEffect } from "react";
 import { fetchDetailedDbStats, syncDatabase, clearDatabase } from "../lib/api";
 import BrandLoader from "./BrandLoader";
 
-export default function DBManager() {
+type Props = {
+  onFilterClick?: (type: "sector" | "region" | "buyer", value: string) => void;
+};
+
+export default function DBManager({ onFilterClick }: Props) {
   const [stats, setStats] = useState<any>(null);
   const [isLoading, setIsLoading] = useState(true);
   const [isActionInProgress, setIsActionInProgress] = useState(false);
@@ -126,10 +130,19 @@ export default function DBManager() {
           </h3>
           <div className="space-y-4">
             {stats?.top_buyers?.map((buyer: any, idx: number) => (
-              <div key={idx} className="flex items-center justify-between p-4 rounded-2xl bg-white/[0.03] border border-white/5">
-                <span className="text-sm text-slate-300 truncate max-w-[250px] font-medium">{buyer.name}</span>
-                <span className="text-lg font-black text-cyan font-mono">{buyer.count}</span>
-              </div>
+              <button 
+                key={idx} 
+                onClick={() => onFilterClick?.("buyer", buyer.name)}
+                className="w-full flex items-center justify-between p-4 rounded-2xl bg-white/[0.03] border border-white/5 hover:bg-white/[0.08] hover:border-cyan/30 transition-all group/row cursor-pointer text-left"
+              >
+                <span className="text-sm text-slate-300 truncate max-w-[250px] font-medium group-hover/row:text-white transition-colors">
+                  {buyer.name}
+                </span>
+                <div className="flex items-center gap-3">
+                  <span className="text-lg font-black text-cyan font-mono">{buyer.count}</span>
+                  <span className="opacity-0 group-hover/row:opacity-100 transition-opacity text-cyan">📡</span>
+                </div>
+              </button>
             ))}
             {(!stats?.top_buyers || stats.top_buyers.length === 0) && (
               <p className="text-slate-600 italic text-sm py-4">No institutions found in local database.</p>