Fix broken sync

main.js

@@ -113,7 +113,7 @@ async function loadAccount() {
   const name = profile?.name ?? ''
   globalAccountName = name
 
-  peer.net.start()
+  await peer.net.start()
 
   return { id, name }
 }
@@ -212,7 +212,9 @@ async function subscribeToReadElements() {
         ['profile@dict', 'zooboardElements@newest-100'],
       ],
       64_000,
-      () => {}
+      (err) => {
+        if (err) console.error('Starting conductor failed:', err)
+      }
     )
   }, 32)
 }

package.json

@@ -32,7 +32,7 @@
     "pzp-conductor": "^1.0.0",
     "pzp-hub-client": "^1.0.0",
     "pzp-invite": "^1.0.0",
-    "pzp-net": "^1.0.0",
+    "pzp-net": "^1.0.1",
     "pzp-promise": "^1.0.0",
     "pull-awaitable": "1.0.0",
     "react": "^18.2.0",

pnpm-lock.yaml

@@ -50,8 +50,8 @@ dependencies:
     specifier: ^1.0.0
     version: 1.0.0
   pzp-net:
-    specifier: ^1.0.0
-    version: 1.0.0
+    specifier: ^1.0.1
+    version: 1.0.1
   pzp-promise:
     specifier: ^1.0.0
     version: 1.0.0
@@ -9710,8 +9710,8 @@ packages:
       - sodium-javascript
     dev: false
 
-  /pzp-net@1.0.0:
-    resolution: {integrity: sha512-ZWvBfvlTkMaKwKF+jaZjLMNoOcswQwO/ntakxv+k/bi0UYWPEfO36XR7b7E38b0ukVGkN/T4jlKnFTbu5ltz1w==}
+  /pzp-net@1.0.1:
+    resolution: {integrity: sha512-qIkpt+Tza0P62vF5NcwoBATbp+x4VEtSuop9qCuCkbNPKD6496q72c3ytbZbl3vlGWimU9hg2Z4nURPhgBRZQg==}
     engines: {node: '>=18'}
     dependencies:
       '@types/pull-stream': 3.6.7

src/Connections.js

@@ -22,14 +22,16 @@ function Connections() {
       {connections.map(([multiaddr, info]) => (
         <div
           key={multiaddr}
-          className="flex flex-row items-center mt-1 text-xs text-gray-500 font-mono overflow-x-hidden overflow-ellipsis"
+          className="flex flex-row items-center mt-1 text-xs text-gray-500 font-mono"
         >
           {info.state === 'connected' ? (
             <div className="shrink-0 w-2 h-2 mb-0.5 bg-green-500 rounded-full mr-1" />
           ) : (
             <div className="shrink-0 w-2 h-2 mb-0.5 bg-yellow-500 rounded-full mr-1" />
           )}
-          {tinyMultiaddr(multiaddr)}
+          <div className="break-all">
+            {tinyMultiaddr(multiaddr)}
+          </div>
         </div>
       ))}
     </>