Nav With Wishlist Count

About this block

Nav With Wishlist Count promotes the wishlist heart to a first class nav icon with a count badge (3) sitting beside cart and account, and a primary dot that appears when a watched price drops. A slim strip below the bar explains the dot state plainly: Field Tote, Whiskey dropped from $185 to $159 since you saved it, the alert email went out at 06:00.

The nav links array is the only data. The dot and strip are rendered in static state; live badge counts and price drop detection are wired in the consuming app.

When to use

Reach for this block when the store has a functioning wishlist with price drop alerts. The dot strip is only shown while at least one watched item has a live drop, the strip should be conditional in production.

A natural flow around it on an Ecommerce Pro page:

Before

• Nothing, this is the topmost element on the page.

After

• Wishlist sections
• Restock sections

What you can display

One strong use is the heart with count and price drop dot. Other wishlist nav states:

• Empty wishlist. Heart with no badge, no dot, the quiet invite to save items.
• Drop resolved. Dot cleared after the customer views the drop, the strip gone.
• Multiple drops. Strip listing two dropped items, both with deltas shown.

Tip: naming the specific item and price movement in the strip (“dropped from $185 to $159”) makes the alert concrete; a generic price drop notification trains customers to ignore it.