diff --git a/src/components/ui/utils/DecentDatePicker.tsx b/src/components/ui/utils/DecentDatePicker.tsx
index 8ada5752c..981135854 100644
--- a/src/components/ui/utils/DecentDatePicker.tsx
+++ b/src/components/ui/utils/DecentDatePicker.tsx
@@ -1,5 +1,5 @@
import { Box, Flex, Icon, useBreakpointValue } from '@chakra-ui/react';
-import { CalendarBlank, CaretLeft, CaretRight } from '@phosphor-icons/react';
+import { ArrowRight, CalendarBlank, CaretLeft, CaretRight } from '@phosphor-icons/react';
import { format } from 'date-fns';
import { useState } from 'react';
import { Calendar } from 'react-calendar';
@@ -19,16 +19,10 @@ interface DecentDatePickerProps {
type DateOrNull = Date | null;
type OnDateChangeValue = DateOrNull | [DateOrNull, DateOrNull];
-function SelectedDateDisplay({
- selectedDate,
-}: {
- selectedDate: DateOrNull;
- selectedRange?: [DateOrNull, DateOrNull];
-}) {
+function DateDisplayBox({ date }: { date: DateOrNull }) {
return (
-
- {(selectedDate && format(selectedDate, DEFAULT_DATE_FORMAT)) ?? 'Select'}
-
+ {(date && format(date, DEFAULT_DATE_FORMAT)) ?? 'Select'}
+
+ );
+}
+
+function SelectedDateDisplay({
+ selectedDate,
+ selectedRange,
+ isRange,
+}: {
+ selectedDate: DateOrNull;
+ selectedRange: [DateOrNull, DateOrNull];
+ isRange?: boolean;
+}) {
+ return !isRange ? (
+
+ {' '}
+
+ ) : (
+
+
+
+
);
}
@@ -74,7 +96,6 @@ export function DecentDatePicker({
return (
d instanceof Date)) {
- setSelectedRange(e);
- onRangeChange?.(e as [Date, Date]);
+ const dateRange = e as [Date, Date];
+ setSelectedRange(dateRange);
+ onRangeChange?.(dateRange);
}
}}
selectRange={isRange}