feat(FiltersPanel): reset button

src/components/pages/GoalsPage/GoalsPage.i18n/en.json

@@ -1,5 +1,6 @@
 {
     "title": "Taskany — Goals — Dashboard",
     "Dashboard": "Dashboard",
-    "This is your personal goals bundle": "This is your personal goals bundle. Created, owned, watching projects and goals are here."
+    "This is your personal goals bundle": "This is your personal goals bundle. Created, owned, watching projects and goals are here.",
+    "Reset": "Reset"
 }

src/components/pages/GoalsPage/GoalsPage.i18n/ru.json

@@ -1,5 +1,6 @@
 {
     "title": "Taskany — Цели — Рабочий стол",
     "Dashboard": "Рабочий стол",
-    "This is your personal goals bundle": "Здесь будут все созданные вами, назначенные на вас, а также цели и проекты, за которыми вы следите."
+    "This is your personal goals bundle": "Здесь будут все созданные вами, назначенные на вас, а также цели и проекты, за которыми вы следите.",
+    "Reset": "Сбросить"
 }

src/components/pages/GoalsPage/GoalsPage.tsx

@@ -3,7 +3,7 @@ import React, { MouseEventHandler, useCallback, useEffect, useState } from 'reac
 import useSWR, { unstable_serialize } from 'swr';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/router';
-import { nullable } from '@taskany/bricks';
+import { nullable, Button } from '@taskany/bricks';
 
 import { Filter, Goal, GoalsMetaOutput, Project } from '../../../../graphql/@generated/genql';
 import { createFetcher, refreshInterval } from '../../../utils/createFetcher';
@@ -198,6 +198,7 @@ export const GoalsPage = ({ user, ssrTime, locale, fallback, preset }: ExternalP
         setOwnerFilter,
         setProjectFilter,
         setFulltextFilter,
+        resetQueryState,
         setPreset,
     } = useUrlFilterParams({
         preset,
@@ -328,7 +329,9 @@ export const GoalsPage = ({ user, ssrTime, locale, fallback, preset }: ExternalP
                 onEstimateChange={setEstimateFilter}
                 onPresetChange={setPreset}
                 onFilterStar={onFilterStar}
-            />
+            >
+                {Boolean(queryString) && <Button text={tr('Reset')} onClick={resetQueryState} />}
+            </FiltersPanel>
 
             <PageContent>
                 {groups?.map(

src/components/pages/ProjectPage/ProjectPage.i18n/en.json

@@ -1,3 +1,4 @@
 {
-    "title": "Taskany — {project}"
+    "title": "Taskany — {project}",
+    "Reset": "Reset"
 }

src/components/pages/ProjectPage/ProjectPage.i18n/ru.json

@@ -1,3 +1,4 @@
 {
-    "title": "Taskany — {project}"
+    "title": "Taskany — {project}",
+    "Reset": "Сбросить"
 }

src/components/pages/ProjectPage/ProjectPage.tsx

@@ -3,7 +3,7 @@ import { MouseEventHandler, useCallback, useEffect, useState } from 'react';
 import useSWR, { unstable_serialize } from 'swr';
 import { useRouter as useNextRouter } from 'next/router';
 import dynamic from 'next/dynamic';
-import { nullable } from '@taskany/bricks';
+import { Button, nullable } from '@taskany/bricks';
 
 import { Filter, Goal, Project, ProjectDeepOutput } from '../../../../graphql/@generated/genql';
 import { createFetcher, refreshInterval } from '../../../utils/createFetcher';
@@ -273,6 +273,7 @@ export const ProjectPage = ({ user, locale, ssrTime, fallback, preset, params: {
         setOwnerFilter,
         setProjectFilter,
         setFulltextFilter,
+        resetQueryState,
         setPreset,
     } = useUrlFilterParams({
         preset,
@@ -423,7 +424,9 @@ export const ProjectPage = ({ user, locale, ssrTime, fallback, preset, params: {
                     onEstimateChange={setEstimateFilter}
                     onPresetChange={setPreset}
                     onFilterStar={onFilterStar}
-                />
+                >
+                    {Boolean(queryString) && <Button text={tr('Reset')} onClick={resetQueryState} />}
+                </FiltersPanel>
 
                 <PageContent>
                     {groups?.map(

src/hooks/useUrlFilterParams.ts

@@ -99,6 +99,18 @@ export const useUrlFilterParams = ({ preset }: { preset?: Filter }) => {
         [pushNewState, queryState],
     );
 
+    const resetQueryState = useCallback(() => {
+        pushNewState({
+            priorityFilter: [],
+            stateFilter: [],
+            ownerFilter: [],
+            projectFilter: [],
+            tagsFilter: [],
+            estimateFilter: [],
+            fulltextFilter: '',
+        });
+    }, [pushNewState]);
+
     const setTagsFilterOutside = useCallback(
         (t: Tag): MouseEventHandler<HTMLDivElement> =>
             (e) => {
@@ -150,6 +162,7 @@ export const useUrlFilterParams = ({ preset }: { preset?: Filter }) => {
         queryString,
         currentPreset,
         setTagsFilterOutside,
+        resetQueryState,
         setPreset,
         ...setters,
     };