diff --git a/changes/19694-vul-page-bugs b/changes/19694-vul-page-bugs
new file mode 100644
index 0000000000..433891d953
--- /dev/null
+++ b/changes/19694-vul-page-bugs
@@ -0,0 +1 @@
+* Fix 3 UI bugs on the Software page
diff --git a/frontend/components/TooltipWrapper/TooltipWrapper.tsx b/frontend/components/TooltipWrapper/TooltipWrapper.tsx
index c5b2a5fddb..d5fff19206 100644
--- a/frontend/components/TooltipWrapper/TooltipWrapper.tsx
+++ b/frontend/components/TooltipWrapper/TooltipWrapper.tsx
@@ -32,6 +32,11 @@ interface ITooltipWrapper {
* @default false
*/
showArrow?: boolean;
+ /** Corresponds to the react tooltip 5 `positionStrategy` option - see https://react-tooltip.com/docs/options.
+ * Setting as `true` will set the tooltip's `positionStrategy` to `"fixed"`. The default strategy is "absolute".
+ * Do this if you run into issues with `overflow: hidden` on the tooltip parent container
+ * */
+ fixedPositionStrategy?: boolean;
}
const baseClass = "component__tooltip-wrapper";
@@ -51,6 +56,7 @@ const TooltipWrapper = ({
clickable = true,
disableTooltip = false,
showArrow = false,
+ fixedPositionStrategy = false,
}: ITooltipWrapper) => {
const wrapperClassNames = classnames(baseClass, className, {
"show-arrow": showArrow,
@@ -85,6 +91,7 @@ const TooltipWrapper = ({
disableStyleInjection
clickable={clickable}
offset={tipOffset}
+ positionStrategy={fixedPositionStrategy ? "fixed" : "absolute"}
>
{tipContent}
diff --git a/frontend/pages/SoftwarePage/SoftwareVulnerabilities/SoftwareVulnerabilities.tsx b/frontend/pages/SoftwarePage/SoftwareVulnerabilities/SoftwareVulnerabilities.tsx
index 73762c2b55..845275db5b 100644
--- a/frontend/pages/SoftwarePage/SoftwareVulnerabilities/SoftwareVulnerabilities.tsx
+++ b/frontend/pages/SoftwarePage/SoftwareVulnerabilities/SoftwareVulnerabilities.tsx
@@ -10,6 +10,7 @@ import {
} from "services/entities/vulnerabilities";
import TableDataError from "components/DataError";
+import Spinner from "components/Spinner";
import SoftwareVulnerabilitiesTable from "./SoftwareVulnerabilitiesTable";
@@ -50,7 +51,7 @@ const SoftwareVulnerabilities = ({
exploit: showExploitedVulnerabilitiesOnly,
};
- const { data, isFetching, isError } = useQuery<
+ const { data, isFetching, isLoading, isError } = useQuery<
IVulnerabilitiesResponse,
Error,
IVulnerabilitiesResponse,
@@ -69,6 +70,10 @@ const SoftwareVulnerabilities = ({
}
);
+ if (isLoading) {
+ return ;
+ }
+
if (isError) {
return ;
}
diff --git a/frontend/pages/SoftwarePage/SoftwareVulnerabilities/SoftwareVulnerabilitiesTable/VulnerabilitiesTableConfig.tsx b/frontend/pages/SoftwarePage/SoftwareVulnerabilities/SoftwareVulnerabilitiesTable/VulnerabilitiesTableConfig.tsx
index c87feb95f7..92881a3c47 100644
--- a/frontend/pages/SoftwarePage/SoftwareVulnerabilities/SoftwareVulnerabilitiesTable/VulnerabilitiesTableConfig.tsx
+++ b/frontend/pages/SoftwarePage/SoftwareVulnerabilities/SoftwareVulnerabilitiesTable/VulnerabilitiesTableConfig.tsx
@@ -144,6 +144,7 @@ const generateTableHeaders = (
This data is reported by FIRST.org.
>
}
+ fixedPositionStrategy
>
Probability of exploit
diff --git a/frontend/pages/SoftwarePage/components/SoftwareVulnerabilitiesTable/SoftwareVulnerabilitiesTableConfig.tsx b/frontend/pages/SoftwarePage/components/SoftwareVulnerabilitiesTable/SoftwareVulnerabilitiesTableConfig.tsx
index cc888d0aca..c4a1d19618 100644
--- a/frontend/pages/SoftwarePage/components/SoftwareVulnerabilitiesTable/SoftwareVulnerabilitiesTableConfig.tsx
+++ b/frontend/pages/SoftwarePage/components/SoftwareVulnerabilitiesTable/SoftwareVulnerabilitiesTableConfig.tsx
@@ -128,6 +128,7 @@ const generateTableConfig = (
This data is reported by FIRST.org.
>
}
+ fixedPositionStrategy
>
Probability of exploit