Icons for Actions

[pedro-santiago]

Context

When having several actions (let's say more than 30) for a resource, it's rather difficult to differentiate one from another. One of ways we came across to make it better for our users is to define custom Icons (and grouping) for actions. This way they can improve their visual mnemonics and have less chance to miss click.

Idea of Implementation

• Each action would have a icon method, that is a getter for private string $icon attribute, defined on the main Action class. This way we follow current patterns.
• This icon name would be passed along when loading the action from API (as we do for labels).
• We use the <Icon :type= directive to dynamically load them.

In our case we have also created an Enum to avoid our developers to try icons that don't exist.

[bkuhl]

I would love to see something like this. I think it may also be helpful if a given resource could have some kind of hot bar on the detail page where actions can be trigger just by clicking their icon.

[bkuhl]

One approach that might be valuable here is to use the spatie/emoji package. You could customize an action's name() to make use of an Emoji. I use it on Resource indexes to communicate the status of certain things. You could customize an action's name() to make use of an Emoji. Here's an example of how I use it:

            Stack::make('Game', [
                Line::make('Name', 'name'),
                Line::make('Icons')->resolveUsing(function () {
                    return collect([
                            Emoji::brokenHeart() => $this->model()->isBroken(),
                            Emoji::zzz() => !$this->model()->expectsUpdates(),
                            Emoji::whiteExclamationMark() => $this->model()->expectsUpdates(),
                        ])
                        ->filter()
                        ->keys()->join(' ');
                })->asSmall(),
            ]),