clean up & small fixes

src/shared/userProfile.tsx

@@ -3,21 +3,24 @@ import { Link } from 'react-router-dom';
 
 import { UserStats } from '@app/users/components/stats';
 
+import { useStorage } from '@libs/storage/provider';
+
 import { Image } from '@shared/image';
 
+import { useNostr } from '@utils/hooks/useNostr';
 import { useProfile } from '@utils/hooks/useProfile';
-import { useSocial } from '@utils/hooks/useSocial';
 import { displayNpub } from '@utils/shortenKey';
 
 export function UserProfile({ pubkey }: { pubkey: string }) {
+  const { db } = useStorage();
   const { user } = useProfile(pubkey);
-  const { status, userFollows, follow, unfollow } = useSocial();
+  const { addContact, removeContact } = useNostr();
 
   const [followed, setFollowed] = useState(false);
 
   const followUser = (pubkey: string) => {
     try {
-      follow(pubkey);
+      addContact(pubkey);
 
       // update state
       setFollowed(true);
@@ -28,7 +31,7 @@ export function UserProfile({ pubkey }: { pubkey: string }) {
 
   const unfollowUser = (pubkey: string) => {
     try {
-      unfollow(pubkey);
+      removeContact(pubkey);
 
       // update state
       setFollowed(false);
@@ -38,12 +41,10 @@ export function UserProfile({ pubkey }: { pubkey: string }) {
   };
 
   useEffect(() => {
-    if (status === 'success' && userFollows) {
-      if (userFollows.includes(pubkey)) {
-        setFollowed(true);
-      }
+    if (db.account.follows.includes(pubkey)) {
+      setFollowed(true);
     }
-  }, [status]);
+  }, []);
 
   return (
     <div>
@@ -68,14 +69,7 @@ export function UserProfile({ pubkey }: { pubkey: string }) {
           <UserStats pubkey={pubkey} />
         </div>
         <div className="mt-4 inline-flex items-center gap-2">
-          {status === 'loading' ? (
-            <button
-              type="button"
-              className="inline-flex h-10 w-36 items-center justify-center rounded-md bg-white/10 text-sm font-medium hover:bg-fuchsia-500"
-            >
-              Loading...
-            </button>
-          ) : followed ? (
+          {followed ? (
             <button
               type="button"
               onClick={() => unfollowUser(pubkey)}