Implement new edition switcher

[ashishpuliyel]

Updated 20 June. Now simplified and good to pickup

We handle editions in a potentially confusing way.

A UK-edition user, visiting theguardian.com/us will see the us-front, but not necessarily understand what it is they're looking at.

Design is working on a new element to make this clearer to users, and give them the option to go back to their default front if they've ended up there by accident (or been sent there incorrectly by a search engine).

The idea is to show this to users who are viewing a network front which isn't their network front. So a UK edition user viewing /us for example. If they've chosen to switch editions via the switcher, this does not apply.

Mobile:

https://www.figma.com/proto/WnlDynuImNeWe0b28BkT1L/Editions-Switch-Banner?node-id=227-9633&t=HqZX6GFk89l8uE5o-0&scaling=min-zoom&page-id=157%3A31814&starting-point-node-id=227%3A9633&show-proto-sidebar=1&hide-ui=1

Desktop: https://www.figma.com/proto/WnlDynuImNeWe0b28BkT1L/Editions-Switch-Banner?node-id=334-13639&t=HqZX6GFk89l8uE5o-0&scaling=min-zoom&page-id=157%3A31814&starting-point-node-id=334%3A13639&show-proto-sidebar=1&hide-ui=1

– You see this if the network front you are on is not the default for the edition you are on – If you click the button, you switch page – if you dismiss it, you stay on the same page – if you then visit that page, you see it again - regardless of whether or not you a) didn't interact, b) clicked OK, or c ) dismissed

Note in particular:

• This bar is to be shown when a user is viewing another network front (not their network front)
• In this situation on the desktop, the Edition switcher on the top right reads just "Edition" instead of "[current] Edition"
• There is a sticky behaviour as the user scrolls.
• Can we put some tracking on the act of clicking any of the buttons please.

Additional features for editorial:

• For internal use only we'd like a way to opt-out of seeing this message. Maybe a url they could visit that sets a long-lived cookie that suppresses this message?
• We'd like to not show this in preview in the fronts tool.

We shouldn't release this without giving editorial a heads-up!

Chat with @ashishpuliyel if you have any questions