Refresh another component after an action

Hi there, I would refresh a navbar component (Cart icon with total of elements inside it) when a product was added to the cart.

Anyone can help me figure out how to do it?

<!-- Component 1: Add to cart button -->
<form sprig s-method="post" s-action="commerce/cart/update-cart">
    <input type="hidden" name="purchasableId" value="{{ variantId }}">
    <button type="submit">Add to cart</button>
</form>

<!-- Component 2: Icon in the navbar with number of items in the cart -->
<div id="cart-icon">
    {{ cart.lineItems|length }}
</div>

[bencroker]

Added a “Refreshing Components” recipe at https://putyourlightson.com/sprig-cookbook#refreshing-components.

[bencroker]

Great!