[AO] - Make Alert summary fields in the Alert Details page dynamic (e…

…lastic#152443)

## Summary

It closes elastic#147078

[UPDATED SCREENSHOT] include the APM Latency rule-specific fields. 

<img width="1162" alt="Screenshot 2023-03-06 at 11 52 25"
src="https://user-images.githubusercontent.com/6838659/223090293-d8853aed-c787-47b5-81a6-4491fb3edba8.png">

## For APM reviewers 
- Not all alerts share the same fields/data (based on the rule
definition). The
[alert_details_app_section.tsx](https://github.com/elastic/kibana/pull/152443/files#diff-9ce6d23c878801afca7932bd0e272492b79931d51d8e61361d9bc56bf581657d)
page of each rule will use the `setAlertSummaryFields` callback function
(introduced in this PR) to send fields that are needed to be shown on
the AlertSummay. The AlertSummary will show these rule-specific fields
alongside the five basic/shared fields across all the rule types.

- 🌟 I refactored the code. Now each chart lives in its separate file
with its related hooks.
- Added **Service name** and **Service environment** to the AlertSummary

## For Actionable Observability reviewers
The AlertSummary component is now dynamic. It means it accepts
additional fields to be shown via a new prop and combines them with the
five basic/shared fields across all the rule types.

### Checklist
- [x] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

x-pack/plugins/apm/public/components/alerting/rule_types/register_apm_rule_types.ts

@@ -54,10 +54,7 @@ export function registerApmRuleTypes(
       errors: [],
     }),
     alertDetailsAppSection: lazy(
-      () =>
-        import(
-          '../ui_components/alert_details_app_section/alert_details_app_section'
-        )
+      () => import('../ui_components/alert_details_app_section')
     ),
     requiresAppContext: false,
     defaultActionMessage: errorCountMessage,
@@ -94,10 +91,7 @@ export function registerApmRuleTypes(
       errors: [],
     }),
     alertDetailsAppSection: lazy(
-      () =>
-        import(
-          '../ui_components/alert_details_app_section/alert_details_app_section'
-        )
+      () => import('../ui_components/alert_details_app_section')
     ),
     requiresAppContext: false,
     defaultActionMessage: transactionDurationMessage,
@@ -132,10 +126,7 @@ export function registerApmRuleTypes(
       errors: [],
     }),
     alertDetailsAppSection: lazy(
-      () =>
-        import(
-          '../ui_components/alert_details_app_section/alert_details_app_section'
-        )
+      () => import('../ui_components/alert_details_app_section')
     ),
     requiresAppContext: false,
     defaultActionMessage: transactionErrorRateMessage,
@@ -167,10 +158,7 @@ export function registerApmRuleTypes(
       errors: [],
     }),
     alertDetailsAppSection: lazy(
-      () =>
-        import(
-          '../ui_components/alert_details_app_section/alert_details_app_section'
-        )
+      () => import('../ui_components/alert_details_app_section')
     ),
     requiresAppContext: false,
     defaultActionMessage: anomalyMessage,