Fix offline behaviour - Closes #545

[slaweet]

Closes #545

[reyraa]

Prefer an overlaying layer (Fixed positioned over all elements) to hinder all user interaction and not apply all these changes.

[slaweet]

The thing is we don't want to disable all interactions. Definitely not "Logout" button

[slaweet]

Now that I'm thinking about it "SIgn/verify message" has no problem with being offline, so it should be available

[slaweet]

But for the migration, I think the current implementation is fine and there can be an "enhancement" issue later on to "Provide a better offline experience".

[reyraa]

Ok, let me describe in more details.
We have 2 kind of interactions, the ones required an online/active peer, the ones that don't need.
We have 2 kind event after interaction, either we navigate or open a modal.

These said, we can simply add a class name to buttons/menu items which require the active peer to disable them by CSS later on when the body tag, has a class name of is-offline for example.
In a more informative UX approach, we can have a middleware that prevents opening the requested modal or navigation request and shows an alert meaning this action in only available if there is an active peer available.

[slaweet]

I'm all for "a more informative UX approach".
I can think of tooltips saying something like "Not available while offline". My OfflineWrapper component could easily do that in the future.

But the goal of this PR is merely migrating the functionality from Angular.
Using a wrapper component is IMO more readable and more React then using two classes we had in Angular.

[reyraa]

The reason I don't approve your implementation is:

• The way you apply the wrapper is inconsistent. In a case, you've wrapped a whole HOC with routings in it. in other case, a whole mane, and in the end a button.
• All wrapping and adding an extra layer of complication just to wrap them in a span with a class name? why not simply a class name?

Please change the offlineWrapper to just manipulate a class name and not add any layers to the existing structure.

thanks.

[reyraa]

Thank you Vit. Good job!