aboutsummaryrefslogtreecommitdiffstats
path: root/webui
diff options
context:
space:
mode:
Diffstat (limited to 'webui')
-rw-r--r--webui/src/pages/list/Filter.tsx2
-rw-r--r--webui/src/pages/list/FilterToolbar.tsx12
2 files changed, 10 insertions, 4 deletions
diff --git a/webui/src/pages/list/Filter.tsx b/webui/src/pages/list/Filter.tsx
index 1a3cdd6b..0635e7f0 100644
--- a/webui/src/pages/list/Filter.tsx
+++ b/webui/src/pages/list/Filter.tsx
@@ -154,7 +154,7 @@ function FilterDropdown({
export type FilterProps = {
active: boolean;
- to: LocationDescriptor;
+ to: LocationDescriptor; // the target on click
icon?: React.ComponentType<SvgIconProps>;
children: React.ReactNode;
};
diff --git a/webui/src/pages/list/FilterToolbar.tsx b/webui/src/pages/list/FilterToolbar.tsx
index 825a9dee..c568a9dd 100644
--- a/webui/src/pages/list/FilterToolbar.tsx
+++ b/webui/src/pages/list/FilterToolbar.tsx
@@ -32,7 +32,7 @@ const useStyles = makeStyles(theme => ({
// This prepends the filter text with a count
type CountingFilterProps = {
- query: string;
+ query: string; // the query used as a source to count the number of element
children: React.ReactNode;
} & FilterProps;
function CountingFilter({ query, children, ...props }: CountingFilterProps) {
@@ -72,6 +72,12 @@ function FilterToolbar({ query, queryLocation }: Props) {
...params,
[key]: [value],
});
+ const toggleParam = (key: string, value: string) => (
+ params: Query
+ ): Query => ({
+ ...params,
+ [key]: params[key] && params[key].includes(value) ? [] : [value],
+ });
const clearParam = (key: string) => (params: Query): Query => ({
...params,
[key]: [],
@@ -87,7 +93,7 @@ function FilterToolbar({ query, queryLocation }: Props) {
clearParam('sort'),
stringify
)(params)}
- to={pipe(replaceParam('status', 'open'), loc)(params)}
+ to={pipe(toggleParam('status', 'open'), loc)(params)}
icon={ErrorOutline}
>
open
@@ -99,7 +105,7 @@ function FilterToolbar({ query, queryLocation }: Props) {
clearParam('sort'),
stringify
)(params)}
- to={pipe(replaceParam('status', 'closed'), loc)(params)}
+ to={pipe(toggleParam('status', 'closed'), loc)(params)}
icon={CheckCircleOutline}
>
closed