SONAR-16245 Place others category at the end

server/sonar-web/src/main/js/apps/security-hotspots/components/__tests__/__snapshots__/HotspotList-test.tsx.snap

       <ul>
         <li
           className="spacer-bottom"
-          key="cat2"
+          key="cat1"
         >
           <HotspotCategory
-            categoryKey="cat2"
+            categoryKey="cat1"
             hotspots={
               Array [
                 Object {
                   "author": "Developer 1",
                   "component": "com.github.kevinsawicki:http-request:com.github.kevinsawicki.http.HttpRequest",
                   "creationDate": "2013-05-13T17:55:39+0200",
-                  "key": "h1",
+                  "key": "h2",
                   "line": 81,
                   "message": "'3' is a magic number.",
                   "project": "com.github.kevinsawicki:http-request",
                   "resolution": undefined,
                   "rule": "checkstyle:com.puppycrawl.tools.checkstyle.checks.coding.MagicNumberCheck",
-                  "securityCategory": "cat2",
+                  "securityCategory": "cat1",
                   "status": "TO_REVIEW",
                   "updateDate": "2013-05-13T17:55:39+0200",
                   "vulnerabilityProbability": "HIGH",
                 "vulnerabilityProbability": "HIGH",
               }
             }
-            title="cat2"
+            title="cat1"
           />
         </li>
         <li
           className="spacer-bottom"
-          key="cat1"
+          key="cat2"
         >
           <HotspotCategory
-            categoryKey="cat1"
+            categoryKey="cat2"
             hotspots={
               Array [
                 Object {
                   "author": "Developer 1",
                   "component": "com.github.kevinsawicki:http-request:com.github.kevinsawicki.http.HttpRequest",
                   "creationDate": "2013-05-13T17:55:39+0200",
-                  "key": "h2",
+                  "key": "h1",
                   "line": 81,
                   "message": "'3' is a magic number.",
                   "project": "com.github.kevinsawicki:http-request",
                   "resolution": undefined,
                   "rule": "checkstyle:com.puppycrawl.tools.checkstyle.checks.coding.MagicNumberCheck",
-                  "securityCategory": "cat1",
+                  "securityCategory": "cat2",
                   "status": "TO_REVIEW",
                   "updateDate": "2013-05-13T17:55:39+0200",
                   "vulnerabilityProbability": "HIGH",
                 "vulnerabilityProbability": "HIGH",
               }
             }
-            title="cat1"
+            title="cat2"
           />
         </li>
       </ul>
       <ul>
         <li
           className="spacer-bottom"
-          key="cat2"
+          key="cat1"
         >
           <HotspotCategory
-            categoryKey="cat2"
+            categoryKey="cat1"
             hotspots={
               Array [
                 Object {
                   "author": "Developer 1",
                   "component": "com.github.kevinsawicki:http-request:com.github.kevinsawicki.http.HttpRequest",
                   "creationDate": "2013-05-13T17:55:39+0200",
-                  "key": "h1",
+                  "key": "h2",
                   "line": 81,
                   "message": "'3' is a magic number.",
                   "project": "com.github.kevinsawicki:http-request",
                   "resolution": undefined,
                   "rule": "checkstyle:com.puppycrawl.tools.checkstyle.checks.coding.MagicNumberCheck",
-                  "securityCategory": "cat2",
+                  "securityCategory": "cat1",
                   "status": "TO_REVIEW",
                   "updateDate": "2013-05-13T17:55:39+0200",
                   "vulnerabilityProbability": "HIGH",
                 "vulnerabilityProbability": "HIGH",
               }
             }
-            title="cat2"
+            title="cat1"
           />
         </li>
         <li
           className="spacer-bottom"
-          key="cat1"
+          key="cat2"
         >
           <HotspotCategory
-            categoryKey="cat1"
+            categoryKey="cat2"
             hotspots={
               Array [
                 Object {
                   "author": "Developer 1",
                   "component": "com.github.kevinsawicki:http-request:com.github.kevinsawicki.http.HttpRequest",
                   "creationDate": "2013-05-13T17:55:39+0200",
-                  "key": "h2",
+                  "key": "h1",
                   "line": 81,
                   "message": "'3' is a magic number.",
                   "project": "com.github.kevinsawicki:http-request",
                   "resolution": undefined,
                   "rule": "checkstyle:com.puppycrawl.tools.checkstyle.checks.coding.MagicNumberCheck",
-                  "securityCategory": "cat1",
+                  "securityCategory": "cat2",
                   "status": "TO_REVIEW",
                   "updateDate": "2013-05-13T17:55:39+0200",
                   "vulnerabilityProbability": "HIGH",
                 "vulnerabilityProbability": "HIGH",
               }
             }
-            title="cat1"
+            title="cat2"
           />
         </li>
       </ul>

server/sonar-web/src/main/js/apps/security-hotspots/utils.ts

   StandardSecurityCategories
 } from '../../types/types';
 
+const OTHERS_SECURITY_CATEGORY = 'others';
+
 export const RISK_EXPOSURE_LEVELS = [RiskExposure.HIGH, RiskExposure.MEDIUM, RiskExposure.LOW];
 export const SECURITY_STANDARDS = [
   SecurityStandard.SONARSOURCE,
 ) {
   const groups = groupBy(hotspots, h => h.securityCategory);
 
-  return Object.keys(groups).map(key => ({
+  const groupList = Object.keys(groups).map(key => ({
     key,
     title: getCategoryTitle(key, securityCategories),
     hotspots: groups[key]
   }));
+
+  return [
+    ...sortBy(
+      groupList.filter(group => group.key !== OTHERS_SECURITY_CATEGORY),
+      group => group.title
+    ),
+    ...groupList.filter(({ key }) => key === OTHERS_SECURITY_CATEGORY)
+  ];
 }
 
 export function sortHotspots(hotspots: RawHotspot[], securityCategories: Dict<{ title: string }>) {