RFC: Improved Document Meta Bar

[tylandavis]

Overview

As noted in our community call last week, we are introducing a new component into the meta bar for viewing/modifying a documents location with Folders enabled. Because of this change, we want to improve the meta bar to better use the space and improve the UX.

Proposed Design:

Key Changes

• Move created and updated timestamps to kebab menu.
  • In the kebab menu, these will always be easily accessed no matter the breakpoint or if you've scrolled down the page, but taking up much less space.
• Update autosave indicator
  • We plan to add a loading spinner and checkmark for more obvious saving/saved states when autosave is enabled. This component will also makes it easier to see when a document was last updated at glance.
• Revised status indicator
  • Using the labels Draft, Published, and now Changed since published to better describe the state of documents.
  • Opening the dropdown will give you the ability to manage the documents status, i.e. if the document is Changed since published you can Unpublish or Revert to published.
  • If using scheduled publish, you will now see a blue clock icon to denote that the document has upcoming events. Inside the dropdown you will see the next upcoming event and the clicking it will open the drawer to edit the schedule.
• Responsiveness
  • At small viewport width, switch the autosave indicator to just show icons with tooltip labels.
  • Move preview button to kebab menu.

We'd love to hear your feedback on the proposed design. Keep in mind this will be implemented in a minor release, so broader changes to the functionality could be out of scope for now, but any feedback on the UX/DX of customizing the admin panel is always appreciated!