Improve instances selection screen

[overflorian]

Here is my proposal for a proper instance choice screen:

See https://design.penpot.app/#/view/e6f09089-87c8-80a6-8004-57cb2646ed57?page-id=e6f09089-87c8-80a6-8004-57cb2646ed58&section=interactions&index=0&share-id=ee63301e-1fa7-81b1-8004-6353968adcba

Please click on the first card to see the mockup n°2.

The card guidelines should be implemented respecting the card design cf. https://m3.material.io/components/cards

Also:

• when a card is opened, the favorite button allows to favorite the instance. There is only 1 favorite instance. Therefore, if any other instance has been favourite in the past, it would be unfavourited. When the user has already been successfully logged-in into an instance, it becomes favourited. The favourited instance is pre-selected by defaut when this screen is displayed again.
• In the future, it could be that an instance could be preselected according to user location (e.g. OpenStreetMap Portugal for Portugal based location)

[J2A2B]

Thank you for the proposal, Florian :) So, this means that if I click on the first instance, it is automatically set as a favorite, and if I come back later, it appears with a favorite design. But if I come back and go to the second instance, for example, it will be the second instance that takes the favorite status. I'm not sure if this behavior is very logical in terms of user experience because I might want to enter an instance without necessarily designating it as a favorite, right ? For me, setting a favorite is a distinct action and doesn't necessarily depend on the instance I'm entering. Two alternative proposals: 1 - Add a specific button (a star) to activate/deactivate directly on the card (top or bottom right). 2 - Display a popup message each time we enter an instance to ask if we want to choose it as the favorite instance.

Since proposal 2 is a bit invasive, I have a preference for 1.

[overflorian]

A specific button should be, indeed, be displayed in any pre-selected card. If clicked, it changes the favourite status. Once the user is logged-in for the first time, the instance becomes favorite. Warning: this behaviour should be only for the first login. In the future, if the user logs-in on another instance, the first instance remains favourite. The user still can change manually the favourite instance using the dedicated button.

[overflorian]

If a user is connected to an instance, this instance is "active". In this case, the "Connect" button is replaced by "Disconnect".