[Log Explorer] Add timed toast message to collect on-boarding feedback

[weltenwort]

📓 Summary

We want to be able to gather user feedback from the new logs on-boarding flow. As a first step, we want to show a toast message in the Log Explorer.

• 🔗 related to: [Log Explorer] Add specialized locators #158382

✔️ Acceptance criteria

• The locator used to navigate from the on-boarding screens to the Log Explorer has an optional origin property.
• The property is forwarded to the Log Explorer upon navigation (e.g. via the location state or the unresolved selection state).
• The property is typed such that...
  • the only allowed value for that origin indicates the on-boarding flow.
  • the value can be extended into a tagged union in which each member can carry additional parameters.
• That origin property is set to the on-boarding-related value when used on the on-boarding page.
• There is a state machine in the observability log explorer, that interprets the origin property such that three minutes after navigating with the on-boarding-related origin value set a toast is shown.
• The toast solicits user feedback as shown in the mock-up.
• The survey URL is shared with the feedback button on the on-boarding page.
• The toast is not shown under any other condition.

flowchart TD

uninitialized(Uninitialized)
init_location(Initializing From Location)
init_waiting(Waiting)
init_done(Initialized)

uninitialized -->|always| init_location
init_location -->|is not an on-boarding origin| init_done
init_location -->|is an on-boarding origin| init_waiting
init_waiting -->|after 3 mins, show toast| init_done
init_waiting -->|change selection| init_done

Loading

🎨 Mock-ups

💡 Implementation hints

• The time-based toast is just the first step. In the future it will be tied into the loading state of the discover grid, so that it's not shown too late or early.
• For inspiration/illustration purposes, the origin property on the locator could be typed similar to this:

    type ObservabilityLogExplorerLocatorOrigin =
      | {
        id: 'application-log-onboarding';
      }
      | {
        id: 'new-route-creation';
        sourceIntegrationName: string;
        sourceDatastreamName: string;
      }

[elasticmachine]

Pinging @elastic/infra-monitoring-ui (Team:Infra Monitoring UI)

[tonyghiani]

Thanks for these specifications Felix, just a quick question regarding the flowchart:
when the origin is the onboarding and we move into the Waiting state, there are two possible transitions:

• wait 3 minutes, then show the toast
• change selection

I don't understand if initialized represents the feedback toast status, and if we should display the toast on a selection change (which I interpreted as a user selecting a dataset, am I misunderstanding?).

Regarding having this toast shown only once, do we want to flag it as "seen" and hide it once the user explicitly clicks the cross icon or takes the survey? Shall we display it again if they ignore it?