fix: added support for timePrecision

app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/FormWidgets/DatePicker_2_Default_spec.js

@@ -19,6 +19,76 @@ describe("DatePicker Widget Property pane tests with js bindings", function() {
     );
   });
 
+  it("Datepicker default time picker validation by Time precision", function() {
+    // default value in property pane
+    cy.openPropertyPane("datepickerwidget2");
+    cy.get(".t--property-control-timeprecision span[type='p1']").should(
+      "have.text",
+      "Minute",
+    );
+
+    // default in date picker
+    cy.get(".t--widget-datepickerwidget2 input").click();
+    cy.wait(200);
+    // datepicker is open
+    cy.get(".bp3-popover .bp3-datepicker").should("exist");
+    // checking timepicker
+    cy.get(".bp3-datepicker-timepicker-wrapper .bp3-timepicker-input-row")
+      .children()
+      .should("have.length", 3);
+    cy.closePropertyPane();
+  });
+
+  it("Hide Time picker from Datepicker", function() {
+    // default value in property pane
+    cy.openPropertyPane("datepickerwidget2");
+
+    cy.get(".t--property-control-timeprecision .bp3-popover-target")
+      .last()
+      .click();
+    cy.get(".t--dropdown-option")
+      .children()
+      .contains("None")
+      .click();
+    cy.wait("@updateLayout");
+    // default in date picker
+
+    cy.get(".t--widget-datepickerwidget2 input").click();
+    cy.wait(200);
+    // datepicker is open
+    cy.get(".bp3-popover .bp3-datepicker").should("exist");
+    // checking timepicker not showing
+    cy.get(
+      ".bp3-datepicker-timepicker-wrapper .bp3-timepicker-input-row",
+    ).should("not.exist");
+    cy.closePropertyPane();
+  });
+
+  it("set second field in time picker for Datepicker", function() {
+    // default value in property pane
+    cy.openPropertyPane("datepickerwidget2");
+
+    cy.get(".t--property-control-timeprecision .bp3-popover-target")
+      .last()
+      .click();
+    cy.get(".t--dropdown-option")
+      .children()
+      .contains("Second")
+      .click();
+    cy.wait("@updateLayout");
+    // default in date picker
+
+    cy.get(".t--widget-datepickerwidget2 input").click();
+    cy.wait(200);
+    // datepicker is open
+    cy.get(".bp3-popover .bp3-datepicker").should("exist");
+    // checking timepicker
+    cy.get(".bp3-datepicker-timepicker-wrapper .bp3-timepicker-input-row")
+      .children()
+      .should("have.length", 5);
+    cy.closePropertyPane();
+  });
+
   it("Text widgets binding with datepicker", function() {
     cy.SearchEntityandOpen("Text1");
     cy.testJsontext("text", "{{DatePicker1.formattedDate}}");

app/client/src/widgets/DatePickerWidget2/component/index.tsx

@@ -10,9 +10,8 @@ import { ComponentProps } from "widgets/BaseComponent";
 import { DateInput } from "@blueprintjs/datetime";
 import moment from "moment-timezone";
 import "../../../../node_modules/@blueprintjs/datetime/lib/css/blueprint-datetime.css";
-import { DatePickerType } from "../constants";
+import { DatePickerType, TimePrecision } from "../constants";
 import { WIDGET_PADDING } from "constants/WidgetConstants";
-import { TimePrecision } from "@blueprintjs/datetime";
 import { Colors } from "constants/Colors";
 import { ISO_DATE_FORMAT } from "constants/WidgetValidation";
 import ErrorTooltip from "components/editorComponents/ErrorTooltip";
@@ -169,7 +168,11 @@ class DatePickerComponent extends React.Component<
               }}
               shortcuts={this.props.shortcuts}
               showActionsBar
-              timePrecision={TimePrecision.MINUTE}
+              timePrecision={
+                this.props.timePrecision === TimePrecision.NONE
+                  ? undefined
+                  : this.props.timePrecision
+              }
               value={value}
             />
           </ErrorTooltip>
