{
const { gravatar_url_dark } = user;
return (
-
+
= {
+ title: "Components/DataSet",
+ component: DataSet,
+ args: {
+ title: "Data set",
+ value: "This is the value",
+ },
+};
+
+export default meta;
+
+type Story = StoryObj;
+
+export const Basic: Story = {};
diff --git a/frontend/components/DataSet/DataSet.tsx b/frontend/components/DataSet/DataSet.tsx
new file mode 100644
index 000000000000..25a4b78bff01
--- /dev/null
+++ b/frontend/components/DataSet/DataSet.tsx
@@ -0,0 +1,19 @@
+import React from "react";
+
+const baseClass = "data-set";
+
+interface IDataSetProps {
+ title: React.ReactNode;
+ value: React.ReactNode;
+}
+
+const DataSet = ({ title, value }: IDataSetProps) => {
+ return (
+
{diskSpaceTooltipText && (
= {
+ title: "Components/DataSet",
+ component: DataSet,
+ args: {
+ title: "Data set",
+ value: "This is the value",
+ },
+};
+
+export default meta;
+
+type Story = StoryObj
+ {title}
+ {value}
+
+ );
+};
+
+export default DataSet;
diff --git a/frontend/components/DataSet/_styles.scss b/frontend/components/DataSet/_styles.scss
new file mode 100644
index 000000000000..809e7d98c75e
--- /dev/null
+++ b/frontend/components/DataSet/_styles.scss
@@ -0,0 +1,7 @@
+.data-set {
+ font-size: $x-small;
+
+ dt {
+ font-weight: $bold;
+ }
+}
diff --git a/frontend/components/DataSet/index.ts b/frontend/components/DataSet/index.ts
new file mode 100644
index 000000000000..95947aec852b
--- /dev/null
+++ b/frontend/components/DataSet/index.ts
@@ -0,0 +1 @@
+export { default } from "./DataSet";
diff --git a/frontend/components/DiskSpaceGraph/DiskSpaceGraph.tsx b/frontend/components/DiskSpaceGraph/DiskSpaceGraph.tsx
index 97eb1a8f9fc1..7f8e355ac4db 100644
--- a/frontend/components/DiskSpaceGraph/DiskSpaceGraph.tsx
+++ b/frontend/components/DiskSpaceGraph/DiskSpaceGraph.tsx
@@ -67,7 +67,7 @@ const DiskSpaceGraph = ({
diff --git a/frontend/components/EnrollSecrets/EnrollSecretModal/EnrollSecretModal.tsx b/frontend/components/EnrollSecrets/EnrollSecretModal/EnrollSecretModal.tsx
index a6c6a691d6f4..cc88ba825af3 100644
--- a/frontend/components/EnrollSecrets/EnrollSecretModal/EnrollSecretModal.tsx
+++ b/frontend/components/EnrollSecrets/EnrollSecretModal/EnrollSecretModal.tsx
@@ -51,7 +51,7 @@ const EnrollSecretModal = ({
diff --git a/frontend/components/HumanTimeDiffWithDateTip/HumanTimeDiffWithDateTip.tsx b/frontend/components/HumanTimeDiffWithDateTip/HumanTimeDiffWithDateTip.tsx
index 6cb0cbadfe37..1b1c93a1d152 100644
--- a/frontend/components/HumanTimeDiffWithDateTip/HumanTimeDiffWithDateTip.tsx
+++ b/frontend/components/HumanTimeDiffWithDateTip/HumanTimeDiffWithDateTip.tsx
@@ -33,7 +33,7 @@ export const HumanTimeDiffWithDateTip = ({
try {
return (
<>
-
+
{humanLastSeen(timeString)}
{
+ // Grey out if API returns null or undefined (but not 0)
+ if (typeof probabilityOfExploit !== "number") {
+ return (
+
+ {DEFAULT_EMPTY_CELL_VALUE}
+
+ );
+ }
+
+ const renderExploitedIcon = () => {
+ const tooltipId = uniqueId();
+ return (
+ <>
+
+
+
+ <>
+ The vulnerability has been actively exploited in the wild. This
+ data is reported by the Cybersecurity and Infrastructure Security
+ Agency (CISA).
+
+
+
+
+ );
+ };
+
+ return (
+
+ {formatFloatAsPercentage(probabilityOfExploit)}
+ {cisaKnownExploit && renderExploitedIcon()}
+
+ );
+};
+
+export default ProbabilityOfExploit;
diff --git a/frontend/components/ProbabilityOfExploit/_styles.scss b/frontend/components/ProbabilityOfExploit/_styles.scss
new file mode 100644
index 000000000000..d0df6c90fd33
--- /dev/null
+++ b/frontend/components/ProbabilityOfExploit/_styles.scss
@@ -0,0 +1,10 @@
+.probability-of-exploit {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+
+ &__unknown {
+ color: $ui-fleet-black-50;
+ font-style: italic;
+ }
+}
diff --git a/frontend/components/ProbabilityOfExploit/index.ts b/frontend/components/ProbabilityOfExploit/index.ts
new file mode 100644
index 000000000000..2bacf7669dcb
--- /dev/null
+++ b/frontend/components/ProbabilityOfExploit/index.ts
@@ -0,0 +1 @@
+export { default } from "./ProbabilityOfExploit";
diff --git a/frontend/components/Sandbox/SandboxMessage/SandboxMessage.tsx b/frontend/components/Sandbox/SandboxMessage/SandboxMessage.tsx
index e8d77c4f6e40..56087a0ff6e8 100644
--- a/frontend/components/Sandbox/SandboxMessage/SandboxMessage.tsx
+++ b/frontend/components/Sandbox/SandboxMessage/SandboxMessage.tsx
@@ -25,14 +25,14 @@ const SandboxMessage = ({
demo: (
{
{ name: "foo user", address: "biz address" },
{ name: "bar user", address: "daz address" },
]}
- sortHeader={"name"}
- sortDirection={"desc"}
+ sortHeader="name"
+ sortDirection="desc"
isLoading={false}
onSort={noop}
showMarkAllPages={false}
@@ -90,8 +90,8 @@ describe("DataTable - component", () => {
{ name: "foo user", address: "biz address" },
{ name: "bar user", address: "daz address" },
]}
- sortHeader={"address"}
- sortDirection={"desc"}
+ sortHeader="address"
+ sortDirection="desc"
isLoading={false}
onSort={noop}
showMarkAllPages={false}
@@ -124,8 +124,8 @@ describe("DataTable - component", () => {
{
{isLoading && (
-
+
+
{Object.keys(selectedRowIds).length !== 0 && (
-
+
| {headerGroups[0].headers[0].render("Header")} | -
-
+
+ |
{renderSelectedCount()}
-
+
{secondarySelectActions && renderSecondarySelectActions()}
-
+
diff --git a/frontend/components/TableContainer/DataTable/TextCell/TextCell.tests.tsx b/frontend/components/TableContainer/DataTable/TextCell/TextCell.tests.tsx
index 853e813d8cd1..c134a44a8212 100644
--- a/frontend/components/TableContainer/DataTable/TextCell/TextCell.tests.tsx
+++ b/frontend/components/TableContainer/DataTable/TextCell/TextCell.tests.tsx
@@ -10,17 +10,17 @@ describe("TextCell", () => {
});
it("renders a default value when `value` is empty", () => {
- render(
{primarySelectAction && renderPrimarySelectAction()}
{toggleAllPagesSelected && renderAreAllSelected()}
{shouldRenderToggleAllPages && (
)}
-
diff --git a/frontend/components/TableContainer/DataTable/_styles.scss b/frontend/components/TableContainer/DataTable/_styles.scss
index 26d2dcf56c78..51cbec675414 100644
--- a/frontend/components/TableContainer/DataTable/_styles.scss
+++ b/frontend/components/TableContainer/DataTable/_styles.scss
@@ -211,6 +211,10 @@ $shadow-transition-width: 10px;
max-width: 500px;
word-wrap: break-word;
+ &.linkToFilteredHosts__cell {
+ text-align: right;
+ }
+
&.selection__cell {
width: 0px;
padding: 0 $pad-medium;
diff --git a/frontend/components/TableContainer/TableContainer.tsx b/frontend/components/TableContainer/TableContainer.tsx
index 678d9077ee4b..f96f15cd29c0 100644
--- a/frontend/components/TableContainer/TableContainer.tsx
+++ b/frontend/components/TableContainer/TableContainer.tsx
@@ -30,6 +30,7 @@ interface IRowProps extends Row {
original: {
id?: number;
os_version_id?: string; // Required for onSelectSingleRow of SoftwareOSTable.tsx
+ cve?: string; // Required for onSelectSingleRow of SoftwareVulnerabilityTable.tsx
};
}
@@ -330,7 +331,7 @@ const TableContainer = ({
)}
-
+
{actionButton && !actionButton.hideButton && (
|
|---|