prototype working

adobecom · Sep 4, 2024 · 77d71a7 · 77d71a7
1 parent 030c7c4
commit 77d71a7
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 13 deletions.
diff --git a/ecc/blocks/event-info-component/event-info-component.css b/ecc/blocks/event-info-component/event-info-component.css
@@ -42,7 +42,7 @@
 .event-info-component .date-time-row > .date-picker {
   position: relative;
   border-bottom: 1px solid var(--color-black);
-  min-width: 280px;
+  min-width: 300px;
   display: flex;
   align-items: center;
   gap: 8px;

diff --git a/ecc/blocks/form-handler/controllers/event-info-component-controller.js b/ecc/blocks/form-handler/controllers/event-info-component-controller.js
@@ -357,9 +357,13 @@ function checkEventDuplication(event, compareMetrics) {
 
 export default async function init(component, props) {
   const allEventsResp = await getEvents();
-  const dupEventError = await miloReplaceKey('duplicate-event-title-error');
   const allEvents = allEventsResp?.events;
   const eventData = props.eventDataResp;
+  const sameSeriesEvents = allEvents?.filter((e) => {
+    const matchInPayload = e.seriesId === props.payload.seriesId;
+    const matchInResp = e.seriesId === eventData.seriesId;
+    return matchInPayload || matchInResp;
+  }) || [];
 
   const eventTitleInput = component.querySelector('#info-field-event-title');
   const startTimeInput = component.querySelector('#time-picker-start-time');
@@ -368,13 +372,7 @@ export default async function init(component, props) {
 
   initCalendar(component);
 
-  eventTitleInput.addEventListener('change', () => {
-    const sameSeriesEvents = allEvents?.filter((e) => {
-      const matchInPayload = e.seriesId === props.payload.seriesId;
-      const matchInResp = e.seriesId === eventData.seriesId;
-      return matchInPayload || matchInResp;
-    }) || [];
-
+  eventTitleInput.addEventListener('input', () => {
     BlockMediator.set('eventDupMetrics', { ...BlockMediator.get('eventDupMetrics'), title: eventTitleInput.value });
   });
 
@@ -418,14 +416,16 @@ export default async function init(component, props) {
   BlockMediator.subscribe('eventDupMetrics', (store) => {
     const metrics = store.newValue;
 
-    const isDup = allEvents?.some((e) => checkEventDuplication(e, metrics));
+    const isDup = sameSeriesEvents?.some((e) => checkEventDuplication(e, metrics));
     if (isDup) {
       props.el.classList.add('show-dup-event-error');
       eventTitleInput.invalid = true;
     } else {
       props.el.classList.remove('show-dup-event-error');
       eventTitleInput.invalid = false;
     }
+
+    eventTitleInput.dispatchEvent(new Event('change'));
   });
 
   const {
@@ -451,6 +451,15 @@ export default async function init(component, props) {
     changeInputValue(endTimeInput, 'value', localEndTime || '');
     changeInputValue(component.querySelector('#time-zone-select-input'), 'value', `${timezone}` || '');
 
+    BlockMediator.set('eventDupMetrics', {
+      ...BlockMediator.get('eventDupMetrics'),
+      ...{
+        title,
+        startDate: localStartDate,
+        eventId: eventData.eventId,
+      },
+    });
+
     datePicker.dataset.startDate = localStartDate || '';
     datePicker.dataset.endDate = localEndDate || '';
     updateInput(component, {

diff --git a/ecc/blocks/form-handler/controllers/venue-info-component-controller.js b/ecc/blocks/form-handler/controllers/venue-info-component-controller.js
@@ -179,7 +179,7 @@ export default async function init(component, props) {
     changeInputValue(placeIdInput, 'value', placeId);
     changeInputValue(mapUrlInput, 'value', mapUrl);
     changeInputValue(gmtoffsetInput, 'value', venue.gmtOffset);
-    BlockMediator.set('eventDupMetrics', { ...BlockMediator.get('eventDupMetrics'), placeId });
+    BlockMediator.set('eventDupMetrics', { ...BlockMediator.get('eventDupMetrics'), city });
 
     if (venueName) {
       component.classList.add('prefilled');

diff --git a/ecc/blocks/form-handler/form-handler.css b/ecc/blocks/form-handler/form-handler.css
@@ -82,7 +82,10 @@
 .form-handler.show-dup-event-error #info-field-event-title  {
   --mod-textfield-icon-size-invalid: 16px;
   --mod-textfield-border-color-invalid-default: unset;
-
+}
+
+.form-handler.show-dup-event-error #info-field-event-title sp-help-text {
+  display: flex;
 }
 
 .form-handler .main-frame {
@@ -103,7 +106,6 @@
   justify-content: center;
 }
 
-
 .form-handler .side-menu,
 .form-handler .main-frame,
 .form-handler .form-handler-ctas-panel,

diff --git a/ecc/blocks/form-handler/form-handler.js b/ecc/blocks/form-handler/form-handler.js
@@ -638,6 +638,7 @@ function initNavigation(props) {
 
   navItems.forEach((nav, i) => {
     nav.addEventListener('click', async () => {
+      if (nav.closest('li').classList.contains('active')) return;
       if (!nav.disabled && !sideMenu.classList.contains('disabled')) {
         sideMenu.classList.add('disabled');