refactor: more readable code

js/desktop/src/features/particles/stream-top-bar.tsx

@@ -276,10 +276,14 @@ function MembersIndicator({
   const userId = useAuthStore((s) => s.user?.id);
   const humans = network?.humans ?? [];
 
-  const othersIds =
+  const isNetworkWide = visibility.mode === 'network';
-    visibility.mode === 'network'
+  const allMemberIds = visibility.humanIds;
-      ? []
+  const othersIds = isNetworkWide
-      : visibility.humanIds.filter((id) => id != userId);
+    ? []
+    : allMemberIds.filter((id) => id != userId);
+
+  const isPrivate = othersIds.length == 0;
+
   const shownMembers = othersIds
     .slice(0, 3)
     .map((id) => humans.find((h) => h.id === id))
@@ -293,12 +297,17 @@ function MembersIndicator({
           onClick={onClick}
           className="no-drag flex items-center gap-1.5 rounded-full bg-white/5 px-2 py-1 text-xs text-white/70 backdrop-blur-sm transition-colors hover:bg-white/10"
         >
-          {visibility.mode === 'network' ? (
+          {isNetworkWide ? (
             <>
               <Globe className="size-3 text-white/50" />
               <span>Everyone</span>
             </>
-          ) : othersIds.length > 0 ? (
+          ) : isPrivate ? (
+            <>
+              <Lock className="size-3 text-white/50" />
+              <span>Private</span>
+            </>
+          ) : (
             <>
               <AvatarGroup>
                 {shownMembers.map((human) => (
@@ -313,18 +322,13 @@ function MembersIndicator({
                 <span className="text-white/50">+{overflow}</span>
               )}
             </>
-          ) : (
-            <>
-              <Lock className="size-3 text-white/50" />
-              <span>Private</span>
-            </>
           )}
         </button>
       </TooltipTrigger>
       <TooltipContent>
-        {visibility.mode === 'network'
+        {isNetworkWide
           ? `Everyone in ${network?.name ?? 'network'}`
-          : `${othersIds.length + 1} ${othersIds.length + 1 === 1 ? 'member' : 'members'}`}
+          : `${allMemberIds.length} ${allMemberIds.length === 1 ? 'member' : 'members'}`}
       </TooltipContent>
     </Tooltip>
   );