Elgato_dark/fleet
1
0
Fork 0
mirror of https://github.com/fleetdm/fleet synced 2026-05-23 08:58:41 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 114

Fleet UI: Improved error and loading state for self-service page (#30042)

Browse source
This commit is contained in:
RachelElysia 2025-06-16 11:23:19 -04:00 committed by GitHub
parent e3711d0b11
commit 999207bd33
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 33 additions and 51 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
changes/29822-self-service-loading-error-state Normal file
View file

@ -0,0 +1 @@
- Fleet UI: Improved error and loading state for self-service page

83
frontend/pages/hosts/details/cards/Software/SelfService/SelfService.tsx
View file

@ -357,51 +357,15 @@ const SoftwareSelfService = ({
return <DeviceUserError />; // Only shown on DeviceUserPage not HostDetailsPage
}
if (isEmpty || !selfServiceData) {
// No self-service software available hides categories menu and header filters
if ((isEmpty || !selfServiceData) && !isFetching) {
return (
<>
{renderHeaderFilters()}
<div className={`${baseClass}__table`}>
{renderCategoriesMenu()}
<EmptyTable
graphicName="empty-software"
header="No self-service software available yet"
info="Your organization didn't add any self-service software. If you need any, reach out to your IT department."
/>
</div>
</>
);
}
if (isFetching) {
return (
<>
{renderHeaderFilters()}
<div className={`${baseClass}__table`}>
{renderCategoriesMenu()}
<Spinner />
</div>
</>
);
}
if (isEmptySearch) {
return (
<>
{renderHeaderFilters()}
<div className={`${baseClass}__table`}>
{renderCategoriesMenu()}
<EmptyTable
graphicName="empty-search-question"
header="No items match the current search criteria"
info={
<>
Not finding what you&apos;re looking for?{" "}
<CustomLink url={contactUrl} text="reach out to IT" newTab />
</>
}
/>
</div>
<EmptyTable
graphicName="empty-software"
header="No self-service software available yet"
info="Your organization didn't add any self-service software. If you need any, reach out to your IT department."
/>
</>
);
}
@ -417,7 +381,7 @@ const SoftwareSelfService = ({
selfServiceData?.software || [],
queryParams.category_id
)}
isLoading={isLoading}
isLoading={isFetching}
defaultSortHeader={DEFAULT_SELF_SERVICE_QUERY_PARAMS.order_key}
defaultSortDirection={
DEFAULT_SELF_SERVICE_QUERY_PARAMS.order_direction
@ -425,9 +389,26 @@ const SoftwareSelfService = ({
pageIndex={0}
disableNextPage={selfServiceData?.meta.has_next_results === false}
pageSize={DEFAULT_SELF_SERVICE_QUERY_PARAMS.per_page}
emptyComponent={() => (
<EmptySoftwareTable noSearchQuery={isEmptySearch} />
)}
emptyComponent={() => {
return isEmptySearch ? (
<EmptyTable
graphicName="empty-search-question"
header="No items match the current search criteria"
info={
<>
Not finding what you&apos;re looking for?{" "}
<CustomLink
url={contactUrl}
text="Reach out to IT"
newTab
/>
</>
}
/>
) : (
<EmptySoftwareTable />
);
}}
showMarkAllPages={false}
isAllPagesSelected={false}
searchable={false}
@ -437,11 +418,11 @@ const SoftwareSelfService = ({
</div>
<Pagination
disableNext={selfServiceData.meta.has_next_results === false}
disablePrev={selfServiceData.meta.has_previous_results === false}
disableNext={selfServiceData?.meta.has_next_results === false}
disablePrev={selfServiceData?.meta.has_previous_results === false}
hidePagination={
selfServiceData.meta.has_next_results === false &&
selfServiceData.meta.has_previous_results === false
selfServiceData?.meta.has_next_results === false &&
selfServiceData?.meta.has_previous_results === false
}
onNextPage={onNextPage}
onPrevPage={onPrevPage}