fix: global filter fails if value is type number

dosm-malaysia · Feb 3, 2023 · 23d61ca · 23d61ca
1 parent 5d0f656
commit 23d61ca
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/components/Chart/Table/index.tsx b/components/Chart/Table/index.tsx
@@ -86,8 +86,10 @@ const scaleColor = (value: number) =>
   value >= 75 ? "bg-[#FDC7B2]" : value >= 50 ? "bg-[#FFECE4]" : "bg-transparent";
 
 const fuzzyFilter: FilterFn<any> = (row, columnId, value, addMeta) => {
+  const search = value.toLowerCase();
+  let compareTo = row.getValue(columnId) as string;
   // Rank the item
-  const itemRank = rankItem(row.getValue(columnId), value);
+  const itemRank = rankItem(compareTo, search);
 
   // Store the itemRank info
   addMeta({ itemRank });
@@ -160,7 +162,7 @@ const Table: FunctionComponent<TableProps> = ({
   const onSearch = useCallback(
     debounce((query: string) => {
       setGlobalFilter(query ?? "");
-    }, 300),
+    }, 500),
     []
   );
 

diff --git a/lib/schema/data-catalogue.tsx b/lib/schema/data-catalogue.tsx
@@ -97,7 +97,13 @@ export const UNIVERSAL_TABLE_SCHEMA = (
     return {
       id: key,
       header: value,
-      accessorKey: key,
+      // accessorKey: key,
+      // Filter bug, cannot have number type in table: https://github.com/TanStack/table/issues/4280
+      accessorFn: (item: any) => {
+        if (typeof item[key] === "string") return item[key];
+        if (typeof item[key] === "number") return item[key].toString();
+        return "";
+      },
       className: "text-left",
     };
   });