Problem/Motivation

When using Drupal 11's navigation module, the Commerce menu item in the
toolbar appears without an icon, unlike core menu items (Structure,
Appearance, Configuration, etc.). This creates an inconsistent user experience
in the navigation toolbar.

The navigation module automatically looks for icons but Commerce doesn't
currently define any icon pack or specify an icon in its menu link definition.

Proposed resolution

Add support for the navigation module's icon system by:

1. Creating a commerce.icons.yml file to register the Commerce icon pack
2. Updating commerce.links.menu.yml to specify the cart icon for the main
Commerce menu link

Commerce already includes cart SVG icons in the icons/000000/ directory that
can be reused for this purpose.

Steps to reproduce

1. Install Drupal 11 with the navigation module enabled
2. Install Commerce 3.x
3. Navigate to the admin toolbar
4. Observe that Commerce menu item lacks an icon while other items have icons

Additional context

The cart icon already exists in icons/000000/cart.svg and is suitable for
representing Commerce in the navigation toolbar.

Issue fork commerce-3565263

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

andyg5000 created an issue. See original summary.

andyg5000’s picture

andyg5000’s picture

Status: Active » Needs review

See before/after screenshots for the updates.

jsacksick’s picture

Thank you for this.
What is "cart" referring to from commerce.links.menu.yml:

  options:
    icon:
      pack_id: commerce
      icon_id: cart

I don't see a cart identifier in the commerce.icons.yml.
I'm surprised by the test failures that seem unrelated, but those tests aren't failing in dev which is a bit odd.

stefan.korn made their first commit to this issue’s fork.

stefan.korn’s picture

@jsacksick: cart is referencing an svg icon with file name cart in directory icons/000000/
as per config in commerce.icons.yml

  config:
    sources:
      - icons/000000/*.svg

majmunbog made their first commit to this issue’s fork.

majmunbog’s picture

@stefan.korn It would be better to create a new icon so it matches the rest of the navigation icons as closely as possible. I’ve used the drupal-cart.svg icon with appropriate adjustments and added that in.

  • jsacksick committed 1ee2fe7e on 3.x authored by andyg5000
    feat: #3565263 Add an icon to the navigation module
    
    By: andyg5000
    By:...
jsacksick’s picture

Status: Needs review » Fixed

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

jsacksick’s picture

Merged, thanks everyone! Not sure why the change doesn't work for me on D10, but it does work fine on D11.

stefan.korn’s picture

@jsacksick: API for Icon management is only D11.1.x: https://www.drupal.org/node/3490350

but there should be no regression on D10, just not showing.

@majmunbog: Yes, fine to have a new icon that aligns closely with the other icons.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.