@@ -258,6 +261,7 @@ interface DatePickerComponentProps extends ComponentProps {
   withoutPortal?: boolean;
   closeOnSelection: boolean;
   shortcuts: boolean;
+  timePrecision: TimePrecision;
 }
 
 interface DatePickerComponentState {

app/client/src/widgets/DatePickerWidget2/constants.ts

@@ -1 +1,8 @@
 export type DatePickerType = "DATE_PICKER" | "DATE_RANGE_PICKER";
+
+export enum TimePrecision {
+  NONE = "None",
+  MILLISECOND = "millisecond",
+  MINUTE = "minute",
+  SECOND = "second",
+}

app/client/src/widgets/DatePickerWidget2/index.ts

@@ -2,6 +2,7 @@ import Widget from "./widget";
 import IconSVG from "./icon.svg";
 import moment from "moment";
 import { GRID_DENSITY_MIGRATION_V1 } from "widgets/constants";
+import { TimePrecision } from "./constants";
 
 export const CONFIG = {
   type: Widget.getWidgetType(),
@@ -23,6 +24,7 @@ export const CONFIG = {
     isRequired: false,
     closeOnSelection: false,
     shortcuts: false,
+    timePrecision: TimePrecision.MINUTE,
     animateLoading: true,
   },
   properties: {

app/client/src/widgets/DatePickerWidget2/widget/index.tsx

@@ -8,7 +8,7 @@ import { ValidationTypes } from "constants/WidgetValidation";
 import { DerivedPropertiesMap } from "utils/WidgetFactory";
 
 import moment from "moment";
-import { DatePickerType } from "../constants";
+import { DatePickerType, TimePrecision } from "../constants";
 
 class DatePickerWidget extends BaseWidget<DatePickerWidget2Props, WidgetState> {
   static getPropertyPaneConfig() {
@@ -123,6 +123,41 @@ class DatePickerWidget extends BaseWidget<DatePickerWidget2Props, WidgetState> {
             validation: { type: ValidationTypes.TEXT },
             hideSubText: true,
           },
+          {
+            propertyName: "timePrecision",
+            label: "Time precision",
+            controlType: "DROP_DOWN",
+            helpText: "Sets the different time picker or hide.",
+            defaultValue: TimePrecision.MINUTE,
+            options: [
+              {
+                label: "None",
+                value: TimePrecision.NONE,
+              },
+              {
+                label: "Minute",
+                value: TimePrecision.MINUTE,
+              },
+              {
+                label: "Second",
+                value: TimePrecision.SECOND,
+              },
+            ],
+            isJSConvertible: true,
+            isBindProperty: true,
+            isTriggerProperty: false,
+            validation: {
+              type: ValidationTypes.TEXT,
+              params: {
+                allowedValues: [
+                  TimePrecision.NONE,
+                  TimePrecision.MINUTE,
+                  TimePrecision.SECOND,
+                ],
+                default: TimePrecision.MINUTE,
+              },
+            },
+          },
           {
             propertyName: "isRequired",
             label: "Required",
@@ -258,6 +293,7 @@ class DatePickerWidget extends BaseWidget<DatePickerWidget2Props, WidgetState> {
         onDateSelected={this.onDateSelected}
         selectedDate={this.props.value}
         shortcuts={this.props.shortcuts}
+        timePrecision={this.props.timePrecision}
         widgetId={this.props.widgetId}
       />
     );
@@ -293,6 +329,7 @@ export interface DatePickerWidget2Props extends WidgetProps {
   isRequired?: boolean;
   closeOnSelection: boolean;
   shortcuts: boolean;
+  timePrecision: TimePrecision;
 }
 
 export default DatePickerWidget;

app/client/src/widgets/TableWidget/component/CascadeFields.tsx

@@ -22,6 +22,7 @@ import { RenderOptionWrapper } from "./TableStyledWrappers";
 
 //TODO(abhinav): Fix this cross import between widgets
 import DatePickerComponent from "widgets/DatePickerWidget2/component";
+import { TimePrecision } from "widgets/DatePickerWidget2/constants";
 
 const StyledRemoveIcon = styled(
   ControlIcons.CLOSE_CIRCLE_CONTROL as AnyStyledComponent,
@@ -572,6 +573,7 @@ function Fields(props: CascadeFieldProps & { state: CascadeFieldState }) {
             onDateSelected={onDateSelected}
             selectedDate={value}
             shortcuts={false}
+            timePrecision={TimePrecision.MINUTE}
             widgetId=""
             withoutPortal
           />