[Icons] New console command to manage local icons.

[xDeSwa]

Q	A
Bug fix?	no
New feature?	yes
Deprecations?	no
Documentation?	yes
Issues	#
License	MIT

Summary

This PR introduces a new Symfony console command ux:icons:manage, designed to simplify the management of locally stored icons within the project.
It provides flexible options to list, group, and safely remove unused icons.

Usage Examples

    # Lists all icons found in the local icon directory.Can be combined with `--table` or `--group`
    $ php bin/console ux:icons:manage --list

    # List all unused Icons in templates. Can be combined with `--table` or `--group`
    $ php bin/console ux:icons:manage --list --unused

    # Removes a specific icon by name (2 methods)
    $ php bin/console ux:icons:manage --remove=flowbite:user-solid
    $ php bin/console ux:icons:manage --remove user-profile

    # Deletes all icons that are not detected as used in templates. (Use with caution)
    $ php bin/console ux:icons:manage --remove --unused

    # Deletes *all* local icons from the directory. (Use with extreme caution)
    $ php bin/console ux:icons:manage --remove-all

Screenshots

All Icons List example

Unused List example

Unused List Table view example

Unused List Group view example

[Kocal]

Hey, and thanks for your contribution!

I quickly looked at your PR and I think it will be easier if your options --list, --remove, --remove-all would be in fact a single argument action allowing values list, remove, and remove-all.

Also, I'm bit afraid about all these new logic for searching used/unused icons in templates or icons dir. I don't know Icons internals, but this kind of logic does not already exist?

I will take more time soon to better review your PR.

Thanks!

[xDeSwa]

public function icons(): array
    {
        $found = [];

        // https://regex101.com/r/WGa4iF/1
        $token = '[a-z0-9]+(?:-[a-z0-9]+)*';
        $pattern = "#(?:'$token:$token')|(?:\"$token:$token\")#i";

        // Extract icon names from strings in app templates
        foreach ($this->templateFiles($this->twig->getLoader()) as $file) {
            $contents = file_get_contents($file);
            if (preg_match_all($pattern, $contents, $matches)) {
                $found[] = array_map(fn ($res) => trim($res, '"\''), $matches[0]);
            }
        }
        $found = array_merge(...$found);

        // Extract prefix-less SVG files from the root of the icon directory
        if (is_dir($this->iconDirectory)) {
            $icons = (new Finder())->files()->in($this->iconDirectory)->depth(0)->name('*.svg');
            foreach ($icons as $icon) {
                $found[] = $icon->getBasename('.svg');
            }
        }

        return array_unique($found);
    }

Here is my understanding of the current behavior of the icons() method and why I proposed an additional function.

The existing implementation correctly detects:

Icons that are used in Twig templates with a prefix, for example:

{{ ux_icon('svg-spinners:bars-scale-fade') }}

SVG files that exist directly in the root of the configured icon directory.

However, as far as I can see, the current regex only matches icon names in the form prefix:name (containing a colon). Because of that, icons that are used without a prefix — for example:

{{ ux_icon('symfony') }}

are not detected at all, even if they exist in the filesystem.

To address this, I introduced an additional helper that scans Twig templates and extracts all icon usages, including prefix-less ones. This allows the command to return a complete list of icons referenced in the project.

Can you give examples of command arguments?

Thanks.

[smnandre]

Wow, lot of work here! 🙇

Couple of quick comments: let's not confuse the cache warmer (looking at everything that could be an icon) and the whole component :)

There is no way to statically ensure an icon is not used, as we can use variables and context-related names in the component.

So "unused" seems pretty definitive to me and may confuse users with very legitimate usage.

An exemple I frequently use in my projects:

<twig:ux:icon name="circle-flags:{{ user.country }}" />

I'm not at ease with the remove commands to be honest, as I'm not sure of the pros/cons balance 😅

You said

This PR introduces a new Symfony console command ux:icons:manage, designed to simplify the management of locally stored icons within the project.

And I wonder if calling this command ux:icons:local may in fact be more precise and avoid misunderstandings?

Then I would agree with @Kocal: maybe we could use the first argument as a "command"?

• ux:icons:local list
• ux:icons:local find
• ux:icons:local clear

wdyt?

[xDeSwa]

<twig:ux:icon name="circle-flags:{{ user.country }}" />

does not include such dynamically used icons in the list and icons that have not been downloaded locally cannot be included in these lists.

I added a warning note about this in the documentation.

[smnandre]

The scenario I d really like to avoid is:

• I manually add some icons to a project
• the command marks them as "unused"
• the user feels safe / inclined running “delete unused”

:)

ux:icons:manage could also add to the confusion (this was the combined reason I suggested to use ux:icons:local as name)

[xDeSwa]

Hello again,
I wasn't aware of the danger of deleting dynamic icons with the unused parameter. So I made some changes.

These changes include:
{{ ux_icon('a:b:c:d:e:icon_file') }} can also scan and process subfolders like a->b->c->d.

Screenshots are below. If this makes sense, I'll update the PR.
@smnandre @Kocal
Thanks

All Command List

php bin/console ux:icons:local list
php bin/console ux:icons:local info bi:check
php bin/console ux:icons:local remove bi:check
php bin/console ux:icons:local remove-all

Help Menu

Single Icon Info

Local Icon List