[APM] Display numeric labels at the top of metadata section (#151575)

We already display `labels` at the top of metadata to make them easy to
find. Recently APM Server split out numeric labels so they are located
separately from string labels. This means that the following will create
one numeric label `numeric_labels.time_range_duration`, and one string
label `labels.app`.

```ts
transaction.addLabels({ time_range_duration: 123, app: 'apm' });
```

Right now the numeric labels section is far down on the metadata list,
making it hard to find (I missed it and didn't understand what was going
on).


![image](https://user-images.githubusercontent.com/209966/219943397-2c9fe2fe-89be-4c9b-8007-0986ed6d4b94.png)
...

![image](https://user-images.githubusercontent.com/209966/219943400-80442b60-33e7-4275-a110-d592f4b12d60.png)


**Change in this PR**
This PR moves the the `numeric_labels` to the top of Metadata, just
below the `labels` section.

<img width="1443" alt="image"
src="https://user-images.githubusercontent.com/209966/219975299-709ab77f-8ad7-42c0-9fe5-cbcdb7393c78.png">

x-pack/plugins/apm/public/components/shared/metadata_table/helper.ts

@@ -43,7 +43,7 @@ export const getSectionsFromFields = (fields: Record<string, any>) => {
 
   const [labelSections, otherSections] = partition(
     sections,
-    (section) => section.key === 'labels'
+    (section) => section.key === 'labels' || section.key === 'numeric_labels'
   );
 
   return [...labelSections, ...otherSections];

x-pack/plugins/apm/public/components/shared/metadata_table/metadata_table.test.tsx

@@ -28,11 +28,10 @@ const renderOptions = {
 describe('MetadataTable', () => {
   it('shows sections', () => {
     const sections: SectionDescriptor[] = [
-      { key: 'foo', label: 'Foo', required: true, properties: [] },
+      { key: 'foo', label: 'Foo', properties: [] },
       {
         key: 'bar',
         label: 'Bar',
-        required: false,
         properties: [
           { field: 'props.A', value: ['A'] },
           { field: 'props.B', value: ['B'] },
@@ -59,7 +58,6 @@ describe('MetadataTable', () => {
         {
           key: 'foo',
           label: 'Foo',
-          required: true,
           properties: [],
         },
       ];

x-pack/plugins/apm/public/components/shared/metadata_table/types.ts

@@ -8,6 +8,5 @@
 export interface SectionDescriptor {
   key: string;
   label: string;
-  required?: boolean;
   properties: Array<{ field: string; value: string[] | number[] }>;
 }