Resolve "Error while updating todo status: the button is stuck in the loading state"

app/assets/javascripts/pages/dashboard/todos/index/todos.js

@@ -79,10 +79,13 @@ export default class Todos {
       .then(({ data }) => {
         this.updateRowState(target);
         this.updateBadges(data);
-      }).catch(() => flash(__('Error updating todo status.')));
+      }).catch(() => {
+        this.updateRowState(target, true);
+        return flash(__('Error updating todo status.'));
+      });
   }
 
-  updateRowState(target) {
+  updateRowState(target, isInactive = false) {
     const row = target.closest('li');
     const restoreBtn = row.querySelector('.js-undo-todo');
     const doneBtn = row.querySelector('.js-done-todo');
@@ -91,7 +94,10 @@ export default class Todos {
     target.removeAttribute('disabled');
     target.classList.remove('disabled');
 
-    if (target === doneBtn) {
+    if (isInactive === true) {
+      restoreBtn.classList.add('hidden');
+      doneBtn.classList.remove('hidden');
+    } else if (target === doneBtn) {
       row.classList.add('done-reversible');
       restoreBtn.classList.remove('hidden');
     } else if (target === restoreBtn) {

changelogs/unreleased/48222-fix-todos-status-button.yml

+---
+title: Fix the state of the Done button when there is an error in the GitLab Todos
+  section
+merge_request:
+author: marcos8896
+type: fixed