Display connection information in Settings > Network Status

[siepra]

Users troubleshooting a problem and developers working on Quiet need a place where they can see Quiet's network status. We should add a section in settings for this that users can navigate to on desktop and mobile.

Designs: https://www.figma.com/file/frxdNd42wV8kgXoiBExoqR/User-and-network-status?type=design&node-id=716-24468&mode=design&t=kwN714nqlQBAlCX9-4

Note that these designs imply an update to the desktop settings design to match mobile. We've discussed re-using containers or components for this, so that should be considered.)

Also note that the content of this section is not specified in the designs. Rather, the designs are intended to give developers the ability to add whatever information is useful in a clear way. I've mocked up some of these in the designs, but the content should be as follows.

Content:

• Tor: 100% (Connected) / 10% (Handshaking with a relay)
• Backend: Running / Starting up
• WebSocket API: Connected / Connecting
• Time online: 18 min
• Connected peers: 2

Notes:

• For Tor, 10% (Handshaking with a relay) should be the same information we currently display.
• Error is in red
• For Backend, if we can show a percentage complete and steps we can format it as "10% (Loading node modules)" e.g.

[holmesworcester]

Note: now that we're starting Tor asynchronously, we have to find a place for this in the app and not the splash screen.

[Kacper-RF]

As far as I know Bartek and Wiktor have found another way to optimize launch on iOS and at the moment we are still waiting for Tor to bootstrap so one option is to add a similar progress bar with Tor logs on Android as we have on desktop versions

[holmesworcester]

Let's discuss this tomorrow. Moving to "blocked" because of this ambiguity.

[holmesworcester]

See comment here: https://github.com/TryQuiet/quiet/issues/1656#issuecomment-1665752083

[holmesworcester]

Updated to reflect that we aren't showing a startup splash screen anymore. @Kacper-RF you've worked the most on status, I think. Can you propose what the content of this screen should be, and what states it should include, based on what information is readily available and my/wiktor's list of desired information above?

[holmesworcester]

If #1706 has been completed already, we should make the connection status indicator in #1706 a clickable/tappable link to Settings > Network Status

[Kacper-RF]

Ok so I would suggest to include most of the items from Wiktors list:

Tor status: connected/disconnected/pending (it will be depends on Tor bootstrap process, if 100% then Tor is connected) Tor bootstrap progress : {Procent: 14%, Step: Handshaking with a relay} (the same data as on first splash screen in desktop app)

Time online: 18min WebSocket status: connected/disconnected/pending Community initialized: true/false

Number of connected peers: 2

[holmesworcester]

What's the difference between disconnected and pending? Wouldn't we always be trying to connect if we were disconnected?

Can we include OrbitDB sync progress information?

Also, can we call Websocket "Backend" or something more informative?

How about:

Tor: 100% (Connected) OR 10% (Handshaking with a relay) Backend: Connected / Starting up Time online: 18 min Connected peers: 2

If we can show % progress for backend starting that would be awesome!

[Kacper-RF]

I had an idea that we can name situation when we trying to connect as status pending and in case of any error it will be disconnected, but that will be little overkill so i think we can stick to two main statuses connected and disconnected.

Tor Status looks great.

About OrbitDB and showing % for backend i need to checks some things, and i will back with response

[holmesworcester]

I had an idea that we can name situation when we trying to connect as status pending and in case of any error it will be disconnected, but that will be little overkill so i think we can stick to two main statuses connected and disconnected.

If there's an error, let's say "Backend: Error - Error message..." and let the user click to see the full message?

About OrbitDB and showing % for backend i need to checks some things, and i will back with response

This isn't super important unless we have it already.

[Kacper-RF]

Websocket and backend are two different things, so we can show them separately.

Backend: Started / Starting Up WebSocket: Connected / Disconnected

[holmesworcester]

Backend: Started / Starting Up

Can we do: "Backend: Running / Starting up"

WebSocket: Connected / Disconnected

Is there a state where WebSocket is Disconnected permanently and not trying to connect? Should it be "Connected / Connecting"?

Also, is there a name for "WebSocket" that is more informative to people outside the code? "Websocket API"? "Local API"? "Backend API"?

[Kacper-RF]

Can we do: "Backend: Running / Starting up"

Yes

Is there a state where WebSocket is Disconnected permanently and not trying to connect? Should it be "Connected / Connecting"?

It can be "Connected / Connecting"

Also, is there a name for "WebSocket" that is more informative to people outside the code? "Websocket API"? "Local API"? "Backend API"?

I think for start we can name it as Websocket API

[holmesworcester]

I've edited the description to reflect these, and attempted some incomplete edits to the designs as well just to show the overall sense of things and make sure what we've decided makes sense.

@Kacper-RF Can you confirm this is sufficiently specified?

[Kacper-RF]

I would suggest to do first iteration in that specification

Tor: 100% (Connected) / 10% (Handshaking with a relay) Backend: Running / Starting up WebSocket API: Connected / Connecting Time online: 18 min Connected peers: 2

Without showing errors because the scope is smaller and it will be align with our vision of frequent deployments.

Also maybe not using red color if Connected peers: 0 for owner who just created a community?

[holmesworcester]

Without showing errors because the scope is smaller and it will be align with our vision of frequent deployments.

Sounds good

Also maybe not using red color if Connected peers: 0 for owner who just created a community?

Yeah let's skip the red color thing.

[holmesworcester]

I think we discussed that this would go back to being in the backlog, and that someone can pick it up if they are blocked.