fleet/frontend/pages/SoftwarePage/components/EmptySoftwareTable/EmptySoftwareTable.tsx
Gabriel Hernandez 4c99ebebaf
UI updates to software page to support added software feature. (#18731)
relates to #18328

make updates to the software titles page to support new add software
feature. this includes.

**Change of page description**


![image](https://github.com/fleetdm/fleet/assets/1153709/e90a2149-54c4-41f0-a1ec-12ebc4619d6c)

**new install status column and change order of `Type` and `verison`
columns**


![image](https://github.com/fleetdm/fleet/assets/1153709/662841fd-2f9e-489c-adc3-fbf1442228b2)

**adding new dropdown filter option and conditionally showing it for
titles and versions tables**


![image](https://github.com/fleetdm/fleet/assets/1153709/8e81680e-d733-4d63-94b6-b4441cb708e3)

<!-- Note that API documentation changes are now addressed by the
product design team. -->

- [x] Changes file added for user-visible changes in `changes/`,
`orbit/changes/` or `ee/fleetd-chrome/changes`.
See [Changes
files](https://fleetdm.com/docs/contributing/committing-changes#changes-files)
for more information.
- [x] Manual QA for all new/changed functionality
2024-05-06 13:49:49 +01:00

74 lines
2.2 KiB
TypeScript

// This component is used on DashboardPage.tsx > Software.tsx,
// Host Details / Device User > Software.tsx, and SoftwarePage.tsx
import React from "react";
import CustomLink from "components/CustomLink";
import EmptyTable from "components/EmptyTable";
import { IEmptyTableProps } from "interfaces/empty_table";
import { ISoftwareDropdownFilterVal } from "pages/SoftwarePage/SoftwareTitles/SoftwareTable/helpers";
export interface IEmptySoftwareTableProps {
softwareFilter?: ISoftwareDropdownFilterVal;
isSoftwareDisabled?: boolean;
isCollectingSoftware?: boolean;
isSearching?: boolean;
}
const generateTypeText = (softwareFilter?: ISoftwareDropdownFilterVal) => {
if (softwareFilter === "installableSoftware") {
return "installable";
}
return softwareFilter === "vulnerableSoftware" ? "vulnerable" : "";
};
const EmptySoftwareTable = ({
softwareFilter,
isSoftwareDisabled,
isCollectingSoftware,
isSearching,
}: IEmptySoftwareTableProps): JSX.Element => {
const softwareTypeText = generateTypeText(softwareFilter);
const emptySoftware: IEmptyTableProps = {
header: `No ${softwareTypeText} software match the current search criteria`,
info:
"This report is updated every hour to protect the performance of your devices.",
};
if (isCollectingSoftware) {
emptySoftware.header = "No software detected";
emptySoftware.info =
"This report is updated every hour to protect the performance of your devices.";
}
if (isSoftwareDisabled) {
emptySoftware.header = "Software inventory disabled";
emptySoftware.info = (
<>
Users with the admin role can{" "}
<CustomLink
url="https://fleetdm.com/docs/using-fleet/vulnerability-processing#configuration"
text="turn on software inventory"
newTab
/>
.
</>
);
}
if (softwareFilter === "vulnerableSoftware" && !isSearching) {
emptySoftware.header = "No vulnerable software detected";
emptySoftware.info =
"This report is updated every hour to protect the performance of your devices.";
}
return (
<EmptyTable
graphicName="empty-software"
header={emptySoftware.header}
info={emptySoftware.info}
/>
);
};
export default EmptySoftwareTable;