[UserNotification] Add more configuration options

[cavasinf]

Description

The current NotificationEvent is not complete enough to allow devs to do what they want.
Updated it as Tabler 1.0.0-beta20 style.

<?php

namespace App\EventSubscriber;

use KevinPapst\TablerBundle\Event\NotificationEvent;
use KevinPapst\TablerBundle\Helper\Constants;
use KevinPapst\TablerBundle\Model\NotificationModel;
use Symfony\Component\EventDispatcher\EventSubscriberInterface;

class TablerNotificationSubscriber implements EventSubscriberInterface
{
    public static function getSubscribedEvents(): array
    {
        return [
            NotificationEvent::class => ['onSetupNotification', 100],
        ];
    }

    public function onSetupNotification(NotificationEvent $event): void
    {
        $event->title          = 'My custom title';
        $event->emptyTitle     = 'No Item custom title';
        $event->badgeColor     = 'green';
        $event->showBadgeTotal = true;
        $event->maxDisplay     = 7;

        $activeNotification = new NotificationModel('active', 'My active Message', Constants::TYPE_WARNING);
        $activeNotification->setActive(true);
        $event->addNotification($activeNotification);

        // This one will not be showed as it is invalid
        $invalidNotification = new NotificationModel('invalid');
        $event->addNotification($invalidNotification);

        $defaultNotification = new NotificationModel('default', 'My default Message');
        $event->addNotification($defaultNotification);

        $disabledNotification = new NotificationModel('disabled', 'My disabled Message', null);
        $disabledNotification->setDisabled(true);
        $disabledNotification->setBadgeAnimated(false);
        $event->addNotification($disabledNotification);

        $customizeNotification = new NotificationModel('customize', 'Link to Google', Constants::TYPE_SUCCESS);
        $customizeNotification->setBadgeAnimated(false);
        $customizeNotification->setUrl('https://www.google.com');
        $event->addNotification($customizeNotification);

        $htmlNotification = new NotificationModel('html');
        $htmlNotification->setHtml('
            <div class="list-group-item">
                <div class="row align-items-center">
                  <div class="col-auto"><span class="status-dot status-dot-animated bg-red d-block"></span></div>
                  <div class="col text-truncate">
                    <a href="#" class="text-body d-block">Example 1</a>
                    <div class="d-block text-muted text-truncate mt-n1">
                      Change deprecated html tags to text decoration classes (#29604)
                    </div>
                  </div>
                  <div class="col-auto">
                    <a href="#" class="list-group-item-actions">
                      <svg xmlns="http://www.w3.org/2000/svg" class="icon text-muted" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z"></path></svg>
                    </a>
                  </div>
                </div>
            </div>
        ');
        $event->addNotification($htmlNotification);

        $badgeNotification = new NotificationModel('badge');
        $badgeNotification->setHtml('
            <li class="list-group-item d-flex justify-content-between align-items-center">
                Notification with badge
                <span class="badge badge-primary badge-pill">14</span>
            </li>
        ');
        $event->addNotification($badgeNotification);

        $flexBoxNotification = new NotificationModel('flexbox');
        $flexBoxNotification->setHtml('
            <a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
                <div class="d-flex w-100 justify-content-between">
                  <h5 class="mb-1">List group item heading</h5>
                  <small>3 days ago</small>
                </div>
                <p class="mb-1">Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.</p>
                <small>Donec id elit non mi porta.</small>
            </a>
        ');
        $event->addNotification($flexBoxNotification);

        $moreThanMaxNotification =
            new NotificationModel('max', 'Will not be displayed as max notification is set to 7');
        $event->addNotification($moreThanMaxNotification);

        $extraNotification = new NotificationModel('extra', 'One more not displayed');
        $event->addNotification($extraNotification);
    }
}

When there is an Event without any Notification:

public function onSetupNotification(NotificationEvent $event): void
    {
        $event->title          = 'My custom title';
        $event->emptyTitle     = 'No Item custom title';
        $event->badgeColor     = 'green';
        $event->showBadgeTotal = true;
        $event->maxDisplay     = 7;
        
        // simulate no notification
        return;
}

Without any subscriber:

How it is today

With notifications	Without notification	Without subscriber

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Checklist

• I updated the documentation (see here)
• I agree that this code will be published under the MIT license

[cavasinf]

Hey ✋, it's been a while!

[kevinpapst]

Welcome back 😄 👋

I like the proposed changes! Just one thing that should be configurable => display of the menu always vs. only if messages exist.

The rest is feedback on code style. I know that we kinda disagree on certain code styles, but I hope you can live with my wishes. Not your main project, so you don't have to see it every day 😁

[cavasinf]

Waiting for information in #176 (comment)

[kevinpapst]

I agree, that the current approach is messy. The event and interface/model changes should be mostly reverted IMO and re-done.

Not sure if I am able to explain my idea here properly, but I'll try:

• You could add a new NotificationInterface that extends the current one, holding all the new methods
• Change the event (?) and accept both NotificationInterfaces to support both interfaces (maybe that is not necessar, as the new Interface extends the old one)
• Change the template to support both interfaces, e.g. with {% if attribute(notification, 'isHtml') is defined %} new rendering logic {% else %} do as currently {% endif %}

Using this approach would allow to use the current "simple" notification and also the more complex one, that you want/need. And it should not be a BC.

[cavasinf]

OK so:

You could add a new NotificationInterface that extends the current one, holding all the new methods

Done

Change the event (?) and accept both NotificationInterfaces to support both interfaces (maybe that is not necessar, as the new Interface extends the old one)

To be safe, I've added both interfaces in parameter.
If we want, we can add condition to trigger deprecated (commented today, see addNotification())

Change the template to support both interfaces

Instead, all undefined properties from the old interface have default values from twig.
eg : {% if notification.active ?? false %}active{% endif %}

[cavasinf]

At the end, we have two interfaces NotificationV2Interface and NotificationInterface.
If devs have custom model that:

1. extends from NotificationModel, there will be no compatibility issues if they do not have customized properties with the same name as this pull request.
2. implements NotificationInterface, the default values from twig will be used.

BUT if they overwrite the navbar_notifications.html.twig from their project, errors will occur.

---

The only drawbacks are on our side (TablerBundle).
We have NotificationV2Interface that needs to be merge in NotificationInterface later which that mean deprecated before removed.

[kevinpapst]

And now I almost missed the CI Linting failures. Can you run bon/console codestyle-fix?

[cavasinf]

And now I almost missed the CI Linting failures. Can you run bon/console codestyle-fix?

Done 👍
Phpstan too

[kevinpapst]

Thanks 😄