Mutation and update cache

Open src/app/Todo/TodoPrivateList.ts and update the clearCompleted function as below

src/app/Todo/TodoPrivateList.ts

Copy
clearCompleted() {

+  // Remove all the todos that are completed
+  const CLEAR_COMPLETED = gql`
+    mutation clearCompleted {
+      delete_todos(where: {is_completed: {_eq: true}, is_public: {_eq: false}}) {
+        affected_rows
+      }
+    }
+  `;
+
+   this.apollo.mutate({
+     mutation: CLEAR_COMPLETED,
+     optimisticResponse: {},
+     update: (cache, { data }) => {
+         const existingTodos : any = cache.readQuery({ query: GET_MY_TODOS });
+         const newTodos = existingTodos.todos.filter(t => (!t.is_completed));
+         cache.writeQuery({query:GET_MY_TODOS, data: {todos: newTodos}});
+     },
+     })
+     .subscribe(
+       ({ data }) => {
+           console.log('got data ', data);
+       },
+       (error) => {
+           console.log('there was an error sending the query', error);
+       }
+     );
}

That's a wrap of the todo app.