From 66ad768dd9c739b4e4a0d085795d13375212a56f Mon Sep 17 00:00:00 2001 From: Gautam Bajaj Date: Thu, 12 Sep 2024 11:11:15 +0530 Subject: [PATCH] Making Event update sync --- .../checkbox-component-controller.js | 4 + .../event-agenda-component-controller.js | 4 + ...ent-community-link-component-controller.js | 4 + .../event-format-component-controller.js | 4 + .../event-info-component-controller.js | 4 + .../event-partners-component-controller.js | 4 + .../event-topics-component-controller.js | 4 + .../img-upload-component-controller.js | 4 + .../product-promotion-component-controller.js | 4 + .../profile-component-controller.js | 4 + ...gistration-details-component-controller.js | 4 + ...egistration-fields-component-controller.js | 4 + .../terms-conditions-component-controller.js | 4 + .../venue-info-component-controller.js | 119 ++++++++++-------- ecc/blocks/form-handler/form-handler.js | 26 +++- 15 files changed, 138 insertions(+), 59 deletions(-) diff --git a/ecc/blocks/form-handler/controllers/checkbox-component-controller.js b/ecc/blocks/form-handler/controllers/checkbox-component-controller.js index 19ce6dc6..ff78c213 100644 --- a/ecc/blocks/form-handler/controllers/checkbox-component-controller.js +++ b/ecc/blocks/form-handler/controllers/checkbox-component-controller.js @@ -47,3 +47,7 @@ export async function onUpdate(_component, _props) { export function onSubmit(component, props) { // Do nothing } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/event-agenda-component-controller.js b/ecc/blocks/form-handler/controllers/event-agenda-component-controller.js index fe1bee27..c3865d02 100644 --- a/ecc/blocks/form-handler/controllers/event-agenda-component-controller.js +++ b/ecc/blocks/form-handler/controllers/event-agenda-component-controller.js @@ -33,3 +33,7 @@ export default function init(component, props) { showAgendaPostEvent.checked = eventData.showAgendaPostEvent; } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/event-community-link-component-controller.js b/ecc/blocks/form-handler/controllers/event-community-link-component-controller.js index 01d23a82..77c76d85 100644 --- a/ecc/blocks/form-handler/controllers/event-community-link-component-controller.js +++ b/ecc/blocks/form-handler/controllers/event-community-link-component-controller.js @@ -42,3 +42,7 @@ export default function init(component, props) { updateInputState(); } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/event-format-component-controller.js b/ecc/blocks/form-handler/controllers/event-format-component-controller.js index d12bd22b..bd527715 100644 --- a/ecc/blocks/form-handler/controllers/event-format-component-controller.js +++ b/ecc/blocks/form-handler/controllers/event-format-component-controller.js @@ -158,3 +158,7 @@ export function onSubmit(component, props) { props.payload = { ...props.payload, ...eventFormat }; } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/event-info-component-controller.js b/ecc/blocks/form-handler/controllers/event-info-component-controller.js index 0ea0bd9e..d7538031 100644 --- a/ecc/blocks/form-handler/controllers/event-info-component-controller.js +++ b/ecc/blocks/form-handler/controllers/event-info-component-controller.js @@ -474,3 +474,7 @@ export default async function init(component, props) { component.classList.add('prefilled'); } } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/event-partners-component-controller.js b/ecc/blocks/form-handler/controllers/event-partners-component-controller.js index 2cbd80f5..1ecaa5d7 100644 --- a/ecc/blocks/form-handler/controllers/event-partners-component-controller.js +++ b/ecc/blocks/form-handler/controllers/event-partners-component-controller.js @@ -173,3 +173,7 @@ export default async function init(component, props) { const partnerVisible = component.querySelector('#partners-visible'); partnerVisible.checked = eventData.showSponsors; } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/event-topics-component-controller.js b/ecc/blocks/form-handler/controllers/event-topics-component-controller.js index 04042772..1488807a 100644 --- a/ecc/blocks/form-handler/controllers/event-topics-component-controller.js +++ b/ecc/blocks/form-handler/controllers/event-topics-component-controller.js @@ -32,3 +32,7 @@ export default function init(component, props) { if (topics.length) component.classList.add('prefilled'); } } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/img-upload-component-controller.js b/ecc/blocks/form-handler/controllers/img-upload-component-controller.js index 67abd21a..1138f0e4 100644 --- a/ecc/blocks/form-handler/controllers/img-upload-component-controller.js +++ b/ecc/blocks/form-handler/controllers/img-upload-component-controller.js @@ -174,3 +174,7 @@ export default async function init(component, props) { } } } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/product-promotion-component-controller.js b/ecc/blocks/form-handler/controllers/product-promotion-component-controller.js index 9161dfa9..1bec3156 100644 --- a/ecc/blocks/form-handler/controllers/product-promotion-component-controller.js +++ b/ecc/blocks/form-handler/controllers/product-promotion-component-controller.js @@ -121,3 +121,7 @@ export default async function init(component, props) { component.classList.add('prefilled'); } } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/profile-component-controller.js b/ecc/blocks/form-handler/controllers/profile-component-controller.js index 665c1298..ee0eae9b 100644 --- a/ecc/blocks/form-handler/controllers/profile-component-controller.js +++ b/ecc/blocks/form-handler/controllers/profile-component-controller.js @@ -131,3 +131,7 @@ export default async function init(component, props) { profileContainer.requestUpdate(); component.classList.add('prefilled'); } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/registration-details-component-controller.js b/ecc/blocks/form-handler/controllers/registration-details-component-controller.js index be41f423..d19f3fad 100644 --- a/ecc/blocks/form-handler/controllers/registration-details-component-controller.js +++ b/ecc/blocks/form-handler/controllers/registration-details-component-controller.js @@ -72,3 +72,7 @@ export async function onUpdate(component, props) { export default function init(component, props) { prefillFields(component, props); } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/registration-fields-component-controller.js b/ecc/blocks/form-handler/controllers/registration-fields-component-controller.js index 437d2440..6fc20673 100644 --- a/ecc/blocks/form-handler/controllers/registration-fields-component-controller.js +++ b/ecc/blocks/form-handler/controllers/registration-fields-component-controller.js @@ -51,3 +51,7 @@ export default function init(component, props) { if (eventData.rsvpFormFields?.required?.includes(cb.name)) cb.checked = true; }); } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/terms-conditions-component-controller.js b/ecc/blocks/form-handler/controllers/terms-conditions-component-controller.js index c0dcd5e8..ce84b020 100644 --- a/ecc/blocks/form-handler/controllers/terms-conditions-component-controller.js +++ b/ecc/blocks/form-handler/controllers/terms-conditions-component-controller.js @@ -78,3 +78,7 @@ export default async function init(component, props) { export function onSubmit(_component, _props) { // Do nothing } + +export function onEventUpdate(component, props) { + // Do nothing +} diff --git a/ecc/blocks/form-handler/controllers/venue-info-component-controller.js b/ecc/blocks/form-handler/controllers/venue-info-component-controller.js index 380ecd3e..284d08d0 100644 --- a/ecc/blocks/form-handler/controllers/venue-info-component-controller.js +++ b/ecc/blocks/form-handler/controllers/venue-info-component-controller.js @@ -190,68 +190,79 @@ export default async function init(component, props) { if (showVenuePostEvent) { changeInputValue(component.querySelector('#checkbox-venue-info-visible'), 'checked', showVenuePostEvent); } +} - const getVenueDataInForm = () => { - const venueName = venueNameInput.value; - const address = addressInput.value; - const city = cityInput.value; - const state = stateInput.value; - const stateCode = stateCodeInput.value; - const postalCode = postalCodeInput.value; - const country = countryInput.value; - const placeId = placeIdInput.value; - const mapUrl = mapUrlInput.value; - const lat = +placeLatInput.value; - const lon = +placeLngInput.value; - const gmtOffset = +gmtoffsetInput.value; - - const venueData = { - venueName, - address, - city, - state, - stateCode, - postalCode, - country, - placeId, - mapUrl, - coordinates: { - lat, - lon, - }, - gmtOffset, - }; +const getVenueDataInForm = (component) => { + const venueNameInput = component.querySelector('#venue-info-venue-name'); + const addressInput = component.querySelector('#venue-info-venue-address'); + const cityInput = component.querySelector('#location-city'); + const stateInput = component.querySelector('#location-state'); + const stateCodeInput = component.querySelector('#location-state-code'); + const postalCodeInput = component.querySelector('#location-zip-code'); + const countryInput = component.querySelector('#location-country'); + const placeLatInput = component.querySelector('#google-place-lat'); + const placeLngInput = component.querySelector('#google-place-lng'); + const placeIdInput = component.querySelector('#google-place-id'); + const mapUrlInput = component.querySelector('#google-map-url'); + const gmtoffsetInput = component.querySelector('#google-place-gmt-offset'); - return venueData; + const venueName = venueNameInput.value; + const address = addressInput.value; + const city = cityInput.value; + const state = stateInput.value; + const stateCode = stateCodeInput.value; + const postalCode = postalCodeInput.value; + const country = countryInput.value; + const placeId = placeIdInput.value; + const mapUrl = mapUrlInput.value; + const lat = +placeLatInput.value; + const lon = +placeLngInput.value; + const gmtOffset = +gmtoffsetInput.value; + + const venueData = { + venueName, + address, + city, + state, + stateCode, + postalCode, + country, + placeId, + mapUrl, + coordinates: { + lat, + lon, + }, + gmtOffset, }; - const onEventUpdate = async () => { - if (component.closest('.fragment')?.classList.contains('hidden')) return; + return venueData; +}; - const venueData = getVenueDataInForm(); +export async function onEventUpdate(component, props) { + if (component.closest('.fragment')?.classList.contains('hidden')) return; - let resp; - if (!props.eventDataResp.venue) { - resp = await createVenue(props.eventDataResp.eventId, venueData); - } else if (props.eventDataResp.venue.placeId !== venueData.placeId) { - resp = await replaceVenue(props.eventDataResp.eventId, props.eventDataResp.venue.venueId, { - ...props.eventDataResp.venue, - ...venueData, - }); + const venueData = getVenueDataInForm(component); - if (resp.error) { - buildErrorMessage(props, resp); - } - } + let resp; + if (!props.eventDataResp.venue) { + resp = await createVenue(props.eventDataResp.eventId, venueData); + } else if (props.eventDataResp.venue.placeId !== venueData.placeId) { + resp = await replaceVenue(props.eventDataResp.eventId, props.eventDataResp.venue.venueId, { + ...props.eventDataResp.venue, + ...venueData, + }); - if (resp) { - props.eventDataResp = { ...props.eventDataResp, ...resp }; - props.payload = { - ...props.payload, - showVenuePostEvent: venueData.showVenuePostEvent, - }; + if (resp.error) { + buildErrorMessage(props, resp); } - }; + } - props.el.addEventListener('eventUpdated', onEventUpdate); + if (resp) { + props.eventDataResp = { ...props.eventDataResp, ...resp }; + props.payload = { + ...props.payload, + showVenuePostEvent: venueData.showVenuePostEvent, + }; + } } diff --git a/ecc/blocks/form-handler/form-handler.js b/ecc/blocks/form-handler/form-handler.js index f2cb1756..dd5af46b 100644 --- a/ecc/blocks/form-handler/form-handler.js +++ b/ecc/blocks/form-handler/form-handler.js @@ -278,6 +278,22 @@ async function gatherValues(props) { await Promise.all(allComponentPromises); } +async function handleEventUpdate(props) { + const allComponentPromises = VANILLA_COMPONENTS.map(async (comp) => { + const mappedComponents = props.el.querySelectorAll(`.${comp}-component`); + if (!mappedComponents.length) return {}; + + const promises = Array.from(mappedComponents).map(async (component) => { + const { onEventUpdate } = await import(`./controllers/${comp}-component-controller.js`); + return onEventUpdate(component, props); + }); + + return Promise.all(promises); + }); + + await Promise.all(allComponentPromises); +} + async function updateComponents(props) { const allComponentPromises = VANILLA_COMPONENTS.map(async (comp) => { const mappedComponents = props.el.querySelectorAll(`.${comp}-component`); @@ -399,33 +415,33 @@ async function saveEvent(props, options = { toPublish: false }) { let resp; - const onEventSave = () => { + const onEventSave = async () => { if (!resp.error) { showSaveSuccessMessage(props); } - if (resp?.eventId) props.el.dispatchEvent(new CustomEvent('eventUpdated', { detail: { eventId: resp.eventId } })); + if (resp?.eventId) await handleEventUpdate(props); }; if (props.currentStep === 0 && !getFilteredCachedResponse().eventId) { resp = await createEvent(quickFilter(props.payload)); props.eventDataResp = { ...props.eventDataResp, ...resp }; updateDashboardLink(props); - onEventSave(); + await onEventSave(); } else if (props.currentStep <= props.maxStep && !options.toPublish) { resp = await updateEvent( getFilteredCachedResponse().eventId, getJoinedData(), ); props.eventDataResp = { ...props.eventDataResp, ...resp }; - onEventSave(); + await onEventSave(); } else if (options.toPublish) { resp = await publishEvent( getFilteredCachedResponse().eventId, getJoinedData(), ); props.eventDataResp = { ...props.eventDataResp, ...resp }; - if (resp?.eventId) document.dispatchEvent(new CustomEvent('eventUpdated', { detail: { eventId: resp.eventId } })); + if (resp?.eventId) await handleEventUpdate(props); } return resp;