[APM] add view in apm button to alert details page

[dominiqueclarke]

Summary

Relates to #184204
Relates to #184236

After adding the View in APM buttons to APM alert details visualizations, a bug was introduced where the share plugin was not available in the codepath.

This was due to using the useAPMPluginContext hook. APM plugin context does not exist within the observability plugin where this component is rendered.

The use of useAPMPluginContext did work when using the visualization embeddables, because they are wrapped in context, but when using the visualizations on their own, such as in the APM latency alert details page, the experience was broken.

To fix the experience, we added some defensive code and hid the button when the share plugin was not available.

Now, we want to introduce a permenant fix to re-introduce the View in APM button the APM alert details visualization. This fix uses useKibana rather than useAPMPluginContext to gain access to the share plugin.

SLO APM latency SLI alert details

SLO APM error rate SLI alert details

APM latency alert details

Testing

Both the APM SLO burn rate rules and the APM latency rules should be tested in this PR

1. Generate APM test data. For example, you can use node scripts/synthtrace simple_trace --live
2. Create an APM latency rule with the threshold that will trigger an alert
3. Navigate to the alert details page
4. Ensure the page loads and the View in APM button appears
5. Click on the View in APM button to ensure it navigates to APM appropriately
6. Create an APM latency SLI within the SLO app. Choose a threshold that will trigger a low SLI value
7. Wait for a burn rate alert to fire (the rule is created automatically)
8. Navigate to the alert details page. Ensure the page loads and the View in APM button appears
9. Click on the View in APM button to ensure it navigates to APM appropriately
10. Repeat steps 6 to 9 with the APM error rate SLI within the SLO app.

[dominiqueclarke]

/ci

[apmmachine]

🤖 GitHub comments

Expand to view the GitHub comments

Just comment with:

• /oblt-deploy : Deploy a Kibana instance using the Observability test environments.
• run docs-build : Re-trigger the docs validation. (use unformatted text in the comment!)

[dominiqueclarke]

/ci

[elasticmachine]

Pinging @elastic/obs-ux-infra_services-team (Team:obs-ux-infra_services)

[elasticmachine]

Pinging @elastic/obs-ux-management-team (Team:obs-ux-management)

[crespocarlos]

LGTM

[crespocarlos]

This is confusing but we're already doing the same in failed_transaction_chart.tsx, x-latency_chart.tsx and throughput_chart.tsx

[kibana-ci]

💛 Build succeeded, but was flaky

• Buildkite Build
• Commit: ddcf331

Failed CI Steps

• FTR Configs #63

Test Failures

• [job] [logs] FTR Configs #63 / Dataset quality API tests integrations/integrations.spec.ts basic Integration gets the installed integrations returns only log based integrations and its datasets map

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
apm	3.5MB	3.5MB	+30.0B

History

• 💚 Build #214289 succeeded fbc23aa
• 💚 Build #213884 succeeded 7edf329
• 💔 Build #213717 failed 6ca9ee1

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream