github/oneuptime
1
1
Fork 0
mirror of https://github.com/OneUptime/oneuptime.git synced 2026-04-06 00:32:12 +02:00
Code Issues 193 Packages Projects Releases Wiki Activity

feat: improve filter visibility logic by conditionally displaying advanced filters based on loading state

Browse Source
This commit is contained in:
Nawaz Dhandala
2026-03-25 15:57:24 +00:00
parent f2f53b7cea
commit 2e9118e123
1 changed files with 15 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
Common/UI/Components/Filters/FiltersForm.tsx
View File

@@ -66,12 +66,14 @@ const FiltersForm: FiltersFormFunction = <T extends GenericObject>(
<div className="pt-3 pb-5">
<div className="space-y-5">
{props.showFilter &&
!props.isFilterLoading &&
!props.filterError &&
props.filters &&
props.filters
.filter((filter: Filter<T>) => {
return !filter.isAdvancedFilter || showMoreFilters;
if (filter.isAdvancedFilter) {
// Hide advanced filters if not toggled on, or if they are still loading/errored
return showMoreFilters && !props.isFilterLoading && !props.filterError;
}
return true;
})
.map((filter: Filter<T>, i: number) => {
return (
@@ -127,6 +129,16 @@ const FiltersForm: FiltersFormFunction = <T extends GenericObject>(
);
})}
</div>
{props.showFilter && props.isFilterLoading && !props.filterError && (
<ComponentLoader />
)}
{props.showFilter && props.filterError && (
<ErrorMessage
message={props.filterError}
onRefreshClick={props.onFilterRefreshClick}
/>
)}
{showAdvancedFilterButton && (
<Button
className="-ml-3 mt-1"
@@ -146,16 +158,6 @@ const FiltersForm: FiltersFormFunction = <T extends GenericObject>(
/>
)}
</div>
{props.showFilter && props.isFilterLoading && !props.filterError && (
<ComponentLoader />
)}
{props.showFilter && props.filterError && (
<ErrorMessage
message={props.filterError}
onRefreshClick={props.onFilterRefreshClick}
/>
)}
</div>
);
};