[WC-1293]: Calendar event date visibility (#1630)

Author: samuelreichert

packages/pluggableWidgets/calendar-web/src/Calendar.xml

@@ -83,6 +83,10 @@
                     <caption>Enable create</caption>
                     <description />
                 </property>
+                <property key="showEventDate" type="boolean" defaultValue="true">
+                    <caption>Show event date range</caption>
+                    <description>Show the start and end date of the event</description>
+                </property>
                 <property key="defaultView" type="enumeration" defaultValue="month">
                     <caption>Initial selected view</caption>
                     <description>Work week and agenda are only available in custom views</description>

packages/pluggableWidgets/calendar-web/src/__tests__/Calendar.spec.tsx

@@ -22,7 +22,8 @@ const defaultProps: CalendarContainerProps = {
     minHeight: 400,
     maxHeightUnit: "none",
     maxHeight: 400,
-    overflowY: "auto"
+    overflowY: "auto",
+    showEventDate: true
 };
 
 beforeAll(() => {

packages/pluggableWidgets/calendar-web/src/utils/calendar-utils.ts

@@ -124,12 +124,15 @@ export function extractCalendarProps(props: CalendarContainerProps): DragAndDrop
         }
     };
 
+    const formats = props.showEventDate ? {} : { eventTimeRangeFormat: () => "" };
+
     return {
         components: {
             toolbar: CustomToolbar
         },
         defaultView: props.defaultView,
         events,
+        formats,
         localizer,
         resizable: props.editable !== "never",
         selectable: props.enableCreate,

packages/pluggableWidgets/calendar-web/typings/CalendarProps.d.ts

@@ -40,6 +40,7 @@ export interface CalendarContainerProps {
     view: ViewEnum;
     editable: EditableEnum;
     enableCreate: boolean;
+    showEventDate: boolean;
     defaultView: DefaultViewEnum;
     startDateAttribute?: EditableValue<Date>;
     eventDataAttribute?: EditableValue<string>;
@@ -80,6 +81,7 @@ export interface CalendarPreviewProps {
     view: ViewEnum;
     editable: EditableEnum;
     enableCreate: boolean;
+    showEventDate: boolean;
     defaultView: DefaultViewEnum;
     startDateAttribute: string;
     eventDataAttribute: string;