fix(datetime): missing parser defaults

DevoInc · Jan 21, 2025 · 97a90ec · 97a90ec
1 parent f36efeb
commit 97a90ec
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 30 deletions.
diff --git a/packages/datetime/src/components/DateTimeFloatingPicker/DateTimeFloatingPicker.stories.tsx b/packages/datetime/src/components/DateTimeFloatingPicker/DateTimeFloatingPicker.stories.tsx
@@ -28,8 +28,6 @@ export const Playground: Story = {
           value={value}
           onChange={(ts) => {
             setValue(ts);
-            // eslint-disable-next-line no-console
-            console.log({ onChange: ts });
           }}
         />
       );
@@ -53,8 +51,6 @@ export const WithoutButtons: Story = {
           autoApply
           onChange={(ts) => {
             setValue(ts);
-            // eslint-disable-next-line no-console
-            console.log(`OnChange ${ts}`);
           }}
         />
       );
@@ -88,8 +84,6 @@ export const CustomParser: Story = {
           }}
           onChange={(ts) => {
             setValue(ts);
-            // eslint-disable-next-line no-console
-            console.log(`OnChange ${ts}`);
           }}
         />
       );

diff --git a/packages/datetime/src/components/DateTimeFloatingPicker/DateTimeFloatingPicker.tsx b/packages/datetime/src/components/DateTimeFloatingPicker/DateTimeFloatingPicker.tsx
@@ -75,7 +75,7 @@ export const DateTimeFloatingPicker: React.FC<DateTimeFloatingPickerProps> = ({
   onChange = () => null,
   autoApply = false,
   onClose = () => null,
-  parseDate = getDefaultParseDate,
+  parseDate = getDefaultParseDate(),
   style: customStyles,
   value = new Date().getTime(),
   helper,

diff --git a/packages/datetime/src/components/DateTimeRangeInput/DateTimeRangeInput.stories.tsx b/packages/datetime/src/components/DateTimeRangeInput/DateTimeRangeInput.stories.tsx
@@ -5,6 +5,7 @@ import { DateTimeRangeInput } from './DateTimeRangeInput';
 import { useDateTimeRangeInputValidation } from './hooks';
 import { formatDate, validateRange } from '../../helpers';
 import { getDefaultParseDate, getDefaultParseRange } from '../../parsers';
+import { TDateRange } from '../../declarations';
 
 const meta: Meta<typeof DateTimeRangeInput> = {
   title: 'Components/Datetime/DateTimeRangeInput',
@@ -69,30 +70,29 @@ export const RangeValidation: Story = {
   tags: ['isHidden'],
   render: (args) =>
     ((props) => {
-      const [value, setValue] = React.useState([
+      const [value, setValue] = React.useState<TDateRange>([
         new Date().getTime() - 3600000,
         new Date().getTime(),
       ]);
 
-      const { inputValue, inputOnChange, errors } =
+      const { inputValue, inputOnChange, errors, rangeErrors } =
         useDateTimeRangeInputValidation({
           value,
           onChange: setValue,
           reprDate: (ts: number) => formatDate(ts),
-          parseDate: getDefaultParseDate,
+          parseDate: getDefaultParseDate(),
+          parseRange: getDefaultParseRange(),
         });
 
-      const isValidRange = validateRange(value);
-
       return (
         <DateTimeRangeInput
           {...props}
           value={inputValue}
           onChange={inputOnChange}
           statuses={errors.map((e) => (e.length > 0 ? 'error' : 'base'))}
           helpers={errors.map((e) => (e.length > 0 ? e[0] : null))}
-          status={isValidRange ? 'base' : 'error'}
-          helper={isValidRange ? null : 'Invalid range'}
+          status={rangeErrors.length > 0 ? 'error' : 'base'}
+          helper={rangeErrors.length > 0 ? rangeErrors[0] : null}
         />
       );
     })(args),
@@ -111,7 +111,6 @@ export const UsingExpressions: Story = {
         <DateTimeRangeInput
           {...props}
           value={value}
-          // onBlur={onBlurCallback}
           onChange={(index: number, newValue: string) => {
             const newRange = [...value];
             newRange[index] = newValue;
@@ -123,20 +122,5 @@ export const UsingExpressions: Story = {
     })(args),
   args: {
     value: ['15m - now()', 'now()'],
-    // parseExpression: (exp: string) => {
-    //   if (exp.includes('now')) {
-    //     return {
-    //       isValid: true,
-    //       value: new Date().getTime(),
-    //       errors: [],
-    //     };
-    //   } else {
-    //     return {
-    //       isValid: false,
-    //       value: null,
-    //       errors: ['Invalid expression'],
-    //     };
-    //   }
-    // },
   },
 };