Mutation for notifications in Vue.js

Question

I have a store for notifications in my application. I can load all notifications and mark one notification as read. I wrote actions and mutations for each case. The last action is for marking all notifications as read but I am struggling with writing a mutation for this (commented part).

const actions = {
  notifications(context) {
    document.client
      .get_notifications()
      .then(ca => {
        S_Helper.cmt_data(ca, "load_notifications", this);
      })
      .catch(error => {
        ClientAlert.std_fail_with_err(error);
      });
  },

  readNotification(id, params) {
    document.client
      .read_notification({ id, params })
      .then(ca => {
        if (ca.is_success()) {
          context.commit("mark_notification", id);
        } else {
          ClientAlert.std_fail();
        }
      })
      .catch(error => {
        ClientAlert.std_fail_with_err(error);
      });
  },
  readAllNotifications(context, params) {
    params = params || {};
    document.client
      .read_all_notifications(params)
      .then(ca => {
        if (ca.is_success()) {
          context.commit("mark_all_notifications", this);
        } else {
          ClientAlert.std_fail();
        }
      })
      .catch(error => {
        ClientAlert.std_fail_with_err(error);
      });
  }
};

const mutations = {
  load_notifications(context, data) {
    context.notifications = data;
  },
  mark_notification(state, id) {
    let new_data = state.notifications.map(function(element) {
      if (!!element.id && element.id === id) {
        element.viewed = true;
      }
      return element;
    });
    state.notifications = new_data;
  }
  //mark_all_notifications(context, data) {
  //}
};

Answer 1

  mark_all_notifications(state, data) {
    state.notifications = state.notifications.map(notification => {
      notification.viewed = true
      return notification
    })
  }

A simple map should work.