Fix progress bar on cart page

[AylinUenal]

Description

This PR fixes two issues:

1. When adding a product to an empty cart and navigating to the cart, for a short moment the empty cart display was shown while fetching the data.
2. When changing the quantity of a cart item, the loading bar vanished too early while the prices were still updating.

• Bug Fix 🐛 (non-breaking change which fixes an issue)
• Enhancement 🚀 (non-breaking change which adds functionality)
• Breaking Change 💥 (fix or feature that would cause existing functionality to not work as expected)
• Polish 💅 (Just some cleanups)
• Internal 🏠 Only relates to internal processes.

How to test it

1. add product to empty cart
2. quickly navigate to cart
3. loading bar and empty page should be shown while fetching data (no empty cart component is shown)

---

1. open cart
2. edit quantity of an item
3. loading bar should be shown until prices have updated

[fkloes]

Instead bypassing the bug by introducing additional complexity i'd prefer to fix the system that's implemented to toggle the progress bar.

The source of the bug is located inside the cart subscriptions. The cartIdle$ stream is used to reset the loading bar. Right now it emits whenever a request is finished that modifies products, coupons or updates the cart. Since e.g. an updateProducts request triggers re-fetching of the cart, it's finished before the fresh cart is received, the loading bar is removed before the cart was fetched.

I propose the following change:

  const cartIdle$ = cartReceived$.merge(
    couponsUpdated$.switchMap(() => cartReceived$.first()),
    productsUpdated$.switchMap(() => cartReceived$.first())
  );

So when products or coupons are updated, cartIdle$ not emits until the cart is fetched.