Allow to toggle sidebar and always show the toggle

[marcoambrosini]

• Move the AppNavigationToggle in the AppNavigation
• Move from #app-navigation IDs to have independent styling from server
• Move AppNavigation open state IN the AppNavigation
• Create a global toggle-navigation to emit with th event bus for any app to open the navigation (was originally the start of this pair programming, we ended up fixing far too much ^^')
• Allow to toggle the navigation even when in desktop mode
• Changed the animation/css from translate and shifting the AppContent to the left to using proper flex layout and not weird absolute positioning anymore 🎉
• In mobile, opening the navigation does NOT shift the content, it just hovers it now. It avoid changing the whole layout and improve the rendering performances
• Document the new global event (cc @ChristophWurst)
• Emit event at first load

QA

• Swiping
• Toggling navigation
• Scrolling navigation
• Not being able to scroll left and see the hidden navigation
• Settings

fix nextcloud/server#15831

---

@ma12-co, @skjnldsv & @ChristophWurst on a nice beer programming session on a sweet Friday afternoon 🍻

[skjnldsv]

[korelstar]

Nice work! I've tested the current implementation and found out that scrolling the app-navigation is not possible anymore. This is required for small screens!

[jancborchardt]

Very nice!

• optional remember state ?

What is meant by this? If we have remembering, it should be per-app, and it should always work, not giving app developers a way to disable it.

[skjnldsv]

What is meant by this? If we have remembering, it should be per-app, and it should always work, not giving app developers a way to disable it.

It means it can be in a separate pr to keep it clean. 😉

[jancborchardt]

Just to make sure it’s not merged before:
We should make sure that the spec for "New message" and "New contact" buttons as discussed in https://github.com/nextcloud/server/issues/16934#issuecomment-542201187 is implemented before merging this. Otherwise the issue of "Mobile menu toggle for navigation overlaps with content (especially in Mail & Contacts)" will not only exist on mobile but on desktop too.

[georgehrke]

@ma12-co Thanks! This also fixes an issue we had in the calendar, where the toggle was shown, even though there is no app-navigation. ❤️

[marcoambrosini]

you should thank @skjnldsv more than me :)

[skjnldsv]

We should make sure that the spec for "New message" and "New contact" buttons as discussed in nextcloud/server#16934 (comment) is implemented before merging this. Otherwise the issue of "Mobile menu toggle for navigation overlaps with content (especially in Mail & Contacts)" will not only exist on mobile but on desktop too.

I don't know actually.
I would rather keep it simple here, otherwise it's harder to review.
Also because technically they're not the same and require us to call and decide of the proper implementation.
This doesn't create regressions technically. Let's fix the remaining issues in OP and merge it :)

[korelstar]

Nice work! I've tested the current implementation and found out that scrolling the app-navigation is not possible anymore. This is required for small screens!

In addition to this: the settings are not shown at the bottom anymore. Maybe, this issue is related to the above.

[marcoambrosini]

@skjnldsv I guess those conflicts are because of #1002, what should I do here?

[skjnldsv]

@skjnldsv I guess those conflicts are because of #1002, what should I do here?

Git rebase with strategy ours to keep the current master files in case of conflict and manually npm i @nextcloud/event-bus again

[korelstar]

The two issues I've found are fixed, now. Looks very good, thanks!

[skjnldsv]

Docs fails https://app.netlify.com/sites/nextcloud-vue-components/deploys/5e8e1c5c0203164eaddaf323

https://deploy-preview-989--nextcloud-vue-components.netlify.com/

[skjnldsv]

WORKED

[marcoambrosini]

WORKED

Oh nice!

[skjnldsv]

Rebased & ready to go

[jancborchardt]

We should make sure that the spec for "New message" and "New contact" buttons as discussed in nextcloud/server#16934 (comment) is implemented before merging this. Otherwise the issue of "Mobile menu toggle for navigation overlaps with content (especially in Mail & Contacts)" will not only exist on mobile but on desktop too.

I don't know actually.
I would rather keep it simple here, otherwise it's harder to review.
Also because technically they're not the same and require us to call and decide of the proper implementation.
This doesn't create regressions technically. Let's fix the remaining issues in OP and merge it :)

Fine with me as well, as then it will make it obvious that it will have to be fixed. :D