[9.0] [APM][OTel] Fix: Pass telemetry.sdk* data when loading a dashboard (#214356) (#214421)

# Backport

This will backport the following commits from `main` to `9.0`:
- [[APM][OTel] Fix: Pass telemetry.sdk* data when loading a dashboard
(#214356)](https://github.com/elastic/kibana/pull/214356)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT
[{"author":{"name":"jennypavlova","email":"dzheni.pavlova@elastic.co"},"sourceCommit":{"committedDate":"2025-03-13T15:20:17Z","message":"[APM][OTel]
Fix: Pass telemetry.sdk* data when loading a dashboard
(#214356)\n\nCloses #214328 \n\n## Summary\n\nThis PR fixes the issue
with loading an otel native dashboard\n\n## Testing\n- Run ` node
scripts/synthtrace otel_edot_simple_trace.ts`\n- ⚠️ As our test data has
only a java service there is a small manual\nstep needed (it will be
listed below **^**)\n- Open the metrics tab for the service (currently
we don't have
a\ndashboard):\n\n\n![image](https://github.com/user-attachments/assets/e5f1461c-be6f-4d18-9185-7cb25698764b)\n\n\n-
**^** Go to the `dashboard_catalog.ts` and add mapping for otel
native\njava case:\n - first:
`'otel_native-edot-java',`\n\n\n![image](https://github.com/user-attachments/assets/a3463f5b-6db9-466e-95fc-3ccd44a4a016)\n
- second: \n ```js \n case 'otel_native-edot-java': {\n return import(\n
/* webpackChunkName: \"lazyJavaOtelNativeDashboard\" */\n
'./opentelemetry_java.json'\n );\n }\n
``\n\n-\n![image](https://github.com/user-attachments/assets/34c12147-db1e-4494-8ea6-95dffc5975d4)\n\n-
Check the same page after
refresh\n\n![image](https://github.com/user-attachments/assets/e12b7046-9868-421b-9f9e-df004f82ddfc)","sha":"ebe7ef6da0f25b09e1d576e7d8975d7b0b2a95b1","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:fix","backport:prev-minor","backport:prev-major","Team:obs-ux-infra_services","v9.1.0"],"title":"[APM][OTel]
Fix: Pass telemetry.sdk* data when loading a
dashboard","number":214356,"url":"https://github.com/elastic/kibana/pull/214356","mergeCommit":{"message":"[APM][OTel]
Fix: Pass telemetry.sdk* data when loading a dashboard
(#214356)\n\nCloses #214328 \n\n## Summary\n\nThis PR fixes the issue
with loading an otel native dashboard\n\n## Testing\n- Run ` node
scripts/synthtrace otel_edot_simple_trace.ts`\n- ⚠️ As our test data has
only a java service there is a small manual\nstep needed (it will be
listed below **^**)\n- Open the metrics tab for the service (currently
we don't have
a\ndashboard):\n\n\n![image](https://github.com/user-attachments/assets/e5f1461c-be6f-4d18-9185-7cb25698764b)\n\n\n-
**^** Go to the `dashboard_catalog.ts` and add mapping for otel
native\njava case:\n - first:
`'otel_native-edot-java',`\n\n\n![image](https://github.com/user-attachments/assets/a3463f5b-6db9-466e-95fc-3ccd44a4a016)\n
- second: \n ```js \n case 'otel_native-edot-java': {\n return import(\n
/* webpackChunkName: \"lazyJavaOtelNativeDashboard\" */\n
'./opentelemetry_java.json'\n );\n }\n
``\n\n-\n![image](https://github.com/user-attachments/assets/34c12147-db1e-4494-8ea6-95dffc5975d4)\n\n-
Check the same page after
refresh\n\n![image](https://github.com/user-attachments/assets/e12b7046-9868-421b-9f9e-df004f82ddfc)","sha":"ebe7ef6da0f25b09e1d576e7d8975d7b0b2a95b1"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/214356","number":214356,"mergeCommit":{"message":"[APM][OTel]
Fix: Pass telemetry.sdk* data when loading a dashboard
(#214356)\n\nCloses #214328 \n\n## Summary\n\nThis PR fixes the issue
with loading an otel native dashboard\n\n## Testing\n- Run ` node
scripts/synthtrace otel_edot_simple_trace.ts`\n- ⚠️ As our test data has
only a java service there is a small manual\nstep needed (it will be
listed below **^**)\n- Open the metrics tab for the service (currently
we don't have
a\ndashboard):\n\n\n![image](https://github.com/user-attachments/assets/e5f1461c-be6f-4d18-9185-7cb25698764b)\n\n\n-
**^** Go to the `dashboard_catalog.ts` and add mapping for otel
native\njava case:\n - first:
`'otel_native-edot-java',`\n\n\n![image](https://github.com/user-attachments/assets/a3463f5b-6db9-466e-95fc-3ccd44a4a016)\n
- second: \n ```js \n case 'otel_native-edot-java': {\n return import(\n
/* webpackChunkName: \"lazyJavaOtelNativeDashboard\" */\n
'./opentelemetry_java.json'\n );\n }\n
``\n\n-\n![image](https://github.com/user-attachments/assets/34c12147-db1e-4494-8ea6-95dffc5975d4)\n\n-
Check the same page after
refresh\n\n![image](https://github.com/user-attachments/assets/e12b7046-9868-421b-9f9e-df004f82ddfc)","sha":"ebe7ef6da0f25b09e1d576e7d8975d7b0b2a95b1"}}]}]
BACKPORT-->

Co-authored-by: jennypavlova <dzheni.pavlova@elastic.co>

x-pack/solutions/observability/plugins/apm/public/components/app/metrics/index.tsx

@@ -60,6 +60,8 @@ export function Metrics() {
     return (
       <JsonMetricsDashboard
         agentName={agentName}
+        telemetrySdkName={telemetrySdkName}
+        telemetrySdkLanguage={telemetrySdkLanguage}
         runtimeName={runtimeName}
         serverlessType={serverlessType}
         dataView={dataView}