date deselect fix

hack4impact-calpoly · May 26, 2024 · ee4ff86 · ee4ff86
1 parent db8b008
commit ee4ff86
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 13 deletions.
diff --git a/src/components/admin-table/admin-table.tsx b/src/components/admin-table/admin-table.tsx
@@ -187,10 +187,16 @@ export default function AdminTable() {
     return Array.from(values) as string[];
   };
 
-  const handleDateRangeChange = (range: DateRange) => {
-    table.getColumn("transactionDate")?.setFilterValue(() => {
-      return [range.from, range.to];
-    });
+  const handleDateRangeChange = (range?: DateRange) => {
+    if (range) {
+      table.getColumn("transactionDate")?.setFilterValue(() => {
+        return [range.from, range.to];
+      });
+    } else {
+      table.getColumn("transactionDate")?.setFilterValue(() => {
+        return undefined;
+      });
+    }
   };
 
   if (isLoading) {

diff --git a/src/components/sponsored-org-table/data-table.tsx b/src/components/sponsored-org-table/data-table.tsx
@@ -41,6 +41,7 @@ import { dateFilterFn } from "@/lib/utils";
 import { DateRange } from "react-day-picker";
 import { rankItem } from "@tanstack/match-sorter-utils";
 import React from "react";
+import { setDate } from "date-fns";
 
 interface DataTableProps<TData, TValue> {
   columns: ColumnDef<TData, TValue>[];
@@ -136,10 +137,16 @@ export function DataTable<TData, TValue>({
     return pages;
   };
 
-  const handleDateRangeChange = (range: DateRange) => {
-    table.getColumn("transactionDate")?.setFilterValue(() => {
-      return [range.from, range.to];
-    });
+  const handleDateRangeChange = (range?: DateRange) => {
+    if (range) {
+      table.getColumn("transactionDate")?.setFilterValue(() => {
+        return [range.from, range.to];
+      });
+    } else {
+      table.getColumn("transactionDate")?.setFilterValue(() => {
+        return undefined;
+      });
+    }
   };
   return (
     <>

diff --git a/src/components/ui/custom/date-range-picker.tsx b/src/components/ui/custom/date-range-picker.tsx
@@ -17,7 +17,7 @@ import { useState } from "react";
 
 type DatePickerWithRangeType = {
   className: string;
-  handleChange: (dateRange: DateRange) => void;
+  handleChange: (dateRange?: DateRange) => void;
 };
 
 export function DatePickerWithRange({
@@ -59,11 +59,10 @@ export function DatePickerWithRange({
             mode="range"
             defaultMonth={date?.from}
             selected={date}
+            // onSelect={setDate}
             onSelect={(value) => {
-              if (value) {
-                setDate(value);
-                handleChange(value);
-              }
+              setDate(value);
+              handleChange(value);
             }}
             numberOfMonths={2}
           />