Merge pull request #64 from oceanprotocol/feat/multiple-filters

feat: multiple ID filter
oceanprotocol · Dec 19, 2024 · 281e3f5 · 281e3f5
2 parents d3bd0d8 + d10c791
commit 281e3f5
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 5 deletions.
diff --git a/src/components/Table/index.tsx b/src/components/Table/index.tsx
@@ -223,16 +223,20 @@ export default function Table({
       filterable: true,
       filterOperators: [
         {
-          label: 'contains',
-          value: 'contains',
+          label: 'equals',
+          value: 'value',
           getApplyFilterFn: (filterItem) => {
             return (params) => {
               if (!filterItem.value) return true
-              return params.value?.toLowerCase().includes(filterItem.value.toLowerCase())
+              const ids = filterItem.value.split(',').map((id: string) => id.trim())
+              return ids.includes(params.value)
             }
           },
           InputComponent: GridFilterInputValue,
-          InputComponentProps: { type: 'text' }
+          InputComponentProps: {
+            type: 'text',
+            placeholder: 'Enter ID(s), comma separated'
+          }
         }
       ]
     },

diff --git a/src/context/DataContext.tsx b/src/context/DataContext.tsx
@@ -103,6 +103,10 @@ export const DataProvider: React.FC<DataProviderProps> = ({ children }) => {
     return Object.entries(filters)
       .filter(([_, filterData]) => filterData?.value && filterData?.operator)
       .map(([field, filterData]) => {
+        if (field === 'id') {
+          const ids = filterData.value.split(',').map((id: string) => id.trim())
+          return `filters[${field}][value]=${ids.join(',')}`
+        }
         return `filters[${field}][${filterData.operator}]=${filterData.value}`
       })
       .join('&')

diff --git a/src/types/filters.ts b/src/types/filters.ts
@@ -1,4 +1,4 @@
-export type StringFilterOperator = 'contains' | 'eq'
+export type StringFilterOperator = 'contains' | 'eq' | 'value'
 export type NumberFilterOperator = 'eq' | 'gt' | 'lt'
 export type FilterOperator = StringFilterOperator | NumberFilterOperator