How best to handle errors when updating optimistically?

[cmacdonnacha]

This is really a UX question but I thought I get your insights anyway.

How would you guys normally handle errors when performing optimistic updates if the user had to submit some information? Consider the following scenario:

1. User enters text into todo field
2. User clicks submit
3. Through optimic updates the todo is adding to the todos list

If an error occurs here we can revert/remove the new todo from the list and that's fine but wouldn't the user be a bit annoyed that they have to now go and enter the text all over again? This wouldn't be a huge deal for todos but if you consider something longer like editing a blog post it could become very annoying. Just wondering how you guys handle this scenario really?

[TkDodo]

If it's a blog post, just don't delete the value from the input field, like the optimistic update example does it. Keep the value, maybe disable the field to disallow further editing. Clear the value onSuccess, and onError do the rollback and just enable the field again.

[cmacdonnacha]

Thanks for that. So let's say you display a popup modal to enter some details, would you suggest clearing the fields and closing the modal only on success? I thought the whole point of optimistic updates was that we give the appearance that the item was added straight away instead of waiting for the server to respond before updating the UI? Perhaps we could still close the modal but re-open if there's an error or something like that. Same would go for a blog post, usually you'd re-direct from /new route to /blogs after clicking "save".

[TkDodo]

So let's say you display a popup modal to enter some details, would you suggest clearing the fields and closing the modal only on success?

This is the current ux we are providing when working with modals. The Apply button will be disabled and it gets a loading spinner while the mutation is running, and we close the modal with a success toast afterwards, or we keep the modal open with an error toast.
Closing and re-opening the modal feels like a sub-optimal ux, but this is personal preference.

I agree that this is not optimistic updates, so it's not what you asked for :) Optimistic updates have pros and cons, as everything. I update optimistically if:

• the operation is very likely to succeed
• if the operation fails, it is easy to re-do the operation.

[cmacdonnacha]

Well that is a perfect reply. Thanks for taking the time to discuss this with me 👍