dashboard: fix CellEditor not allowing to clear inferred dates (#42961)

GitOrigin-RevId: 64ee37b6c8691bbad30b9dc9fb8e9a1585db045a

Author: atrakh

npm-packages/dashboard-common/src/features/data/components/FilterEditor/DateTimePicker.tsx

@@ -19,7 +19,7 @@ type DateTimePickerProps = {
   onError?: (error: string | undefined) => void;
   onKeyDown?: (
     event: React.KeyboardEvent<HTMLInputElement>,
-    date: Date,
+    date: Date | undefined,
   ) => void;
 };
 
@@ -211,9 +211,13 @@ export function DateTimePicker({
   };
 
   const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
+    if (!onKeyDown) return;
+
     const parsedDate = parse(inputValue, dateTimeFormat, new Date());
     if (!Number.isNaN(parsedDate.getTime())) {
-      onKeyDown?.(event, parsedDate);
+      onKeyDown(event, parsedDate);
+    } else if (inputValue.trim() === "" && event.key === "Enter") {
+      onKeyDown(event, undefined);
     }
   };
 

npm-packages/dashboard-common/src/features/data/components/Table/DataCell/CellEditor.tsx

@@ -81,7 +81,7 @@ export function CellEditor({
           unset
         </div>
       )}
-      {showAsDate && isTimestampLike ? (
+      {showAsDate && isTimestampLike && typeof editedValue === "number" ? (
         <div className="w-full">
           <DateTimePicker
             date={new Date(editedValue as number)}
@@ -91,8 +91,18 @@ export function CellEditor({
             onError={setError}
             onKeyDown={(e, date) => {
               if (e.key === "Enter") {
-                setEditedValue(date.getTime());
-                void saveEditedValue(date.getTime());
+                if (date === undefined) {
+                  // User cleared the input - check if undefined is allowed
+                  if (!allowTopLevelUndefined) {
+                    setError("This field is required and cannot be unset");
+                    return;
+                  }
+                  setEditedValue(UNDEFINED_PLACEHOLDER);
+                  void saveEditedValue(UNDEFINED_PLACEHOLDER);
+                } else {
+                  setEditedValue(date.getTime());
+                  void saveEditedValue(date.getTime());
+                }
               }
             }}
           />