[Security Solution][Document Flyout] Fix alert insights color order (e…

…lastic#212980)

## Summary

Updated order of the insights, following from left to right `Low` to
`Critical`

![image](https://github.com/user-attachments/assets/3b40bca0-4f29-421d-af34-fbacb49486dc)

### Checklist

- [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] The PR description includes the appropriate Release Notes section,
and the correct `release_note:*` label is applied per the
[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)

(cherry picked from commit bac5c30)

# Conflicts:
#	x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/shared/components/alert_count_insight.test.tsx

x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/shared/components/alert_count_insight.test.tsx

@@ -153,9 +153,9 @@ describe('AlertCountInsight', () => {
         closed: {
           total: 6,
           severities: [
-            { key: 'high', value: 1, label: 'High' },
             { key: 'low', value: 1, label: 'Low' },
             { key: 'medium', value: 2, label: 'Medium' },
+            { key: 'high', value: 1, label: 'High' },
             { key: 'critical', value: 2, label: 'Critical' },
           ],
         },
@@ -173,10 +173,10 @@ describe('getFormattedAlertStats', () => {
   it('should return alert stats', () => {
     const alertStats = getFormattedAlertStats(mockAlertData, euiTheme);
     expect(alertStats).toEqual([
-      { key: 'High', count: 2, color: '#ff7e62' },
-      { key: 'Low', count: 2, color: '#54b399' },
-      { key: 'Medium', count: 2, color: '#f1d86f' },
-      { key: 'Critical', count: 2, color: '#bd271e' },
+      { key: 'Low', count: 2, color: '#54B399' },
+      { key: 'Medium', count: 2, color: '#D6BF57' },
+      { key: 'High', count: 2, color: '#DA8B45' },
+      { key: 'Critical', count: 2, color: '#E7664C' },
     ]);
   });
 
@@ -186,8 +186,8 @@ describe('getFormattedAlertStats', () => {
         closed: {
           total: 2,
           severities: [
-            { key: 'high', value: 1, label: 'High' },
             { key: 'low', value: 1, label: 'Low' },
+            { key: 'high', value: 1, label: 'High' },
           ],
         },
       },

x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/shared/components/alert_count_insight.tsx

@@ -48,6 +48,8 @@ import {
   EntityDetailsLeftPanelTab,
 } from '../../../entity_details/shared/components/left_panel/left_panel_header';
 
+const ORDER = ['Low', 'Medium', 'High', 'Critical'];
+
 interface AlertCountInsightProps {
   /**
    * The name of the entity to filter the alerts by.
@@ -97,7 +99,12 @@ export const getFormattedAlertStats = (
     key: capitalize(key),
     count,
     color: getSeverityColor(key, euiTheme),
-  }));
+  })).sort((a, b) => {
+    const aIndex = ORDER.indexOf(a.key);
+    const bIndex = ORDER.indexOf(b.key);
+    return aIndex - bIndex;
+  });
+
   return alertStats;
 };