feat: UserState

packages/app/src/Components/User/MutedList.tsx

@@ -1,4 +1,4 @@
-import { HexKey } from "@snort/system";
+import { HexKey, NostrPrefix } from "@snort/system";
 import { FormattedMessage } from "react-intl";
 
 import MuteButton from "@/Components/User/MuteButton";
@@ -11,26 +11,31 @@ export interface MutedListProps {
   pubkeys: HexKey[];
 }
 
-export default function MutedList({ pubkeys }: MutedListProps) {
-  const { isMuted, muteAll } = useModeration();
-  const hasAllMuted = pubkeys.every(isMuted);
+export default function MutedList() {
+  const { muteList } = useModeration();
 
   return (
     <div className="p">
       <div className="flex justify-between">
         <div className="bold">
-          <FormattedMessage {...messages.MuteCount} values={{ n: pubkeys?.length }} />
+          <FormattedMessage {...messages.MuteCount} values={{ n: muteList?.length }} />
         </div>
-        <button
-          disabled={hasAllMuted || pubkeys.length === 0}
-          className="transparent"
-          type="button"
-          onClick={() => muteAll(pubkeys)}>
-          <FormattedMessage {...messages.MuteAll} />
-        </button>
       </div>
-      {pubkeys?.map(a => {
-        return <ProfilePreview actions={<MuteButton pubkey={a} />} pubkey={a} options={{ about: false }} key={a} />;
+      {muteList?.map(a => {
+        switch (a.type) {
+          case NostrPrefix.Profile:
+          case NostrPrefix.PublicKey: {
+            return (
+              <ProfilePreview
+                actions={<MuteButton pubkey={a.id} />}
+                pubkey={a.id}
+                options={{ about: false }}
+                key={a.id}
+              />
+            );
+          }
+        }
+        return undefined;
       })}
     </div>
   );