clean up & small fixes

src/shared/notes/replies/list.tsx

@@ -11,10 +11,13 @@ export function RepliesList({ id }: { id: string }) {
   const [data, setData] = useState<null | NDKEventWithReplies[]>(null);
 
   useEffect(() => {
+    let isCancelled = false;
+
     async function fetchRepliesAndSub() {
       const events = await fetchAllReplies(id);
-      setData(events);
-
+      if (!isCancelled) {
+        setData(events);
+      }
       // subscribe for new replies
       sub(
         {
@@ -26,9 +29,12 @@ export function RepliesList({ id }: { id: string }) {
         false
       );
     }
-
     fetchRepliesAndSub();
-  }, []);
+
+    return () => {
+      isCancelled = true;
+    };
+  }, [id]);
 
   if (!data) {
     return (

src/shared/notes/stats.tsx

@@ -72,7 +72,7 @@ export function NoteStats({ id }: { id: string }) {
         <span className="font-semibold text-white">
           {compactNumber.format(data.reposts)}
         </span>{' '}
-        reposts
+        repostrs
       </p>
       <span className="text-white/50">·</span>
       <p className="text-white/50">

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)}