Upgrade frontend dependencies

Signed-off-by: Cintia Sanchez Garcia <[email protected]>

Author: cynthia-sg

web/package.json

@@ -4,38 +4,38 @@
   "description": "CLOWarden",
   "license": "Apache-2.0",
   "dependencies": {
-    "classnames": "^2.3.2",
-    "clo-ui": "https://github.com/cncf/clo-ui.git#0.1.20",
+    "classnames": "^2.5.1",
+    "clo-ui": "https://github.com/cncf/clo-ui.git#0.1.21",
     "lodash": "^4.17.21",
-    "moment": "^2.29.4",
+    "moment": "^2.30.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-icons": "^4.12.0",
-    "react-router-dom": "^6.19.0",
+    "react-router-dom": "^6.21.1",
     "source-map-explorer": "^2.5.3"
   },
   "devDependencies": {
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
-    "@testing-library/jest-dom": "^6.1.4",
+    "@testing-library/jest-dom": "^6.1.6",
     "@testing-library/react": "^14.1.2",
-    "@testing-library/user-event": "^14.5.1",
-    "@types/jest": "^29.5.7",
+    "@testing-library/user-event": "^14.5.2",
+    "@types/jest": "^29.5.11",
     "@types/lodash": "^4.14.200",
-    "@types/node": "^20.9.2",
-    "@types/react": "^18.2.36",
-    "@types/react-dom": "^18.2.14",
-    "eslint-config-prettier": "^9.0.0",
-    "eslint-plugin-prettier": "^5.0.1",
+    "@types/node": "^20.10.6",
+    "@types/react": "^18.2.46",
+    "@types/react-dom": "^18.2.18",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-prettier": "^5.1.2",
     "eslint-plugin-simple-import-sort": "^10.0.0",
-    "postcss": "^8.4.31",
-    "prettier": "^3.1.0",
+    "postcss": "^8.4.32",
+    "prettier": "^3.1.1",
     "react-scripts": "5.0.1",
-    "sass": "^1.69.5",
+    "sass": "^1.69.6",
     "shx": "^0.3.4",
-    "typescript": "^5.3.2"
+    "typescript": "^5.3.3"
   },
   "resolutions": {
-    "react-scripts/**/core-js-pure": "3.33.3"
+    "react-scripts/**/core-js-pure": "3.35.0"
   },
   "scripts": {
     "copy:static": "shx rm -rf src/static && shx mkdir src/static && shx cp -r public/static/* src",

web/src/layout/audit/Audit.module.css

@@ -141,6 +141,10 @@ label {
   max-width: 130px;
 }
 
+.arrow {
+  margin-top: 7px;
+}
+
 .tooltip {
   font-size: 0.8rem;
 }

web/src/layout/audit/index.tsx

@@ -453,6 +453,7 @@ const Audit = () => {
                                                   <div className="d-none d-md-inline-block">
                                                     <ElementWithTooltip
                                                       className="position-relative ms-1 ps-1"
+                                                      tooltipArrowClassName={styles.arrow}
                                                       element={<MdInfoOutline />}
                                                       tooltipWidth={250}
                                                       tooltipMessage={
@@ -544,6 +545,7 @@ const Audit = () => {
                                                   <div className="d-none d-md-inline-block">
                                                     <ElementWithTooltip
                                                       className="position-relative ms-1 ps-1"
+                                                      tooltipArrowClassName={styles.arrow}
                                                       element={<MdInfoOutline />}
                                                       tooltipWidth={250}
                                                       tooltipMessage={
@@ -736,6 +738,7 @@ const Audit = () => {
                                       {isUndefined(change.error) ? (
                                         <ElementWithTooltip
                                           className="position-relative"
+                                          tooltipArrowClassName={styles.arrow}
                                           tooltipClassName={styles.tooltipWrapper}
                                           element={<AiFillCheckCircle className="text-success" />}
                                           tooltipWidth={230}