The old value comes back into the input field.
I had initialized this.props.house.rent (which is the old value coming back) with input field value this.state.rent (user entered value) but I cannot do it as it becomes antipattern syntax, you can see it in below comments of code.
cacheUpdate = (cache, { data: { updateHouse } }) => {
const data = cache.readQuery({
query: QUERY_CONFIRM_QUERY,
variables: { id: this.props.confirmId },
});
const houses = data.queryConfirm.houses;
const prevHouse = this.props.house;
//prevHouse.rent = this.state.rent; // this.state.rent is user entered input value
const updatedHouses = houses.map(house => {
if (house.id === prevHouse.id) {
const updatedHouseItem = _.pickBy(updateHouse, _.identity);
return { ...prevHouse, ...updatedHouseItem };
}
return house;
});
data.queryConfirm.houses = updatedHouses;
cache.writeQuery({
query: QUERY_CONFIRM_QUERY,
variables: {
id: this.props.confirmId,
},
data,
});
};
I want the old value to be removed from readQuery or writeQuery of cache.
Hope this helps someone. Ooof..I think a lot, it was simple actually. I thought to make callback, but not possible as values are coming from database. Anyways, in conclusion simple look at the value of data.queryConfirm.houses in the console and assign the required array like, say I required was data.queryContact.houses[0].rent and initialize it to this.state.rent. That's all.