NNS dapp navigation (gentle breaking) changes

General
1

Hey :wave:

The new version of NNS-dapp that has been proposed and executed today on mainnet introduces a gently breaking changes of its navigation. The dapp has been upgraded from a single page application to a multiple pages app. That’s why, most routes / urls have changed.

Context

You may be aware that we recently migrated NNS-dapp to SvelteKit. I shared few tips I learned along the way in this post.

While we migrated the code base without modifying its custom routing system, we also communicated that it was our plan to do so (see same post as above) as we were - and are still - looking to improve the sign-in related user experience.

On one hand, we think that it would be useful - notably for newcomer - to provide more information about what’s NNS-dapp before they sign-in. On the other, we think it would also be useful to be able to share direct link to the proposals (see this other post).

So long story short, migrating the navigation is one of the steps to achieve such a goal.

Solution

Instead of hashbang based urls - e.g. https://nns.ic0.app/#/proposal/90917 - NNS-dapp has been modified to support context and query params - e.g. https://nns.ic0.app/proposal/?proposal=90917.

Each context - or sub-routes - either display the content if signed-in or a welcome screen (no more redirection to main login screen). e.g. https://nns.ic0.app/proposals/ or https://nns.ic0.app/accounts/.

The front login page still exists - https://nns.ic0.app/ - which is particularly handy for those as me who pin the dapp on their phone.

Goodie

Not related to above change, you might also notice that the left menu proposed in this version as well has become (way) smoother. We have reworked its code to get rid of the JavaScript code that was historically used for presentation purpose. CSS for the smoosh win.

Let me know if you have any questions or observations!

Two screenshots of the proposals and neurons views when not signed in.

Capture d’écran 2022-11-10 à 14.48.20
Capture d’écran 2022-11-10 à 14.48.202876×1886 253 KB

Capture d’écran 2022-11-10 à 14.49.03
Capture d’écran 2022-11-10 à 14.49.032876×1886 259 KB

6 Likes
2

Does this include the UI changes Dmitri has been working on?

3

No (see above screenshots).

Being said, as mentionned in one of my recent post we are working on the brand new design. If you check NNS-dapp and lib repo you might even found wip PRs.

4

Thanks @peterparker. New designs looking fresh indeed.

What is the timeline on pushing them out?

5

Cannot commit on a timeline but since work as began, I guess the first visual changes are probably to be expected soon rather than late.

But worth to note that it won’t be a single shot, more like a step by step iterative process with some big step, some small, like the “Goodie” of this post.