perf(mod queue): prevent re-renders from IPFS client state changes

src/hooks/use-account-subplebbits-with-metadata.ts

@@ -1,15 +1,22 @@
-import { useAccountSubplebbits } from '@plebbit/plebbit-react-hooks';
-import { useMemo } from 'react';
+import useAccountsStore from '@plebbit/plebbit-react-hooks/dist/stores/accounts';
 import { MultisubSubplebbit } from './use-default-subplebbits';
 
 export const useAccountSubplebbitsWithMetadata = (): MultisubSubplebbit[] => {
-  const { accountSubplebbits } = useAccountSubplebbits();
+  const subplebbitsWithMetadata = useAccountsStore(
+    (state) => {
+      const activeAccountId = state.activeAccountId;
+      const activeAccount = activeAccountId ? state.accounts[activeAccountId] : undefined;
+      const accountSubplebbits = activeAccount?.subplebbits || {};
+      return Object.entries(accountSubplebbits).map(([address, sub]) => ({
+        address,
+        title: (sub as any).title,
+      }));
+    },
+    (prev, next) => {
+      if (prev.length !== next.length) return false;
+      return prev.every((item, idx) => item.address === next[idx].address && item.title === next[idx].title);
+    },
+  );
 
-  return useMemo(() => {
-    return Object.entries(accountSubplebbits || {}).map(([address, sub]) => ({
-      address,
-      title: (sub as any).title,
-      // We can map other fields if needed
-    }));
-  }, [accountSubplebbits]);
+  return subplebbitsWithMetadata;
 };