Skip to content

Integrated help events

Product tour events

The following event is dispatched when rendering a product tour scenario.

Event Dispatched by
RenderProductTourScenarioEvent Ibexa\IntegratedHelp\Renderer\ProductTourRenderer::render()

RenderProductTourScenarioEvent

TODO: Move to "Customize product tour?" Maybe it's a better place

This event is dispatched before rendering a product tour scenario and you can use it to:

  • Modify tour steps based on user permissions or roles
  • Add or remove steps dynamically
  • Change block content based on runtime conditions
  • Integrate custom data into tour scenarios

With the following example, the scenario is modified to trigger only when certain conditions are matched. When the current user has a pending notification, a custom onboarding scenario is triggered.

First, define a custom product tour scenario. It contains a placeholder step with a single block.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
ibexa:
    system:
        default:
            product_tour:
                notifications:
                    type: 'targetable'
                    steps:
                        placeholder_step:
                            step_title_translation_key: 'This is a placeholder step'
                            target: '.ibexa-header-user-menu__notifications-toggler'
                            blocks:
                                - type: text
                                  params:
                                      text_translation_key: 'This is a placeholder block, modified during event subscriber execution'

Then, create a subscriber modifying the scenario.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<?php

declare(strict_types=1);

namespace App\EventSubscriber;

use Ibexa\Contracts\Core\Repository\NotificationService;
use Ibexa\Contracts\IntegratedHelp\Event\RenderProductTourScenarioEvent;
use Ibexa\IntegratedHelp\ProductTour\Block\LinkBlock;
use Ibexa\IntegratedHelp\ProductTour\Block\TextBlock;
use Ibexa\IntegratedHelp\ProductTour\ProductTourStep;
use Symfony\Component\EventDispatcher\EventSubscriberInterface;

final class NotificationScenarioSubscriber implements EventSubscriberInterface
{
    private NotificationService $notificationService;

    public function __construct(NotificationService $notificationService)
    {
        $this->notificationService = $notificationService;
    }

    public static function getSubscribedEvents(): array
    {
        return [
            RenderProductTourScenarioEvent::class => ['onRenderScenario'],
        ];
    }

    public function onRenderScenario(RenderProductTourScenarioEvent $event): void
    {
        $scenario = $event->getScenario();
        $steps = $scenario->getSteps();

        if ($scenario->getIdentifier() !== 'notifications') {
            return;
        }

        foreach ($steps as $step) {
            $scenario->removeStep($step);
        }

        if (!$this->hasUnreadNotifications()) {
            return;
        }

        $customStep = new ProductTourStep();
        $customStep->setIdentifier('custom_step_identifier');
        $customStep->setInteractionMode('clickable');
        $customStep->setTarget('.ibexa-header-user-menu__notifications-toggler');
        $customStep->setTitle('You have unread notifications');
        $customStep->addBlock(new TextBlock('Click here to preview your unread notifications.'));
        $customStep->addBlock(new LinkBlock(
            'https://doc.ibexa.co/projects/userguide/en/latest/getting_started/notifications/',
            'Learn more about notifications'
        ));

        $scenario->addStep($customStep);
    }

    private function hasUnreadNotifications(): bool
    {
        return $this->notificationService->getPendingNotificationCount() > 0;
    }
}

The subscriber executes the following actions:

  • makes sure the correct scenario is being processed
  • removes all the existing scenario steps
  • verifies that the current user has a pending notification
  • adds a custom clickable step to highlight the unread notification

TODO: Screenshot here