filter fix

ubclaunchpad · Sep 3, 2024 · 3c928a2 · 3c928a2
1 parent 9701735
commit 3c928a2
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 11 deletions.
diff --git a/src/app/portal/admin/forms/[id]/submissions/columns.tsx b/src/app/portal/admin/forms/[id]/submissions/columns.tsx
@@ -114,24 +114,30 @@ export function createColumns<TData>(
         }
 
         if (field.type === "select") {
+          console.log(filterValue);
           if (!field.options) {
             return row.original[key]
               .toString()
               .toLowerCase()
               .includes(filterValue.toLowerCase());
           }
 
-          const matchCriteria = field.options?.filter(
-            (op) =>
-              filterValue.includes(op.label) || filterValue.includes(op.id),
+          const matchCriteria = field.options?.filter((op) =>
+            filterValue.includes(op.id),
           );
           return (
-            matchCriteria?.filter((op) =>
-              row.original[key]
+            matchCriteria?.filter((op) => {
+              if (
+                row.original[key] === null ||
+                row.original[key] === undefined
+              ) {
+                return false;
+              }
+              return row.original[key]
                 .toString()
                 .toLowerCase()
-                .includes(op.label.toLowerCase()),
-            ).length > 0
+                .includes(op.id.toLowerCase());
+            }).length > 0
           );
         }
 

diff --git a/src/app/portal/admin/forms/[id]/submissions/data-table.tsx b/src/app/portal/admin/forms/[id]/submissions/data-table.tsx
@@ -272,7 +272,7 @@ function TableFilter({
             left-0 top-0
             "
         >
-          <div className="flex flex-col items-center p-4 w-full justify-between gap-2  pb-2 px-4 max-w-2xl rounded border border-background-600 bg-background-700 pointer-events-auto  shadow-lg">
+          <div className="flex flex-col max-h-screen overflow-y-scroll items-center p-4 w-full justify-between gap-2  pb-2 px-4 max-w-2xl rounded border border-background-600 bg-background-700 pointer-events-auto  shadow-lg">
             <h3 className="text-lg w-full text-left pb-4 font-semibold">
               Filters
             </h3>
@@ -365,8 +365,10 @@ function ColumnFilterInput<TData>({
         <MultiSelect
           allowMultiple={false}
           options={options}
-          value={value}
-          onChange={(e) => setValue(e ? e[0] : "")}
+          value={[value]}
+          onChange={(e) => {
+            setValue(e ? e[0] : "");
+          }}
           onBlur={() => {
             updateColumnFilter([{ id: column.id, value }]);
           }}

diff --git a/src/components/general/multiSelect.tsx b/src/components/general/multiSelect.tsx
@@ -46,10 +46,12 @@ export default function MultiSelect({
         type="button"
       >
         <span className="text-white justify-center flex z-1 items-center gap-2 ">
+          {/*{JSON.stringify(selectedOptions)}*/}
+          {/*{JSON.stringify(value)}*/}
           {selectedOptions !== [null] &&
             selectedOptions.map((option) => (
               <span
-                key={option.label}
+                key={option.value}
                 className="p-0.5 px-2 z-1! rounded bg-lp-500"
               >
                 {option.label}