chore(ui): Upgrade TypeScript 5.6.2 plus types devDependencies in ui (s…

…tackrox#12709)

ui/apps/platform/package.json

@@ -102,6 +102,7 @@
         "test-watch": "react-app-rewired test",
         "lint": "eslint --quiet .",
         "lint:fix": "eslint --fix --quiet .",
+        "tsc": "tsc",
         "cypress-open": "./scripts/cypress.sh open --config defaultCommandTimeout=8000",
         "cypress-spec": "./scripts/cypress.sh run --spec",
         "cypress-component": "./scripts/cypress-component.sh open --component",
@@ -128,11 +129,11 @@
         "@testing-library/jest-dom": "^6.5.0",
         "@testing-library/react": "^16.0.1",
         "@testing-library/user-event": "^14.5.2",
-        "@types/jest": "^29.5.12",
-        "@types/lodash": "^4.17.4",
+        "@types/jest": "^29.5.13",
+        "@types/lodash": "^4.17.7",
         "@types/pluralize": "^0.0.33",
-        "@types/qs": "^6.9.15",
-        "@types/react": "^18.3.3",
+        "@types/qs": "^6.9.16",
+        "@types/react": "^18.3.6",
         "@types/react-dom": "^18.3.0",
         "@types/react-redux": "^7.1.33",
         "@types/segment-analytics": "^0.0.38",
@@ -169,7 +170,7 @@
         "redux-saga-test-plan": "^3.7.0",
         "tailwindcss": "^2.0.3",
         "ts-jest": "^29.2.5",
-        "typescript": "^5.5.4"
+        "typescript": "^5.6.2"
     },
     "resolutions": {
         "@jest/types": "^29.6.3",
@@ -222,7 +223,7 @@
             "react-dom": "^18.0.0"
         },
         "react-scripts": {
-            "typescript": "5.5.4"
+            "typescript": "5.6.2"
         },
         "react-select": {
             "react": "^18.0.0",

ui/apps/platform/src/Containers/Collections/errorUtils.ts

@@ -33,10 +33,6 @@ export function parseConfigError(err: Error): CollectionConfigError {
     const rawMessage = getAxiosErrorMessage(err);
 
     if (/create a loop/.test(rawMessage)) {
-        // Work around error in TypeScript 5.5.4 upgrade because build does not use target in tsconfig.json file.
-        // error TS1503: Named capturing groups are only available when targeting 'ES2018' or later.
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
         const errorRegex = /^edge between '[0-9a-fA-F-]*' and '(?<loopId>[0-9a-fA-F-]*)'/;
         const matches = errorRegex.exec(rawMessage);
         const loopId = matches?.groups?.loopId;

ui/apps/platform/src/Containers/Vulnerabilities/WorkloadCves/Tables/table.utils.ts

@@ -1,6 +1,7 @@
 import { gql } from '@apollo/client';
 import { min } from 'date-fns';
 import sortBy from 'lodash/sortBy';
+import uniq from 'lodash/uniq';
 import { VulnerabilitySeverity, isVulnerabilitySeverity } from 'types/cve.proto';
 import { SourceType } from 'types/image.proto';
 import { ApiSortOption } from 'types/search';
@@ -265,11 +266,11 @@ export function formatVulnerabilityData(
             .filter((d): d is string => d !== null);
         const oldestDiscoveredVulnDate = min(...allDiscoveredDates);
         // TODO This logic is used in many places, could extract to a util
-        const uniqueComponents = new Set(allVulnerableComponents.map((c) => c.name));
+        const uniqueComponents = uniq(allVulnerableComponents.map((c) => c.name));
         const affectedComponentsText =
-            uniqueComponents.size === 1
-                ? uniqueComponents.values().next().value
-                : `${uniqueComponents.size} components`;
+            uniqueComponents.length === 1
+                ? uniqueComponents[0]
+                : `${uniqueComponents.length} components`;
 
         const vulnerabilityImages = images
             .map((img) => ({

ui/apps/platform/tsconfig.json

@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es5",
+  "target": "es2020",
     "lib": [
       "dom",
       "dom.iterable",