diff --git a/website/src/components/pageStateSelectors/ApplyFilterButton.tsx b/website/src/components/pageStateSelectors/ApplyFilterButton.tsx index d3d7b5736..e185514aa 100644 --- a/website/src/components/pageStateSelectors/ApplyFilterButton.tsx +++ b/website/src/components/pageStateSelectors/ApplyFilterButton.tsx @@ -12,10 +12,12 @@ export function ApplyFilterButton({ newPageState, setPageState, className = '', + disabled = false, }: WithClassName<{ pageStateHandler: PageStateHandler; newPageState: PageState; setPageState: Dispatch>; + disabled?: boolean; }>) { const url = pageStateHandler.toUrl(newPageState); const fullUrl = `${window.location.origin}${url}`; @@ -25,18 +27,26 @@ export function ApplyFilterButton({ setPageState(newPageState); }; - return urlTooLong ? ( - <> - - Apply filters - -
- - The URL is too long ({fullUrl.length} characters, maximum {MAX_URL_LENGTH}). Please reduce the - amount of data in the filters. + if (urlTooLong) { + return ( + <> + + Apply filters -
- +
+ + The URL is too long ({fullUrl.length} characters, maximum {MAX_URL_LENGTH}). Please reduce the + amount of data in the filters. + +
+ + ); + } + + return disabled ? ( + + Apply filters + ) : (