Vuex store changes not reactive in components - vue.js

Question

I have a basic store for inserting and deleting from an array
state: {
assessmentTypes : []
},
mutations: {
setAssessmentTypes(state, assessmentTypes) {
assessmentTypes.forEach(assessmentType => {
state.assessmentTypes.push(assessmentType);
});
},
removeAssessmentType ( state, assessmentTypeId ) {
let assessmentTypeIndex = state.assessmentTypes.map(assessmentType => assessmentType.id).indexOf(assessmentTypeId);
state.assessmentTypes.splice(assessmentTypeIndex, 1)
}
}
I get the state assessmentTypes in computed property in one of my components.
computed:{
assessmentTypes : {
get () {
return this.$store.state.assessmentTypes;
}
}
The problem is I am looping the array in dom for listing a div, but the computed property is not reactive. When I delete or insert a new object into/from the array (through actions), the dom is not rerendering.
Object structure
{
"id": "T7pLDdjmFWAqGiuqB",
"name": "bbb",
"code": "BBB",
"properties": {
combinationOfAssessments: false,
staffCanCreateInstance: false
},
"identifyingContext": {
"semId": "2",
"batchId": "54",
"staffId": "155",
"subjectId": "966",
"subbatchId": "391"
},
"permissions": {
"hod": "1",
"staff": "1"
},
"isActive": "1",
"createdBy": null,
"createdUserName": null,
"createdByUserType": null,
"createdDate": null,
"updatedDate": null,
"updatedBy": null,
"updatedUserName": null,
"updatedByUserType": null,
"propertiesValue": null
}