client-web: drop usage of followingUserIds

README.md

@@ -234,7 +234,7 @@ const event = NewContactList({
     {
       key: "5276ac499c9c6a353634d3d2cb6f4ada5167c3b886108ab4ddeb8ddf7b0fff70",
       relayUrl: "wss://nostr.rocks",
-      petname: "nostros",
+      petname: "nostrop",
     },
   ],
 });

client-web/index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/logo.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>NostrOS</title>
+    <title>NostrOP</title>
     <link rel="apple-touch-icon" href="/apple-touch-icon.png" sizes="180x180">
     <meta name="theme-color" content="#ffffff">
   </head>

client-web/src/components/event.tsx

@@ -236,7 +236,7 @@ export function Event({ data, level }: EventProps) {
           />
         )}
         <Box p={2}>
-          <User user={user} options={userOptions} />
+          <User user={user} opts={userOptions} />
         </Box>
       </CardHeader>
       {/* BODY */}

client-web/src/components/event/user.tsx

@@ -11,7 +11,7 @@ export function EventUser({ data }: EventUserProps) {
       {data.user && data.user.pubkey ? (
         <User
           user={data.user}
-          options={{
+          opts={{
             showFollowing: true,
             relayUrls: data.eventRelayUrls,
             showBlock: true,
@@ -22,7 +22,7 @@ export function EventUser({ data }: EventUserProps) {
           user={{
             pubkey: data.event.pubkey,
           }}
-          options={{
+          opts={{
             showFollowing: true,
             relayUrls: data.eventRelayUrls,
             showBlock: true,

client-web/src/components/feeds.tsx

@@ -11,14 +11,11 @@ import {
 } from "../lib/default-filters";
 
 export function EventsFeeds() {
-  const [status, followingUserIds, keypairIsLoaded, keypair] = useNClient(
-    (state) => [
-      state.status,
-      state.followingUserIds,
-      state.keypairIsLoaded,
-      state.keypair,
-    ]
-  );
+  const [status, keypairIsLoaded, keypair] = useNClient((state) => [
+    state.status,
+    state.keypairIsLoaded,
+    state.keypair,
+  ]);
 
   const isInitDone = useRef<boolean>(false);
 
@@ -76,7 +73,12 @@ export function EventsFeeds() {
     if (feedName === "global") {
       activeFilters.current = filterDefault();
     } else if (feedName === "following") {
-      activeFilters.current = filterByAuthor(followingUserIds);
+      const following = await useNClient.getState().getAllUsersFollowing();
+      if (following) {
+        activeFilters.current = filterByAuthor(
+          following?.map((f) => f.user.pubkey)
+        );
+      }
     } else if (feedName === "mentions") {
       activeFilters.current = filterByMentions([keypair.publicKey]);
     } else {
@@ -105,7 +107,7 @@ export function EventsFeeds() {
     <Box>
       <Box p={2}>
         <ListSelection
-          showFollowing={followingUserIds.length > 0}
+          showFollowing={true}
           showMentions={keypairIsLoaded}
           changeFeed={changeFeed}
         />

client-web/src/components/popular-users.tsx

@@ -9,8 +9,8 @@ import {
 } from "@chakra-ui/react";
 import { UserRecord } from "@nostr-ts/common";
 import { useEffect, useRef, useState } from "react";
-import { UserInfo } from "./user-info";
 import { useNClient } from "../state/client";
+import { User } from "./user";
 
 export function PopularUsersList() {
   const [users, setUsers] = useState<UserRecord[]>([]);
@@ -102,14 +102,13 @@ export function PopularUsersList() {
 
       {users.length > 0
         ? users.map((user, index) => (
-            <UserInfo
+            <User
               key={index}
               user={user.user}
               opts={{
                 showAbout: false,
                 showBanner: false,
-                following: false,
-                showFollowing: false,
+                showFollowing: true,
                 showBlock: false,
                 relayUrls: [],
                 isBlocked: false,

client-web/src/components/user-icon.tsx

@@ -11,13 +11,12 @@ import {
   PopoverTrigger,
 } from "@chakra-ui/react";
 import { UserBase } from "@nostr-ts/common";
-import { useNClient } from "../state/client";
-import { UserInfo } from "./user-info";
 import { UserOptions } from "../lib/user-properties";
+import { User } from "./user";
 
 export function UserIcon({
   user,
-  options: {
+  opts: {
     showAbout,
     showBanner,
     showFollowing,
@@ -28,12 +27,8 @@ export function UserIcon({
   },
 }: {
   user: UserBase;
-  options: UserOptions;
+  opts: UserOptions;
 }) {
-  const [following] = useNClient((state) => [
-    state.followingUserIds.find((f) => f === user.pubkey),
-  ]);
-
   const picture = user.data && user.data.picture ? user.data.picture : "";
 
   return (
@@ -75,12 +70,11 @@ export function UserIcon({
           <PopoverCloseButton />
           <PopoverHeader>{title}</PopoverHeader>
           <PopoverBody>
-            <UserInfo
+            <User
               user={user}
               opts={{
                 showAbout,
                 showBanner,
-                following: !!following,
                 showFollowing,
                 relayUrls,
                 title,