From d9d948e87e4a5e3c4492b9f646bf7d4f9cf62823 Mon Sep 17 00:00:00 2001
From: Aditya Choudhari <48932219+adityachoudhari26@users.noreply.github.com>
Date: Mon, 2 Dec 2024 10:29:31 -0800
Subject: [PATCH] fix: Datetimepicker typecheck (#244)

---
 .../RolloutAndTiming.tsx                      | 22 ++++++++++++-------
 .../filter/DateConditionRender.tsx            |  2 +-
 .../(app)/systems/JobHistoryChart.tsx         |  2 +-
 .../src/date-time-picker/date-time-picker.tsx |  3 +--
 4 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/apps/webservice/src/app/[workspaceSlug]/(app)/_components/environment-policy-drawer/RolloutAndTiming.tsx b/apps/webservice/src/app/[workspaceSlug]/(app)/_components/environment-policy-drawer/RolloutAndTiming.tsx
index 61c02e5e1..87f36f7f7 100644
--- a/apps/webservice/src/app/[workspaceSlug]/(app)/_components/environment-policy-drawer/RolloutAndTiming.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/(app)/_components/environment-policy-drawer/RolloutAndTiming.tsx
@@ -148,10 +148,13 @@ export const RolloutAndTiming: React.FC<{
                             onChange={(t) => {
                               onChange({
                                 ...value,
-                                startTime: t.toDate(
-                                  Intl.DateTimeFormat().resolvedOptions()
-                                    .timeZone,
-                                ),
+                                startTime:
+                                  t != null
+                                    ? t.toDate(
+                                        Intl.DateTimeFormat().resolvedOptions()
+                                          .timeZone,
+                                      )
+                                    : new Date(),
                               });
                             }}
                           />{" "}
@@ -161,10 +164,13 @@ export const RolloutAndTiming: React.FC<{
                             onChange={(t) => {
                               onChange({
                                 ...value,
-                                endTime: t.toDate(
-                                  Intl.DateTimeFormat().resolvedOptions()
-                                    .timeZone,
-                                ),
+                                endTime:
+                                  t != null
+                                    ? t.toDate(
+                                        Intl.DateTimeFormat().resolvedOptions()
+                                          .timeZone,
+                                      )
+                                    : new Date(),
                               });
                             }}
                             aria-label="End Time"
diff --git a/apps/webservice/src/app/[workspaceSlug]/(app)/_components/filter/DateConditionRender.tsx b/apps/webservice/src/app/[workspaceSlug]/(app)/_components/filter/DateConditionRender.tsx
index 0bd292974..7a17a8a06 100644
--- a/apps/webservice/src/app/[workspaceSlug]/(app)/_components/filter/DateConditionRender.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/(app)/_components/filter/DateConditionRender.tsx
@@ -82,7 +82,7 @@ export const DateConditionRender: React.FC<DateConditionRenderProps> = ({
       <div className="col-span-7">
         <DateTimePicker
           value={toZonedDateTime(new Date(value))}
-          onChange={setDate}
+          onChange={(value) => value != null && setDate(value)}
           aria-label={type}
           variant="filter"
         />
diff --git a/apps/webservice/src/app/[workspaceSlug]/(app)/systems/JobHistoryChart.tsx b/apps/webservice/src/app/[workspaceSlug]/(app)/systems/JobHistoryChart.tsx
index b7453564a..f6d5e8b06 100644
--- a/apps/webservice/src/app/[workspaceSlug]/(app)/systems/JobHistoryChart.tsx
+++ b/apps/webservice/src/app/[workspaceSlug]/(app)/systems/JobHistoryChart.tsx
@@ -272,7 +272,7 @@ export const JobHistoryChart: React.FC<{
                 animationDuration={animationDuration}
                 fill={color}
                 onClick={(e) => {
-                  const start = new Date(e.date);
+                  const start = new Date((e as any).date);
                   const end = addDays(start, 1);
 
                   const afterStartCondition: JobCondition = {
diff --git a/packages/ui/src/date-time-picker/date-time-picker.tsx b/packages/ui/src/date-time-picker/date-time-picker.tsx
index 9cc458e63..5b2e609d3 100644
--- a/packages/ui/src/date-time-picker/date-time-picker.tsx
+++ b/packages/ui/src/date-time-picker/date-time-picker.tsx
@@ -1,4 +1,3 @@
-/* eslint-disable  @typescript-eslint/unbound-method */
 "use client";
 
 import type { DateValue } from "react-aria";
@@ -71,7 +70,7 @@ const DateTimePicker = React.forwardRef<
               <TimeField
                 aria-label="time-field"
                 value={state.timeValue}
-                onChange={state.setTimeValue}
+                onChange={(value) => value != null && state.setTimeValue(value)}
               />
             )}
           </div>