add follow buttons in people search results

packages/app/src/Element/Feed/UsersFeed.tsx

@@ -0,0 +1,31 @@
+import { useCallback, useMemo } from "react";
+import { TaggedNostrEvent } from "@snort/system";
+
+import useTimelineFeed, { TimelineFeed } from "@/Feed/TimelineFeed";
+import FollowListBase from "@/Element/User/FollowListBase";
+import PageSpinner from "@/Element/PageSpinner";
+import useModeration from "@/Hooks/useModeration";
+
+export default function UsersFeed({ keyword, sortPopular = true }: { keyword: string; sortPopular?: boolean }) {
+  const feed: TimelineFeed = useTimelineFeed(
+    {
+      type: "profile_keyword",
+      items: [keyword + (sortPopular ? " sort:popular" : "")],
+      discriminator: keyword,
+    },
+    { method: "LIMIT_UNTIL" },
+  );
+
+  const { muted, isEventMuted } = useModeration();
+  const filterPosts = useCallback(
+    (nts: readonly TaggedNostrEvent[]) => {
+      return nts.filter(a => !isEventMuted(a));
+    },
+    [muted],
+  );
+  const usersFeed = useMemo(() => filterPosts(feed.main ?? []).map(p => p.pubkey), [feed, filterPosts]);
+
+  if (!usersFeed) return <PageSpinner />;
+
+  return <FollowListBase pubkeys={usersFeed} showAbout={true} />;
+}

packages/app/src/Pages/SearchPage.tsx

@@ -8,6 +8,7 @@ import { router } from "@/index";
 import TrendingUsers from "@/Element/Trending/TrendingUsers";
 
 import TrendingNotes from "@/Element/Trending/TrendingPosts";
+import UsersFeed from "@/Element/Feed/UsersFeed";
 
 const NOTES = 0;
 const PROFILES = 1;
@@ -49,6 +50,11 @@ const SearchPage = () => {
       return null;
     }
 
+    if (tab.value == PROFILES ) {
+      // render UsersFeed
+      return <UsersFeed keyword={keyword} />;
+    }
+
     const pf = tab.value == PROFILES;
     return (
       <>