Synchronization visibility on Cristal

Hey everyone, one more quick flow to demonstrate how the system can inform the user about synchronization.

Issue: Loading...

Cristal will always be trying to save changes to the backend. It is mostly a background operation, but it’s important to the user to know when something is happening and especially if something goes wrong.

Here I have a proposal on how these changes and errors could be visualized in the UI. As always, these mockups are using Version A of the Initial Wireframing of Cristal but this UI would work for both of them.

01 - Initial state of the sync status. Everything is synchronized to the backend, as such there’s no indication at all.
CRISTAL-85 01

02 - After the user do some changes to the document, the system will try to sync these with the backend. While doing so, an indicator will appear indicating the status. This indicator should have a tooltip indicating its meaning. (See the “refresh” icon besides the XWiki logo)
CRISTAL-85 02

03 - Even with sidebar closed the status should be visible.
CRISTAL-85 03

04 - In case the changes were successfully saved to the backend, the icon disappears, and the interface is clean again.
CRISTAL-85 04

05 - In case the changes were NOT successfully saved to the backend, the indicator stays in its place, changed to a warning icon, its color should reflect the error. The tooltip on the icon should show the current status. The system should try again after some time, so an interaction from the user is not mandatory. If possible, it would be nice to have a default keybind to see synchronization errors (ctrl+e is proposed here).
CRISTAL-85 05

06 - Accessing the error, a dialog should appear describing the error message to debug. Contents not described here.
CRISTAL-85 06

Thank you all for reading

When you say “synchronization”, what do you refer to?

  1. Is it for the use case when Cristal has been disconnected from its backend, and the user is now reconnecting? In this case, it’s a batch sync, synchronizing all content that was modified when offline. +Int his case I don’t think it’s enough to show the sync status only for the current doc.

  2. Is it for the use case when realtime is used and there are various users in the session, and the sync status is about knowing when the other users have received any local change made? Technical note: will the realtime server give us that info? (ie to know when all users have received the changes)

  3. Is it for some other use case I don’t see? Like for example, viewing a page and when viewing it, someone else makes a change to the same page.

I’m not sure I understand this statement. What would it sync, and when? Are you referring to use case 1) above?

Thanks!

PS: Looks good to me, I’m just missing the context and description of the feature.

I am refering to this jira mainly Loading.... So I guess it’s your first point. But yes, the status should be global and not only about the current opened doc, I need to make this more clear in the description and design page when I create one.

Not just there I think. First we need to decide if the sync icons refers to the sync of the current page only or of all the content to be synced, and if the later, when clicked, it should probably show a global status of the sync with more details (list of pages synced vs pages not yet synced, etc).

I’m not following along the whole thing, so sorry if I say something out of scope.

I guess you already ruled out popup / vanishing boxes / toasts (how are they called?), I mean like in the current XWiki implementation at times a message is shown at the bottom of the screen, have you?
Because those seem a good fit for this.

Of course since there are times where a message should be clickable, toasts should not disappear automatically.