refactor: update useFilterSphere hook to use 'predicate' instead of '…

…getPredicate'
lawvs · Aug 11, 2024 · d4c6a7d · d4c6a7d
1 parent 55b7fb1
commit d4c6a7d
Show file tree

Hide file tree

Showing 5 changed files with 44 additions and 13 deletions.
diff --git a/.changeset/proud-monkeys-bake.md b/.changeset/proud-monkeys-bake.md
@@ -0,0 +1,20 @@
+---
+"@fn-sphere/filter": patch
+---
+
+- Update `useFilterSphere` hook to use `predicate` instead of `getPredicate`:
+
+```diff
+import { useFilterSphere } from "@fn-sphere/filter";
+
+- const { rule, predicate, context } = useFilterSphere({
++ const { rule, getPredicate, context } = useFilterSphere({
+  schema: YOUR_DATA_SCHEMA,
+});
+
+- const filteredData = YOUR_DATA.filter(getPredicate());
++ const filteredData = YOUR_DATA.filter(predicate);
+```
+
+- Update `countTotalRules()` to `get totalRuleCount` in `useFilterSphere` hook
+- Add `validRuleCount` to `useFilterSphere` hook to get the count of valid rules
diff --git a/README.md b/README.md
@@ -32,7 +32,7 @@ const YOUR_DATA: z.infer<typeof YOUR_DATA_SCHEMA>[] = [
 ];
 
 const Filter = () => {
-  const { rule, getPredicate, context } = useFilterSphere({
+  const { rule, predicate, context } = useFilterSphere({
     schema: YOUR_DATA_SCHEMA,
     onPredicateChange: (predicate) => {
       const filteredData = YOUR_DATA.filter(predicate);

diff --git a/packages/filter/README.md b/packages/filter/README.md
@@ -41,13 +41,11 @@ const YOUR_DATA: z.infer<typeof YOUR_DATA_SCHEMA>[] = [
 ];
 
 const Filter = () => {
-  const { rule, getPredicate, context } = useFilterSphere({
+  const { rule, predicate, context } = useFilterSphere({
     schema: YOUR_DATA_SCHEMA,
-    onPredicateChange: (predicate) => {
-      const filteredData = YOUR_DATA.filter(predicate);
-      console.log(filteredData);
-    },
   });
+  const filteredData = YOUR_DATA.filter(predicate);
+  console.log(filteredData);
 
   return (
     <FilterSphereProvider context={context}>

diff --git a/packages/filter/src/hooks/use-filter-sphere.tsx b/packages/filter/src/hooks/use-filter-sphere.tsx
@@ -58,8 +58,7 @@ export const defaultContext: FilterSchemaContext = {
  *
  * @example
  * ```ts
- * const { getPredicate, context } = useFilterSphere<YourData>({ schema: yourDataSchema });
- * const predicate = getPredicate();
+ * const { predicate, context } = useFilterSphere<YourData>({ schema: yourDataSchema });
  * const filteredData = data.filter(predicate);
  * ```
  */
@@ -118,14 +117,28 @@ export const useFilterSphere = <Data,>(props: FilterSphereInput<Data>) => {
 
   return {
     filterRule: realRule,
+
+    /**
+     * @deprecated Use `countTotalRules` directly.
+     */
     countTotalRules,
-    countValidRules: () =>
-      countValidRules({
+    get totalRuleCount() {
+      return countNumberOfRules(realRule);
+    },
+    get validRuleCount() {
+      return countValidRules({
         dataSchema: schema,
         filterFnList,
         rule: realRule,
-      }),
+      });
+    },
+    /**
+     * @deprecated Use `predicate` directly.
+     */
     getPredicate,
+    get predicate() {
+      return getPredicate();
+    },
     reset,
     context,
   };

diff --git a/packages/playground/src/filter/flatten-filter-builder.tsx b/packages/playground/src/filter/flatten-filter-builder.tsx
@@ -71,7 +71,7 @@ export const FlattenFilterBuilder = <Data,>({
   filterRule,
   ...props
 }: FlattenFilterBuilderProps<Data>) => {
-  const { context, countTotalRules } = useFilterSphere({
+  const { context, totalRuleCount } = useFilterSphere({
     ruleValue: filterRule,
     ...props,
   });
@@ -94,7 +94,7 @@ export const FlattenFilterBuilder = <Data,>({
     );
   }
 
-  if (countTotalRules() <= 0) {
+  if (totalRuleCount <= 0) {
     return (
       <div>
         <ButtonView