From 38a6eb0f0b44b2340bff2b4aa8fc0cbeeb1d548e Mon Sep 17 00:00:00 2001
From: lawvs <18554747+lawvs@users.noreply.github.com>
Date: Sun, 4 Aug 2024 22:43:13 +0800
Subject: [PATCH] feat: allow reset filter

---
 package.json                     |  2 +-
 pnpm-lock.yaml                   | 18 +++++++++---------
 src/components/filter-button.tsx | 21 +++++++++++++++++++--
 3 files changed, 29 insertions(+), 12 deletions(-)

diff --git a/package.json b/package.json
index 2242023..cff06e5 100644
--- a/package.json
+++ b/package.json
@@ -15,7 +15,7 @@
   "dependencies": {
     "@emotion/react": "^11.13.0",
     "@emotion/styled": "^11.13.0",
-    "@fn-sphere/filter": "^0.3.1",
+    "@fn-sphere/filter": "^0.3.2",
     "@mui/material": "^5.16.6",
     "@radix-ui/react-dialog": "^1.1.1",
     "@radix-ui/react-dropdown-menu": "^2.1.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e73d4a6..96b66f1 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -15,8 +15,8 @@ importers:
         specifier: ^11.13.0
         version: 11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)
       '@fn-sphere/filter':
-        specifier: ^0.3.1
-        version: 0.3.1(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(zod@3.23.8)
+        specifier: ^0.3.2
+        version: 0.3.2(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(zod@3.23.8)
       '@mui/material':
         specifier: ^5.16.6
         version: 5.16.6(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.0(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -486,13 +486,13 @@ packages:
   '@floating-ui/utils@0.2.2':
     resolution: {integrity: sha512-J4yDIIthosAsRZ5CPYP/jQvUAQtlZTTD/4suA08/FEnlxqW3sKS9iAhgsa9VYLZ6vDHn/ixJgIqRQPotoBjxIw==}
 
-  '@fn-sphere/core@0.3.1':
-    resolution: {integrity: sha512-q3zTGrBEjptf0Pp73OGd+9xjh9D4Z7FBD0LMCrQVzfH5OuoTGx1J91dbe8ONB+J3lrI86XF/NWMQ+R39jVMH+A==}
+  '@fn-sphere/core@0.3.2':
+    resolution: {integrity: sha512-WuHqpOaBtlyPA3GirU+YNrXOcnfR5iCbS4k4gvlw8ZiQOXX2pVkaHB2bvpNAnv0uynqCdtrDOiPgPGzWs8Cc6w==}
     peerDependencies:
       zod: ^3.0.0
 
-  '@fn-sphere/filter@0.3.1':
-    resolution: {integrity: sha512-rHKk/n7KSI2Im2aHEDycsSun0zfgIpYBrbBvi9nRS08QG5uO8KE0PuLDXJjZDIiu0TVZj6QTFiMQHaj7DjP+6Q==}
+  '@fn-sphere/filter@0.3.2':
+    resolution: {integrity: sha512-7VPvzxnx0kUhcZDBwTz8Oi5Ly3txM6dH65CPgxhM1Y+9Tg23DGJbTrcUTWbYPslnlWfpuiYPF0C6ORdguIVjSA==}
     peerDependencies:
       '@types/react': ^17.0.0 || ^18.0.0
       react: ^17.0.0 || ^18.0.0
@@ -2870,14 +2870,14 @@ snapshots:
 
   '@floating-ui/utils@0.2.2': {}
 
-  '@fn-sphere/core@0.3.1(zod@3.23.8)':
+  '@fn-sphere/core@0.3.2(zod@3.23.8)':
     dependencies:
       zod: 3.23.8
       zod-compare: 0.3.1(zod@3.23.8)
 
-  '@fn-sphere/filter@0.3.1(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(zod@3.23.8)':
+  '@fn-sphere/filter@0.3.2(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(zod@3.23.8)':
     dependencies:
-      '@fn-sphere/core': 0.3.1(zod@3.23.8)
+      '@fn-sphere/core': 0.3.2(zod@3.23.8)
       react: 18.3.1
       react-dom: 18.3.1(react@18.3.1)
       zod: 3.23.8
diff --git a/src/components/filter-button.tsx b/src/components/filter-button.tsx
index de3fbb0..3939fb6 100644
--- a/src/components/filter-button.tsx
+++ b/src/components/filter-button.tsx
@@ -22,7 +22,7 @@ export function FilterButton() {
   const [open, setOpen] = useState(false);
   const updateFilterPredicate = useUpdateFilterPredicate();
   const countOfFilterData = useFilterCount();
-  const { context, getPredicate } = useFilterSphere({
+  const { getPredicate, reset, context } = useFilterSphere({
     schema,
     defaultRule: createFlattenFilterGroup(),
   });
@@ -62,13 +62,22 @@ export function FilterButton() {
             setOpen(false);
             updateFilter();
           }}
+onReset={() => {
+            reset();
+          }}
         />
       </Dialog>
     </FilterSphereProvider>
   );
 }
 
-function FilterDialog({ onConfirm }: { onConfirm: () => void }) {
+function FilterDialog({
+onConfirm,
+  onReset,
+}: {
+onConfirm: () => void;
+  onReset: () => void;
+}) {
   return (
     <DialogContent>
       <DialogHeader>
@@ -79,6 +88,14 @@ function FilterDialog({ onConfirm }: { onConfirm: () => void }) {
         <FilterBuilder />
       </div>
       <DialogFooter>
+<Button
+          variant="secondary"
+          onClick={() => {
+            onReset();
+          }}
+        >
+          Reset
+        </Button>
         <Button
           onClick={() => {
             onConfirm();