From 6c6b94688e11ea66f213887ac8869cd4184dbd06 Mon Sep 17 00:00:00 2001
From: Michel Kansou <>
Date: Mon, 3 Jul 2023 11:22:43 +0200
Subject: [PATCH] fix: add loading to follow status

---
 src/app/trending/components/profile.tsx | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/app/trending/components/profile.tsx b/src/app/trending/components/profile.tsx
index cddf356c..67d02da0 100644
--- a/src/app/trending/components/profile.tsx
+++ b/src/app/trending/components/profile.tsx
@@ -19,7 +19,7 @@ export function Profile({ data }: { data: any }) {
 
 	const embedProfile = data.profile ? JSON.parse(data.profile.content) : null;
 	const profile = embedProfile;
-	const { userFollows, follow, unfollow } = useSocial();
+	const { status: socialStatus, userFollows, follow, unfollow } = useSocial();
 
 	const [followed, setFollowed] = useState(false);
 
@@ -83,7 +83,18 @@ export function Profile({ data }: { data: any }) {
 					</div>
 				</div>
 				<div className="inline-flex items-center gap-2">
-					{!followed ? (<button type="button" onClick={() => followUser(data.pubkey)} >Follow</button>): (<button type="button" onClick={() => unfollowUser(data.pubkey)} >Unfollow</button>)}
+					{socialStatus === "loading" ? (
+						<button
+							type="button"
+							className="inline-flex w-36 h-10 items-center justify-center rounded-md bg-zinc-900 hover:bg-fuchsia-500 text-sm font-medium"
+						>
+							Loading...
+						</button>
+					) : followed ? (
+					<button type="button" onClick={() => unfollowUser(data.pubkey)}>Unfollow</button>
+					) : (
+					<button type="button" onClick={() => followUser(data.pubkey)}>Follow</button>
+					)}
 				</div>
 			</div>
 			<div className="mt-2">