feature: Optimistic update for starred:

This commit is contained in:
Paulo Gustavo Veiga 2021-03-02 18:02:08 -08:00
parent 84d42c73a0
commit 1c65e4e3fc
2 changed files with 17 additions and 12 deletions

View File

@ -335,23 +335,28 @@ export const MapsList = (props: MapsListProps): React.ReactElement => {
event.stopPropagation(); event.stopPropagation();
}; };
}; };
9
const starredMultation = useMutation<void, ErrorInfo, number>( const starredMultation = useMutation<void, ErrorInfo, number>(
(id: number) => { (id: number) => {
const map = mapsInfo.find((m) => m.id == id); const map = mapsInfo.find((m) => m.id == id);
if(!map){ const starred = !(map?.starred);
console.error(`Map ${id} could not be found.`);
console.error(`MapsInfo ${mapsInfo} list`);
}
console.debug(`Starred value map?.starred: ${map?.starred}`);
return client.updateStarred(id, !(map?.starred)); // Follow a optimistic update approach ...
queryClient.setQueryData<MapInfo[]>('maps', mapsInfo => {
if (map) {
map.starred = !map.starred;
}
return mapsInfo || [];
});
return client.updateStarred(id, starred);
}, },
{ {
onSuccess: () => { onSuccess: () => {
queryClient.invalidateQueries('maps'); queryClient.invalidateQueries('maps');
}, },
onError: (error) => { onError: (error) => {
queryClient.invalidateQueries('maps');
console.error(error); console.error(error);
}, },
} }

View File

@ -70,4 +70,4 @@ export const activeInstanceStatus = (state: any): ClientStatus => {
}; };
export const { sessionExpired } = clientSlice.actions; export const { sessionExpired } = clientSlice.actions;
export default clientSlice.reducer; export default clientSlice.reducer;'