diff --git a/packages/app/src/Element/FollowButton.tsx b/packages/app/src/Element/FollowButton.tsx
index 25259f09..044f20e4 100644
--- a/packages/app/src/Element/FollowButton.tsx
+++ b/packages/app/src/Element/FollowButton.tsx
@@ -5,6 +5,7 @@ import { HexKey } from "@snort/nostr";
import useEventPublisher from "Feed/EventPublisher";
import { parseId } from "Util";
import useLogin from "Hooks/useLogin";
+import AsyncButton from "Element/AsyncButton";
import messages from "./messages";
@@ -37,11 +38,10 @@ export default function FollowButton(props: FollowButtonProps) {
}
return (
-
+
);
}
diff --git a/packages/app/src/Element/TrendingUsers.tsx b/packages/app/src/Element/TrendingUsers.tsx
new file mode 100644
index 00000000..c1fb0d66
--- /dev/null
+++ b/packages/app/src/Element/TrendingUsers.tsx
@@ -0,0 +1,52 @@
+import { useEffect, useState } from "react";
+import { HexKey } from "@snort/nostr";
+import { FormattedMessage } from "react-intl";
+
+import FollowListBase from "Element/FollowListBase";
+import PageSpinner from "Element/PageSpinner";
+
+interface TrendingUser {
+ pubkey: HexKey;
+}
+
+interface TrendingUserResponse {
+ profiles: Array;
+}
+
+async function fetchTrendingUsers() {
+ try {
+ const res = await fetch(`https://api.nostr.band/v0/trending/profiles`);
+ if (res.ok) {
+ const data = (await res.json()) as TrendingUserResponse;
+ return data.profiles.map(a => a.pubkey);
+ }
+ } catch (e) {
+ console.warn(`Failed to load link preview`);
+ }
+}
+
+const TrendingUsers = () => {
+ const [userList, setUserList] = useState();
+
+ useEffect(() => {
+ (async () => {
+ const data = await fetchTrendingUsers();
+ if (data) {
+ setUserList(data);
+ }
+ })();
+ }, []);
+
+ if (!userList) return ;
+
+ return (
+ <>
+
+
+
+
+ >
+ );
+};
+
+export default TrendingUsers;
diff --git a/packages/app/src/Pages/SearchPage.tsx b/packages/app/src/Pages/SearchPage.tsx
index 464ecab6..4f4361d4 100644
--- a/packages/app/src/Pages/SearchPage.tsx
+++ b/packages/app/src/Pages/SearchPage.tsx
@@ -9,6 +9,7 @@ import { SearchRelays } from "Const";
import { System } from "System";
import { MetadataCache } from "Cache";
import { UserCache } from "Cache/UserCache";
+import TrendingUsers from "Element/TrendingUsers";
import messages from "./messages";
@@ -64,6 +65,7 @@ const SearchPage = () => {
autoFocus={true}
/>
+ {!keyword && }
{keyword && allUsers?.slice(0, 3).map(u => >} className="card" pubkey={u.pubkey} />)}
{keyword && (