fixed ui: [UI] Data Insights UI does not show scheduling options and range selector not including last day bug (#11288)

* fixed ui: [UI] Data Insights UI does not show scheduling options and range selector not including last day bug

* removing subtraction logic

* fixed time range issue

* cypress fix

openmetadata-ui/src/main/resources/ui/src/components/AddIngestion/AddIngestion.component.tsx

@@ -778,6 +778,7 @@ const AddIngestion = ({
 
         {activeIngestionStep === 4 && (
           <ScheduleInterval
+            disabledCronChange={pipelineType === PipelineType.DataInsight}
             includePeriodOptions={
               pipelineType === PipelineType.DataInsight ? ['day'] : undefined
             }

openmetadata-ui/src/main/resources/ui/src/components/AddIngestion/Steps/ScheduleInterval.tsx

@@ -20,6 +20,7 @@ import CronEditor from '../../common/CronEditor/CronEditor';
 import { ScheduleIntervalProps } from '../addIngestion.interface';
 
 const ScheduleInterval = ({
+  disabledCronChange,
   includePeriodOptions,
   onBack,
   onChange,
@@ -39,6 +40,7 @@ const ScheduleInterval = ({
       <Col span={24}>
         <div>
           <CronEditor
+            disabledCronChange={disabledCronChange}
             includePeriodOptions={includePeriodOptions}
             value={repeatFrequency}
             onChange={handleRepeatFrequencyChange}

openmetadata-ui/src/main/resources/ui/src/components/AddIngestion/addIngestion.interface.ts

@@ -83,6 +83,7 @@ export type ScheduleIntervalProps = {
   repeatFrequency: string;
   includePeriodOptions?: string[];
   submitButtonLabel: string;
+  disabledCronChange?: boolean;
   onBack: () => void;
   onDeploy: () => void;
 };

openmetadata-ui/src/main/resources/ui/src/components/DatePickerMenu/DatePickerMenu.component.tsx

@@ -19,6 +19,7 @@ import {
   DEFAULT_SELECTED_RANGE,
   PROFILER_FILTER_RANGE,
 } from 'constants/profiler.constant';
+import { isUndefined } from 'lodash';
 import { MenuInfo } from 'rc-menu/lib/interface';
 import React, { useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -56,9 +57,9 @@ function DatePickerMenu({
     dateStrings
   ) => {
     if (values) {
-      const startTs = Date.parse(dateStrings[0]) / 1000;
+      const startTs = values[0]?.set({ h: 0, m: 0 }).utc().unix() ?? 0;
 
-      const endTs = Date.parse(dateStrings[1]) / 1000;
+      const endTs = values[1]?.set({ h: 23, m: 59 }).utc().unix() ?? 0;
 
       const daysCount = getDaysCount(dateStrings[0], dateStrings[1]);
 
@@ -78,8 +79,13 @@ function DatePickerMenu({
   };
 
   const handleOptionClick = ({ key }: MenuInfo) => {
-    const selectedNumberOfDays =
+    const filterRange =
-      PROFILER_FILTER_RANGE[key as keyof typeof PROFILER_FILTER_RANGE].days;
+      PROFILER_FILTER_RANGE[key as keyof typeof PROFILER_FILTER_RANGE];
+    if (isUndefined(filterRange)) {
+      return;
+    }
+
+    const selectedNumberOfDays = filterRange.days;
     const keyString = key as keyof typeof PROFILER_FILTER_RANGE;
     const startTs = getPastDatesTimeStampFromCurrentDate(selectedNumberOfDays);
 
@@ -108,6 +114,7 @@ function DatePickerMenu({
             <DatePicker.RangePicker
               bordered={false}
               clearIcon={<CloseCircleOutlined />}
+              format={(value) => value.utc().format('YYYY-MM-DD')}
               open={isMenuOpen}
               placement="bottomRight"
               suffixIcon={null}

openmetadata-ui/src/main/resources/ui/src/components/common/CronEditor/CronEditor.interface.ts

@@ -88,6 +88,7 @@ export interface CronEditorProp {
   value?: string;
   className?: string;
   disabled?: boolean;
+  disabledCronChange?: boolean;
   includePeriodOptions?: string[];
 }
 

openmetadata-ui/src/main/resources/ui/src/components/common/CronEditor/CronEditor.tsx

@@ -142,7 +142,7 @@ const CronEditor: FC<CronEditorProp> = (props) => {
     }
   }, [props, periodOptions]);
 
-  const { className, disabled } = props;
+  const { className, disabled, disabledCronChange } = props;
   const { selectedPeriod } = state;
 
   const startText = t('label.schedule-to-run-every');
@@ -557,7 +557,7 @@ const CronEditor: FC<CronEditorProp> = (props) => {
             <Select
               className="w-full"
               data-testid="cron-type"
-              disabled={disabled}
+              disabled={disabledCronChange || disabled}
               id="cronType"
               options={filteredPeriodOptions.map(({ label, value }) => ({
                 label,

openmetadata-ui/src/main/resources/ui/src/utils/TimeUtils.ts

@@ -196,7 +196,10 @@ export const getPastDaysDateTimeMillis = (days: number) =>
 export const getFormattedDateFromSeconds = (
   timeStamp: number,
   format?: string
-) => DateTime.fromSeconds(timeStamp || 0).toFormat(format || 'dd/MMM HH:mm');
+) =>
+  DateTime.fromSeconds(timeStamp || 0)
+    .toUTC()
+    .toFormat(format || 'dd/MMM HH:mm');
 /**
  * It takes a timestamp in milliseconds and returns a formatted date string
  * @param {number} timeStamp - The timeStamp in milliseconds.
@@ -205,7 +208,10 @@ export const getFormattedDateFromSeconds = (
 export const getFormattedDateFromMilliSeconds = (
   timeStamp: number,
   format?: string
-) => DateTime.fromMillis(timeStamp || 0).toFormat(format || 'dd/MMM');
+) =>
+  DateTime.fromMillis(timeStamp || 0)
+    .toUTC()
+    .toFormat(format || 'dd/MMM');
 
 /**
  * It takes a timestamp in milliseconds and returns a formatted date like 'Oct 14, 1983, 9:30 AM'.