[Metrics][Discover] Adds dimension type icons to metrics flyout (#235421)

## 🍒 Summary

This pull request adds support for different dimension types in the
unified metrics grid flyout. It maps various dimension types to their
corresponding `EuiToken` icons, providing a more informative and
visually consistent user experience.

## 🛠️ Changes

- Maps dimension types to EuiToken icons
- Displays a token icon for boolean, ip, keyword, and numeric types

## 🎙️ Prompts

- "I just merged this PR: #235276
I would like to add support for the different dimension types defined in
`src/platform/plugins/shared/metrics_experience/common/fields/constants.ts`.
I would like to `EuiToken` to replace type of dimension in the list."
- "Here are the tokens and how they should map:"
- "`tokenBoolean`: boolean"
- "`tokenIP`: ip"
- "`tokenKeyword`: keyword"
- "`tokenNumber`: long, integer, short, byte, unsigned_long"

<img width="2047" height="1003" alt="image"
src="https://github.com/user-attachments/assets/1a3af13b-f8bb-44ac-8d90-e260c6bb8786"
/>


🤖 This pull request was assisted by Gemini CLI

Author: simianhacker

src/platform/packages/shared/kbn-unified-metrics-grid/src/components/flyout/dimension_badges.tsx

@@ -41,23 +41,34 @@ export const DimensionBadges = ({
         const isAttributes = dimension.name.startsWith('attributes.');
         const isTopLevel = dimension.name.startsWith(topLevelNamespace);
         const badgeColor = isAttributes || isTopLevel ? 'default' : 'hollow';
-        const isKeyword = dimension.type === 'keyword';
+        const iconMap = new Map<string, string>([
+          ['boolean', 'tokenBoolean'],
+          ['ip', 'tokenIP'],
+          ['keyword', 'tokenKeyword'],
+          ['long', 'tokenNumber'],
+          ['integer', 'tokenNumber'],
+          ['short', 'tokenNumber'],
+          ['byte', 'tokenNumber'],
+          ['unsigned_long', 'tokenNumber'],
+        ]);
+
+        const hasIcon = iconMap.has(dimension.type);
 
         const badgeContent = (
           <EuiBadge
             key={dimension.name}
             color={badgeColor}
             style={{ marginRight: euiTheme.size.xs, marginBottom: euiTheme.size.xxs }}
           >
-            {isKeyword && (
+            {hasIcon && (
               <EuiToken
-                iconType="tokenKeyword"
+                iconType={iconMap.get(dimension.type)!}
                 size="xs"
                 style={{ marginRight: euiTheme.size.xs }}
               />
             )}
             {dimension.name}
-            {!isKeyword && ` (${dimension.type})`}
+            {!hasIcon && ` (${dimension.type})`}
           </EuiBadge>
         );