Refresh the Cart from the Backend - spartacus-storefront

Question

We have some custom functions for managing the Cart (add entries, remove cart etc.) which often times takes place in the backend.
I am searching for a way to refresh the cart in Spartacus so that it can show the actual data without the need of reloading the whole page. This is noticeable in the Minicart count as well as when we navigate to the cartpage. There you can see that the Data is not up to date. When you reload the page (F5) then the right data gets loaded.
Does someone have any idea how to force reload the "current" cart? I say current, cause when we remove the cart in the backend, we would expect that "hidden" method to create a new cart and give that back to Spartacus without reloading the page.
I found some sort of solution which feels kinda wonky and somehow does not work 100%:
refreshCart(): void {
this.getUser().pipe(
map((usr) => {
return usr;
}),
map(usr => {
this.cartService.reloadCart(usr, "");
}
)
).subscribe()
}
getUser(): Observable<string | undefined> {
return this.userIdService.getUserId().pipe(
map((userid) => {
return userid;
})
);
}
We extended the ActiveCartService and added a new method "reloadCart" which loos like the follwing:
reloadCart(userId: string, cartId: string): void {
this.loadOrMerge(cartId, userId, userId);
}
Please note that this is my first Angular Project and i feel that i miss some of the concepts (most noticeable i struggle with the whole Observables / subscribe / pipe / map and everything surrounding that).
Thank you in advance.

Answer 1

Not sure what spartacus version you are using, but I believe it applies to most of the versions.
To force a reload of the cart, you can use the MultiCartService to use the loadCart method.
Or if you don't want to use the actual service, you can always dispatch the action on your custom service, which what the loadCart method does from MultiCartService. You just need to provide the userId and cartId.
new CartActions.LoadCart({
userId,
cartId,
})