useFollows hook

src/js/nostr/hooks/useFollows.ts

@@ -0,0 +1,32 @@
+import { useEffect, useState } from 'react';
+
+import Key from '@/nostr/Key.ts';
+import SocialNetwork from '@/nostr/SocialNetwork.ts';
+import { ID, STR } from '@/utils/UniqueIds.ts';
+
+export const useFollows = (key = Key.getPubKey(), includeSelf = true) => {
+  const id = ID(key);
+  const [followedUsers, setFollowedUsers] = useState(() => {
+    const initialFollowedUsers = SocialNetwork.followedByUser.get(id) || new Set();
+    if (includeSelf) {
+      initialFollowedUsers.add(id);
+    }
+    return Array.from(initialFollowedUsers).map((n) => STR(n));
+  });
+
+  useEffect(() => {
+    const unsub = SocialNetwork.getFollowedByUser(
+      Key.getPubKey(),
+      (newFollowedUsers) => {
+        setFollowedUsers(Array.from(newFollowedUsers));
+      },
+      includeSelf,
+    );
+
+    return () => {
+      unsub?.();
+    };
+  }, [key, includeSelf]);
+
+  return followedUsers;
+};

src/js/views/feeds/Home.tsx

@@ -1,38 +1,17 @@
-import { useEffect, useMemo, useState } from 'react';
+import { useMemo } from 'react';
 
 import CreateNoteForm from '@/components/create/CreateNoteForm';
 import FeedComponent from '@/components/feed/Feed';
 import Show from '@/components/helpers/Show';
 import OnboardingNotification from '@/components/onboarding/OnboardingNotification';
-import Key from '@/nostr/Key';
+import { useFollows } from '@/nostr/hooks/useFollows.ts';
 import { getEventReplyingTo, isRepost } from '@/nostr/utils';
 import { translate as t } from '@/translations/Translation.mjs';
-import { ID, STR } from '@/utils/UniqueIds';
 import { RouteProps } from '@/views/types.ts';
 import View from '@/views/View.tsx';
 
-import SocialNetwork from '../../nostr/SocialNetwork';
-
 const Home: React.FC<RouteProps> = () => {
-  const [followedUsers, setFollowedUsers] = useState(() => {
+  const followedUsers = useFollows();
-    const initialFollowedUsers = SocialNetwork.followedByUser.get(ID(Key.getPubKey())) || new Set();
-    initialFollowedUsers.add(ID(Key.getPubKey()));
-    return Array.from(initialFollowedUsers).map((n) => STR(n));
-  });
-
-  useEffect(() => {
-    const unsub = SocialNetwork.getFollowedByUser(
-      Key.getPubKey(),
-      (newFollowedUsers) => {
-        setFollowedUsers(Array.from(newFollowedUsers));
-      },
-      true,
-    );
-
-    return () => {
-      unsub?.();
-    };
-  }, []);
 
   const filterOptions = useMemo(
     () => [
@@ -51,8 +30,6 @@ const Home: React.FC<RouteProps> = () => {
     [followedUsers],
   );
 
-  console.log('followedUsers.length', followedUsers.length); // TODO this keeps changing, fix
-
   return (
     <View>
       <div className="flex flex-col w-full">