From 8bcb543acf0fd00ae75177dab374dd8f69a03056 Mon Sep 17 00:00:00 2001
From: Qiyun Dai <pianoquin@gmail.com>
Date: Mon, 21 Oct 2024 09:54:04 -0500
Subject: [PATCH 01/10] [MWPW-158803] Attendee Console 1.5 (#255)

---
 .../attendee-management-table.css             | 142 +++++++--
 .../attendee-management-table.js              | 287 ++++++++++++++----
 ecc/blocks/ecc-dashboard/ecc-dashboard.js     |   7 +-
 ecc/scripts/esp-controller.js                 | 106 ++++---
 4 files changed, 393 insertions(+), 149 deletions(-)

diff --git a/ecc/blocks/attendee-management-table/attendee-management-table.css b/ecc/blocks/attendee-management-table/attendee-management-table.css
index e902ce51..a00941fa 100644
--- a/ecc/blocks/attendee-management-table/attendee-management-table.css
+++ b/ecc/blocks/attendee-management-table/attendee-management-table.css
@@ -1,7 +1,12 @@
 .attendee-management-table {
   font-family: var(--body-font-family);
-  padding: 40px;
+  max-width: 1440px;
+  padding: 0 40px 40px;
   margin: auto;
+
+  --color-red: #EB1000;
+  --table-col-width: 120px;
+  --table-col-padding: 16px;
 }
 
 .attendee-management-table .loading-screen {
@@ -22,10 +27,82 @@
   font-size: var(--type-body-s-size);
 }
 
-.attendee-management-table .dashboard-main-container {
+.attendee-management-table .dashboard-header-heading {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.attendee-management-table .dashboard-header-heading sp-action-button {
+  padding: 0;
+  background: none;
+  border: none;
+  cursor: help;
+}
+
+.attendee-management-table .dashboard-main-container .dashboard-body-container {
   margin-top: 24px;
   display: flex;
-  gap: 24px;
+  gap: 2rem;
+}
+
+.attendee-management-table .dashboard-header-event-info {
+  display: flex;
+  align-items: center;
+  gap: 2rem;
+}
+
+.attendee-management-table .event-info-container {
+  width: 100%;
+}
+
+.attendee-management-table .dashboard-main-container .event-image {
+  max-height: 167px;
+  max-width: 224px;
+}
+
+.attendee-management-table .dashboard-main-container .event-info-row {
+  display: flex;
+  justify-content: flex-start;
+  gap: 25%;
+  border-bottom: 1px solid var(--color-gray-500);
+}
+
+.attendee-management-table .dashboard-main-container .event-info-label {
+  font-weight: 700;
+  margin-right: 1rem;
+}
+
+.attendee-management-table .dashboard-main-container .event-stats-col-wrapper {
+  display: flex;
+  align-items: flex-start;
+}
+
+.attendee-management-table .dashboard-main-container .event-stats-row {
+  height: 64px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 25%;
+  margin-top: 1rem;
+}
+
+.attendee-management-table .dashboard-main-container .event-stats-label {
+  margin: 0;
+  margin-right: 1rem;
+  color: var(--color-gray-500)
+}
+
+.attendee-management-table .dashboard-main-container .event-stats-value {
+  font-size: var(--type-heading-xl-size);
+  font-weight: 700;
+  color: var(--color-red);
+  margin: 0;
+}
+
+.attendee-management-table .dashboard-main-container .event-stats-subtext {
+  font-size: var(--type-body-xxs-size);
+  margin: 0;
 }
 
 .attendee-management-table .dashboard-main-container .dashboard-side-panel {
@@ -64,15 +141,8 @@
   margin: 16px 0;
 }
 
-.attendee-management-table .dashboard-header {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-  justify-content: space-between;
-  align-items: flex-start;
-}
-
 .attendee-management-table .dashboard-table-container {
+  width: 100%;
   max-width: calc(100% - 250px);
   position: relative;
 }
@@ -159,10 +229,6 @@
   gap: 16px;
 }
 
-.attendee-management-table .dashboard-header-text h1 {
-  margin: 0;
-}
-
 .attendee-management-table .dashboard-header-text p {
   margin: 6px 0;
 }
@@ -171,6 +237,11 @@
   display: flex;
   align-items: center;
   gap: 16px;
+  justify-content: flex-end;
+}
+
+.attendee-management-table.no-results .dashboard-actions-container {
+  visibility: hidden;
 }
 
 .attendee-management-table .dashboard-actions-container .search-input-wrapper {
@@ -205,20 +276,44 @@
 }
 
 .attendee-management-table table .table-header-row {
-  height: 40;
+  height: 56px;
   border-bottom: 2px solid var(--color-gray-600);
 }
 
+.attendee-management-table.no-results table .table-header-row {
+  display: none;
+}
+
 .attendee-management-table table .table-header-row th {
-  padding: 0 16px;
+  padding: 0 var(--table-col-padding);
   font-weight: 700;
   text-align: left;
   font-size: var(--type-body-xxs-size);
   color: var(--spectrum-color-gray-500);
-  width: 100px;
+  width: var(--table-col-width);
   white-space: nowrap;
 }
 
+.attendee-management-table table .table-header-row th.sticky-right-1,
+.attendee-management-table table .attendee-row td.sticky-right-1 {
+  position: sticky;
+  right: 0;
+  background-color: var(--color-gray-100);
+  max-width: var(--table-col-width);
+  min-width: var(--table-col-width);
+  z-index: 1;
+}
+
+.attendee-management-table table .table-header-row th.sticky-right-2,
+.attendee-management-table table .attendee-row td.sticky-right-2 {
+  position: sticky;
+  right: calc(var(--table-col-width) + (var(--table-col-padding) * 2));
+  background-color: var(--color-gray-100);
+  max-width: var(--table-col-width);
+  min-width: var(--table-col-width);
+  z-index: 1;
+}
+
 .attendee-management-table table .table-header-row th span {
   white-space: nowrap;
   width: 60px;
@@ -249,6 +344,7 @@
 
 .attendee-management-table table .attendee-row {
   height: 40px;
+  border-bottom: 1px solid var(--color-gray-200);
 }
 
 .attendee-management-table table .no-search-results-row td {
@@ -256,10 +352,6 @@
   text-align: center;
 }
 
-.attendee-management-table table .attendee-row:nth-of-type(even) {
-  background-color: var(--color-gray-100);
-}
-
 .attendee-management-table table .attendee-row .attendee-title-link {
   font-weight: 700;
   text-decoration: none;
@@ -351,9 +443,3 @@
   gap: 16px;
   z-index: 9;
 }
-
-@media screen and (min-width: 900px) {
-  .attendee-management-table .dashboard-header {
-    flex-direction: row;
-  }
-}
diff --git a/ecc/blocks/attendee-management-table/attendee-management-table.js b/ecc/blocks/attendee-management-table/attendee-management-table.js
index c7513140..6d013542 100644
--- a/ecc/blocks/attendee-management-table/attendee-management-table.js
+++ b/ecc/blocks/attendee-management-table/attendee-management-table.js
@@ -15,20 +15,82 @@ import { initProfileLogicTree } from '../../scripts/event-apis.js';
 
 const { createTag } = await import(`${LIBS}/utils/utils.js`);
 
-const ATTENDEE_ATTR_KEYS = [
-  'attendeeId',
-  'firstName',
-  'lastName',
-  'email',
-  'companyName',
-  'jobTitle',
-  'mobilePhone',
-  'industry',
-  'productsOfInterest',
-  'companySize',
-  'age',
-  'jobLevel',
-  'contactMethod',
+const ATTENDEE_ATTR_MAP = [
+  {
+    key: 'firstName',
+    label: 'First name',
+    fallback: '',
+  },
+  {
+    key: 'lastName',
+    label: 'Last name',
+    fallback: '',
+  },
+  {
+    key: 'email',
+    label: 'Email',
+    fallback: '',
+  },
+  {
+    key: 'companyName',
+    label: 'Company',
+    fallback: '',
+  },
+  {
+    key: 'jobTitle',
+    label: 'Job title',
+    fallback: '',
+  },
+  {
+    key: 'mobilePhone',
+    label: 'Mobile phone',
+    fallback: '',
+  },
+  {
+    key: 'industry',
+    label: 'Industry',
+    fallback: '',
+  },
+  {
+    key: 'productsOfInterest',
+    label: 'Products of interest',
+    fallback: '',
+  },
+  {
+    key: 'companySize',
+    label: 'Company size',
+    fallback: '',
+  },
+  {
+    key: 'age',
+    label: 'Age',
+    fallback: '',
+  },
+  {
+    key: 'jobLevel',
+    label: 'Job level',
+    fallback: '',
+  },
+  {
+    key: 'contactMethod',
+    label: 'Contact method',
+    fallback: '',
+  },
+  {
+    key: 'registrationDate',
+    label: 'Registration date',
+    fallback: '',
+  },
+  {
+    key: 'type',
+    label: 'RSVP status',
+    fallback: 'registered',
+  },
+  {
+    key: 'checkedIn',
+    label: 'Checked in',
+    fallback: '-',
+  },
 ];
 
 const FILTER_MAP = {
@@ -42,6 +104,23 @@ const FILTER_MAP = {
   contactMethod: [],
 };
 
+const SPECTRUM_COMPONENTS = [
+  'theme',
+  'toast',
+  'button',
+  'dialog',
+  'underlay',
+  'progress-circle',
+  'textfield',
+  'picker',
+  'divider',
+  'overlay',
+  'popover',
+  'link',
+  'tooltip',
+  'action-button',
+];
+
 function buildAllFilterMenues(props) {
   const sidePanel = props.el.querySelector('.dashboard-side-panel');
 
@@ -172,8 +251,11 @@ async function populateRow(props, index) {
 
   const row = createTag('tr', { class: 'attendee-row', 'data-attendee-id': attendee.attendeeId }, '', { parent: tBody });
 
-  ATTENDEE_ATTR_KEYS.forEach((key) => {
-    createTag('td', {}, attendee[key] || '', { parent: row });
+  ATTENDEE_ATTR_MAP.forEach(({ key, fallback }, i, arr) => {
+    const td = createTag('td', {}, attendee[key] || fallback, { parent: row });
+    if (['registrationStatus', 'checkedIn'].includes(key)) {
+      td.classList.add(`sticky-right-${arr.length - i}`, 'actions');
+    }
   });
 }
 
@@ -236,20 +318,12 @@ function decoratePagination(props, config) {
 }
 
 function initSorting(props, config) {
-  const thead = props.el.querySelector('thead');
-  const thRow = thead.querySelector('tr');
-
-  ATTENDEE_ATTR_KEYS.forEach((key) => {
-    const val = camelToSentenceCase(key).toUpperCase();
-    const thText = createTag('span', {}, val);
-    const th = createTag('th', {}, thText, { parent: thRow });
-
-    th.append(getIcon('chev-down'), getIcon('chev-up'));
-    th.classList.add('sortable', key);
+  const sortables = props.el.querySelectorAll('th.sortable');
+  sortables.forEach((th) => {
     th.addEventListener('click', () => {
       if (!props.filteredData.length) return;
 
-      thead.querySelectorAll('th').forEach((h) => {
+      sortables.forEach((h) => {
         if (th !== h) {
           h.classList.remove('active');
         }
@@ -257,28 +331,50 @@ function initSorting(props, config) {
       th.classList.add('active');
       props.currentSort = {
         el: th,
-        field: key,
+        field: th.dataset.field,
       };
       sortData(props, config);
     });
   });
 }
 
-function buildNoResultsScreen(el, config) {
+function buildTableHeaders(props, config) {
+  const thead = props.el.querySelector('thead');
+  const thRow = thead.querySelector('tr');
+
+  ATTENDEE_ATTR_MAP.forEach(({ key, label }, i, arr) => {
+    const thText = createTag('span', {}, label.toUpperCase());
+    const th = createTag('th', {}, thText, { parent: thRow });
+
+    th.append(getIcon('chev-down'), getIcon('chev-up'));
+
+    if (['registrationStatus', 'checkedIn'].includes(key)) th.classList.add('actions', `sticky-right-${arr.length - i}`);
+    th.classList.add('sortable');
+    th.dataset.field = key;
+  });
+
+  initSorting(props, config);
+}
+
+function buildNoResultsScreen(props, config) {
+  const tBody = props.el.querySelector('table.dashboard-table tbody');
+  props.el.classList.add('no-results');
+
   const noSearchResultsRow = createTag('tr', { class: 'no-search-results-row' });
   const noSearchResultsCol = createTag('td', { colspan: '100%' }, getIcon('empty-dashboard'), { parent: noSearchResultsRow });
   createTag('h2', {}, config['no-attendee-results-heading'], { parent: noSearchResultsCol });
   createTag('p', {}, config['no-attendee-results-text'], { parent: noSearchResultsCol });
 
-  el.append(noSearchResultsRow);
+  tBody.append(noSearchResultsRow);
 }
 
 function populateTable(props, config) {
   const tBody = props.el.querySelector('table.dashboard-table tbody');
+  props.el.classList.remove('no-results');
   tBody.innerHTML = '';
 
   if (!props.paginatedData.length) {
-    buildNoResultsScreen(tBody, config);
+    buildNoResultsScreen(props, config);
   } else {
     const endOfPage = Math.min(+config['page-size'], props.paginatedData.length);
 
@@ -294,7 +390,7 @@ function populateTable(props, config) {
 function filterData(props, config) {
   const q = props.currentQuery.toLowerCase();
   props.filteredData = props.data.filter((e) => {
-    const searchMatch = ATTENDEE_ATTR_KEYS.some((key) => e[key]?.toString().toLowerCase().includes(q));
+    const searchMatch = ATTENDEE_ATTR_MAP.some(({ key }) => e[key]?.toString().toLowerCase().includes(q));
     const appliedFilters = Object.entries(props.currentFilters).filter(([, val]) => val.length);
     const filterMatch = appliedFilters.every(([key, val]) => val.includes(e[key]));
 
@@ -306,13 +402,84 @@ function filterData(props, config) {
   sortData(props, config, { resort: true });
 }
 
+function calculatePercentage(part, total) {
+  if (total === 0) {
+    return '0%';
+  }
+  const percentage = (part / total) * 100;
+  return `${percentage.toFixed(2)}%`;
+}
+
+function buildEventInfo(props) {
+  const eventInfoContainer = props.el.querySelector('.dashboard-header-event-info');
+  if (!eventInfoContainer) return;
+
+  eventInfoContainer.innerHTML = '';
+  const eventInfo = props.events.find((e) => e.eventId === props.currentEventId);
+
+  if (!eventInfo) return;
+  const heroImgObj = eventInfo.photos?.find((p) => p.imageKind === 'event-hero-image');
+
+  // build event image
+  createTag(
+    'div',
+    { class: 'event-image-container' },
+    createTag('img', { class: 'event-image', src: heroImgObj ? heroImgObj.sharepointUrl || heroImgObj.imageUrl : '' }),
+    { parent: eventInfoContainer },
+  );
+
+  const infoContainer = createTag('div', { class: 'event-info-container' }, '', { parent: eventInfoContainer });
+  const infoRow = createTag('div', { class: 'event-info-row' }, '', { parent: infoContainer });
+  const statsRow = createTag('div', { class: 'event-stats-row' }, '', { parent: infoContainer });
+
+  [
+    {
+      label: 'EVENT:',
+      value: eventInfo.title,
+    },
+    {
+      label: 'WHEN:',
+      value: new Date(eventInfo.localStartTimeMillis).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' }),
+    },
+    {
+      label: 'TYPE:',
+      value: eventInfo.eventType,
+    },
+  ].forEach(({ label, value }) => {
+    const infoColWrapper = createTag('div', { class: 'event-stats-col-wrapper' }, '', { parent: infoRow });
+    createTag('span', { class: 'event-info-label' }, label, { parent: infoColWrapper });
+    createTag('span', { class: 'event-info-value' }, value, { parent: infoColWrapper });
+  });
+
+  [
+    {
+      label: 'RSVPs',
+      value: eventInfo.attendeeCount || '0',
+      subText: calculatePercentage(+eventInfo.attendeeCount, +eventInfo.attendeeLimit),
+    },
+  ].forEach(({ label, value, subText }) => {
+    const statsColWrapper = createTag('div', { class: 'event-stats-col-wrapper' }, '', { parent: statsRow });
+    createTag('h3', { class: 'event-stats-label' }, label, { parent: statsColWrapper });
+    const statsValWrapper = createTag('div', { class: 'event-stats-value-wrapper' }, '', { parent: statsColWrapper });
+    createTag('p', { class: 'event-stats-value' }, value, { parent: statsValWrapper });
+    createTag('p', { class: 'event-stats-subtext' }, subText, { parent: statsValWrapper });
+  });
+}
+
 function buildDashboardHeader(props, config) {
+  const mainContainer = props.el.querySelector('.dashboard-main-container');
   const dashboardHeader = createTag('div', { class: 'dashboard-header' });
-  const textContainer = createTag('div', { class: 'dashboard-header-text' });
+  const headingContainer = createTag('div', { class: 'dashboard-header-text' });
+  const eventInfoContainer = createTag('div', { class: 'dashboard-header-event-info' });
   const actionsContainer = createTag('div', { class: 'dashboard-actions-container' });
 
-  createTag('h1', { class: 'dashboard-header-heading' }, 'All event attendees', { parent: textContainer });
-  createTag('p', { class: 'dashboard-header-attendees-count' }, `(${props.data.length} attendees)`, { parent: textContainer });
+  const heading = createTag('h1', { class: 'dashboard-header-heading' }, 'Event report', { parent: headingContainer });
+
+  if (config.tooltipText) {
+    const toolTipTrigger = createTag('sp-action-button', { size: 's' }, getIcon('info'));
+    createTag('sp-tooltip', { 'self-managed': true, variant: 'info' }, config.tooltipText, { parent: toolTipTrigger });
+    heading.append(toolTipTrigger);
+  }
 
   const searchInputWrapper = createTag('div', { class: 'search-input-wrapper' }, '', { parent: actionsContainer });
   const searchInput = createTag('input', { type: 'text', placeholder: 'Search' }, '', { parent: searchInputWrapper });
@@ -322,28 +489,23 @@ function buildDashboardHeader(props, config) {
     filterData(props, config);
   });
 
-  dashboardHeader.append(textContainer, actionsContainer);
-  props.el.prepend(dashboardHeader);
-}
-
-function updateDashboardHeader(props) {
-  const attendeesCount = props.el.querySelector('.dashboard-header-attendees-count');
-
-  if (attendeesCount) attendeesCount.textContent = `(${props.data.length} attendees)`;
+  dashboardHeader.append(headingContainer, eventInfoContainer, actionsContainer);
+  mainContainer.prepend(dashboardHeader);
+  buildEventInfo(props);
 }
 
 function buildDashboardTable(props, config) {
-  const mainContainer = props.el.querySelector('.dashboard-main-container');
+  const dashboardBody = props.el.querySelector('.dashboard-body-container');
 
-  if (!mainContainer) return;
+  if (!dashboardBody) return;
 
-  const tableContainer = createTag('div', { class: 'dashboard-table-container' }, '', { parent: mainContainer });
+  const tableContainer = createTag('div', { class: 'dashboard-table-container' }, '', { parent: dashboardBody });
   const tableWrapper = createTag('div', { class: 'dashboard-table-wrapper' }, '', { parent: tableContainer });
   const table = createTag('table', { class: 'dashboard-table' }, '', { parent: tableWrapper });
   const thead = createTag('thead', {}, '', { parent: table });
   createTag('tbody', {}, '', { parent: table });
   createTag('tr', { class: 'table-header-row' }, '', { parent: thead });
-  initSorting(props, config);
+  buildTableHeaders(props, config);
   populateTable(props, config);
 }
 
@@ -376,10 +538,10 @@ function buildEventPicker(props) {
 
   const sidePanel = props.el.querySelector('.dashboard-side-panel');
   const eventsPickerWrapper = createTag('div', { class: 'events-picker-wrapper' }, '', { parent: sidePanel });
-  createTag('sp-field-label', {}, 'Current event', { parent: eventsPickerWrapper });
+  createTag('sp-field-label', {}, 'Search other events', { parent: eventsPickerWrapper });
   const eventsPicker = createTag('searchable-picker', {
     class: 'events-picker',
-    label: 'Choose an event',
+    label: 'Event name',
   }, '', { parent: eventsPickerWrapper });
 
   if (props.currentEventId) {
@@ -424,11 +586,11 @@ function buildBackToDashboardBtn(props, config) {
 }
 
 function buildDashboardSidePanel(props, config) {
-  const mainContainer = props.el.querySelector('.dashboard-main-container');
+  const dashboardBody = props.el.querySelector('.dashboard-body-container');
 
-  if (!mainContainer) return;
+  if (!dashboardBody) return;
 
-  const sidePanel = createTag('div', { class: 'dashboard-side-panel' }, '', { parent: mainContainer });
+  const sidePanel = createTag('div', { class: 'dashboard-side-panel' }, '', { parent: dashboardBody });
   buildBackToDashboardBtn(props, config);
   buildEventPicker(props);
   createTag('sp-divider', {}, '', { parent: sidePanel });
@@ -459,7 +621,8 @@ async function buildDashboard(el, config) {
   const spTheme = createTag('sp-theme', { color: 'light', scale: 'medium', class: 'toast-area' }, '', { parent: el });
   createTag('sp-underlay', {}, '', { parent: spTheme });
   createTag('sp-dialog', { size: 's' }, '', { parent: spTheme });
-  createTag('sp-theme', { color: 'light', scale: 'medium', class: 'dashboard-main-container' }, '', { parent: el });
+  const mainContainer = createTag('sp-theme', { color: 'light', scale: 'medium', class: 'dashboard-main-container' }, '', { parent: el });
+  createTag('div', { class: 'dashboard-body-container' }, '', { parent: mainContainer });
 
   const uspEventId = new URLSearchParams(window.location.search).get('eventId');
   const events = await getEventsArray();
@@ -497,6 +660,7 @@ async function buildDashboard(el, config) {
         target.currentFilters = {};
         updateFilterMap(receiver);
         buildFilters(receiver);
+        buildEventInfo(target);
       }
 
       if (prop === 'currentEventId') {
@@ -508,7 +672,6 @@ async function buildDashboard(el, config) {
         filterData(target, config);
       }
 
-      updateDashboardHeader(target);
       populateTable(receiver, config);
       updateResetFilterBtnState(target);
 
@@ -538,20 +701,12 @@ function buildLoadingScreen(el) {
 
 export default async function init(el) {
   const miloLibs = LIBS;
+  const promises = Array.from(SPECTRUM_COMPONENTS).map(async (component) => {
+    await import(`${miloLibs}/features/spectrum-web-components/dist/${component}.js`);
+  });
   await Promise.all([
     import(`${miloLibs}/deps/lit-all.min.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/theme.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/toast.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/button.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/dialog.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/underlay.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/progress-circle.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/textfield.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/picker.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/divider.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/overlay.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/popover.js`),
-    import(`${miloLibs}/features/spectrum-web-components/dist/link.js`),
+    ...promises,
   ]);
 
   const config = readBlockConfig(el);
diff --git a/ecc/blocks/ecc-dashboard/ecc-dashboard.js b/ecc/blocks/ecc-dashboard/ecc-dashboard.js
index 8dffe28d..9123c0cd 100644
--- a/ecc/blocks/ecc-dashboard/ecc-dashboard.js
+++ b/ecc/blocks/ecc-dashboard/ecc-dashboard.js
@@ -608,6 +608,11 @@ function buildDashboardHeader(props, config) {
   props.el.prepend(dashboardHeader);
 }
 
+function updateEventsCount(props) {
+  const eventsCount = props.el.querySelector('.dashboard-header-events-count');
+  eventsCount.textContent = `(${props.data.length} events)`;
+}
+
 function buildDashboardTable(props, config) {
   const tableContainer = createTag('div', { class: 'dashboard-table-container' }, '', { parent: props.el });
   const table = createTag('table', { class: 'dashboard-table' }, '', { parent: tableContainer });
@@ -673,7 +678,7 @@ async function buildDashboard(el, config) {
       set(target, prop, value, receiver) {
         target[prop] = value;
         populateTable(receiver, config);
-
+        updateEventsCount(receiver);
         return true;
       },
     };
diff --git a/ecc/scripts/esp-controller.js b/ecc/scripts/esp-controller.js
index e6e28413..9e296182 100644
--- a/ecc/scripts/esp-controller.js
+++ b/ecc/scripts/esp-controller.js
@@ -1,5 +1,20 @@
 import { getECCEnv } from './utils.js';
 
+const API_CONFIG = {
+  esl: {
+    local: { host: 'http://localhost:8499' },
+    dev: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-9c3ecd.stage.cloud.adobe.io' },
+    stage: { host: 'https://events-service-layer-stage.adobe.io' },
+    prod: { host: 'https://events-service-layer.adobe.io' },
+  },
+  esp: {
+    local: { host: 'http://localhost:8500' },
+    dev: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-caff5f.stage.cloud.adobe.io' },
+    stage: { host: 'https://events-service-platform-stage.adobe.io' },
+    prod: { host: 'https://events-service-platform.adobe.io' },
+  },
+};
+
 export const getCaasTags = (() => {
   let cache;
   let promise;
@@ -32,23 +47,6 @@ export const getCaasTags = (() => {
   };
 })();
 
-function getAPIConfig() {
-  return {
-    esl: {
-      local: { host: 'http://localhost:8499' },
-      dev: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-9c3ecd.stage.cloud.adobe.io' },
-      stage: { host: 'https://events-service-layer-stage.adobe.io' },
-      prod: { host: 'https://events-service-layer.adobe.io' },
-    },
-    esp: {
-      local: { host: 'http://localhost:8500' },
-      dev: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-caff5f.stage.cloud.adobe.io' },
-      stage: { host: 'https://events-service-platform-stage.adobe.io' },
-      prod: { host: 'https://events-service-platform.adobe.io' },
-    },
-  };
-}
-
 function waitForAdobeIMS() {
   return new Promise((resolve) => {
     const checkIMS = () => {
@@ -89,7 +87,7 @@ export async function constructRequestOptions(method, body = null) {
 export async function uploadImage(file, configs, tracker, imageId = null) {
   await waitForAdobeIMS();
 
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const sp = new URLSearchParams(window.location.search);
   const devToken = sp.get('devToken');
   const authToken = devToken && getECCEnv() === 'dev' ? devToken : window.adobeIMS?.getAccessToken()?.token;
@@ -181,7 +179,7 @@ function convertToSpeaker(speaker) {
 
 export async function deleteImage(configs, imageId) {
   await waitForAdobeIMS();
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
@@ -202,7 +200,7 @@ export async function deleteImage(configs, imageId) {
 }
 
 export async function createVenue(eventId, venueData) {
-  const { host } = getAPIConfig().esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getECCEnv()];
   const raw = JSON.stringify(venueData);
   const options = await constructRequestOptions('POST', raw);
 
@@ -223,7 +221,7 @@ export async function createVenue(eventId, venueData) {
 }
 
 export async function replaceVenue(eventId, venueId, venueData) {
-  const { host } = getAPIConfig().esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getECCEnv()];
   const raw = JSON.stringify(venueData);
   const options = await constructRequestOptions('PUT', raw);
 
@@ -244,7 +242,7 @@ export async function replaceVenue(eventId, venueId, venueData) {
 }
 
 export async function createEvent(payload) {
-  const { host } = getAPIConfig().esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getECCEnv()];
   const raw = JSON.stringify({ ...payload, liveUpdate: false });
   const options = await constructRequestOptions('POST', raw);
 
@@ -267,7 +265,7 @@ export async function createEvent(payload) {
 export async function createSpeaker(profile, seriesId) {
   const nSpeaker = convertToNSpeaker(profile);
 
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const raw = JSON.stringify({ ...nSpeaker, seriesId });
   const options = await constructRequestOptions('POST', raw);
 
@@ -288,7 +286,7 @@ export async function createSpeaker(profile, seriesId) {
 }
 
 export async function createSponsor(sponsorData, seriesId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const raw = JSON.stringify(sponsorData);
   const options = await constructRequestOptions('POST', raw);
 
@@ -309,7 +307,7 @@ export async function createSponsor(sponsorData, seriesId) {
 }
 
 export async function updateSponsor(sponsorData, sponsorId, seriesId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const raw = JSON.stringify(sponsorData);
   const options = await constructRequestOptions('PUT', raw);
 
@@ -330,7 +328,7 @@ export async function updateSponsor(sponsorData, sponsorId, seriesId) {
 }
 
 export async function addSponsorToEvent(sponsorData, eventId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const raw = JSON.stringify(sponsorData);
   const options = await constructRequestOptions('POST', raw);
 
@@ -351,7 +349,7 @@ export async function addSponsorToEvent(sponsorData, eventId) {
 }
 
 export async function updateSponsorInEvent(sponsorData, sponsorId, eventId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const raw = JSON.stringify(sponsorData);
   const options = await constructRequestOptions('PUT', raw);
 
@@ -372,7 +370,7 @@ export async function updateSponsorInEvent(sponsorData, sponsorId, eventId) {
 }
 
 export async function removeSponsorFromEvent(sponsorId, eventId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
@@ -392,7 +390,7 @@ export async function removeSponsorFromEvent(sponsorId, eventId) {
 }
 
 export async function getSponsor(seriesId, sponsorId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -412,7 +410,7 @@ export async function getSponsor(seriesId, sponsorId) {
 }
 
 export async function getSponsors(seriesId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -432,7 +430,7 @@ export async function getSponsors(seriesId) {
 }
 
 export async function getSponsorImages(seriesId, sponsorId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -452,7 +450,7 @@ export async function getSponsorImages(seriesId, sponsorId) {
 }
 
 export async function addSpeakerToEvent(speakerData, eventId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const raw = JSON.stringify(speakerData);
   const options = await constructRequestOptions('POST', raw);
 
@@ -473,7 +471,7 @@ export async function addSpeakerToEvent(speakerData, eventId) {
 }
 
 export async function updateSpeakerInEvent(speakerData, speakerId, eventId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const raw = JSON.stringify(speakerData);
   const options = await constructRequestOptions('PUT', raw);
 
@@ -494,7 +492,7 @@ export async function updateSpeakerInEvent(speakerData, speakerId, eventId) {
 }
 
 export async function removeSpeakerFromEvent(speakerId, eventId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
@@ -515,7 +513,7 @@ export async function removeSpeakerFromEvent(speakerId, eventId) {
 
 export async function updateSpeaker(profile, seriesId) {
   const nSpeaker = convertToNSpeaker(profile);
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const raw = JSON.stringify({ ...nSpeaker, seriesId });
   const options = await constructRequestOptions('PUT', raw);
 
@@ -536,7 +534,7 @@ export async function updateSpeaker(profile, seriesId) {
 }
 
 export async function updateEvent(eventId, payload) {
-  const { host } = getAPIConfig().esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getECCEnv()];
   const raw = JSON.stringify({ ...payload, liveUpdate: false });
   const options = await constructRequestOptions('PUT', raw);
 
@@ -557,7 +555,7 @@ export async function updateEvent(eventId, payload) {
 }
 
 export async function publishEvent(eventId, payload) {
-  const { host } = getAPIConfig().esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getECCEnv()];
   const raw = JSON.stringify({ ...payload, published: true, liveUpdate: true });
   const options = await constructRequestOptions('PUT', raw);
 
@@ -578,7 +576,7 @@ export async function publishEvent(eventId, payload) {
 }
 
 export async function unpublishEvent(eventId, payload) {
-  const { host } = getAPIConfig().esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getECCEnv()];
   const raw = JSON.stringify({ ...payload, published: false, liveUpdate: true });
   const options = await constructRequestOptions('PUT', raw);
 
@@ -599,7 +597,7 @@ export async function unpublishEvent(eventId, payload) {
 }
 
 export async function deleteEvent(eventId) {
-  const { host } = getAPIConfig().esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getECCEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
@@ -620,7 +618,7 @@ export async function deleteEvent(eventId) {
 }
 
 export async function getEvents() {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -640,7 +638,7 @@ export async function getEvents() {
 }
 
 export async function getEvent(eventId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -660,7 +658,7 @@ export async function getEvent(eventId) {
 }
 
 export async function getVenue(eventId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -680,7 +678,7 @@ export async function getVenue(eventId) {
 }
 
 export async function getSpeaker(seriesId, speakerId) {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -712,7 +710,7 @@ export async function getClouds() {
 }
 
 export async function getSeries() {
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -734,7 +732,7 @@ export async function getSeries() {
 export async function createAttendee(eventId, attendeeData) {
   if (!eventId || !attendeeData) return false;
 
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const raw = JSON.stringify(attendeeData);
   const options = await constructRequestOptions('POST', raw);
 
@@ -757,7 +755,7 @@ export async function createAttendee(eventId, attendeeData) {
 export async function updateAttendee(eventId, attendeeId, attendeeData) {
   if (!eventId || !attendeeData) return false;
 
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const raw = JSON.stringify(attendeeData);
   const options = await constructRequestOptions('PUT', raw);
 
@@ -777,10 +775,10 @@ export async function updateAttendee(eventId, attendeeId, attendeeData) {
   }
 }
 
-export async function deleteAttendee(eventId, attendeeId) {
+export async function removeAttendeeFromEvent(eventId, attendeeId) {
   if (!eventId || !attendeeId) return false;
 
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esl[getECCEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
@@ -802,7 +800,7 @@ export async function deleteAttendee(eventId, attendeeId) {
 export async function getEventAttendees(eventId) {
   if (!eventId) return false;
 
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -823,7 +821,7 @@ export async function getEventAttendees(eventId) {
 
 export async function getAllEventAttendees(eventId) {
   const recurGetAttendees = async (fullAttendeeArr = [], nextPageToken = null) => {
-    const { host } = getAPIConfig().esp[getECCEnv()];
+    const { host } = API_CONFIG.esp[getECCEnv()];
     const options = await constructRequestOptions('GET');
     const fetchUrl = nextPageToken ? `${host}/v1/events/${eventId}/attendees?nextPageToken=${nextPageToken}` : `${host}/v1/events/${eventId}/attendees`;
 
@@ -855,7 +853,7 @@ export async function getAllEventAttendees(eventId) {
 export async function getAttendee(eventId, attendeeId) {
   if (!eventId || !attendeeId) return false;
 
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -877,7 +875,7 @@ export async function getAttendee(eventId, attendeeId) {
 export async function getSpeakers(seriesId) {
   if (!seriesId) return false;
 
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -899,7 +897,7 @@ export async function getSpeakers(seriesId) {
 export async function getEventImages(eventId) {
   if (!eventId) return false;
 
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -921,7 +919,7 @@ export async function getEventImages(eventId) {
 export async function deleteSpeakerImage(speakerId, seriesId, imageId) {
   if (!speakerId || !seriesId || !imageId) return false;
 
-  const { host } = getAPIConfig().esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getECCEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {

From 360db5135b4f6fbd7eaa3eec0954c1f6105a36a3 Mon Sep 17 00:00:00 2001
From: Qiyun Dai <pianoquin@gmail.com>
Date: Mon, 21 Oct 2024 09:55:24 -0500
Subject: [PATCH 02/10] [MWPW-160113] Patch#1 - Add email type to hostEmail
 input (#251)

---
 .../registration-details-component.js                            | 1 +
 1 file changed, 1 insertion(+)

diff --git a/ecc/blocks/registration-details-component/registration-details-component.js b/ecc/blocks/registration-details-component/registration-details-component.js
index f5e6c550..41135343 100644
--- a/ecc/blocks/registration-details-component/registration-details-component.js
+++ b/ecc/blocks/registration-details-component/registration-details-component.js
@@ -65,6 +65,7 @@ function decorateAllCheckboxes(el) {
         id: 'event-host-email-input',
         class: 'text-input',
         placeholder: inputText,
+        type: 'email',
         size: 's',
       });
 

From 9c3a8a8f9eba9685bbc2acbd19b0e6cda986f7e5 Mon Sep 17 00:00:00 2001
From: Qiyun Dai <pianoquin@gmail.com>
Date: Mon, 21 Oct 2024 10:07:50 -0500
Subject: [PATCH 03/10] [MWPW-160285] Endpoint Mapping Update + branch sync job
 (#253)

---
 .github/workflows/sync-branches.yml | 56 +++++++++++++++++++++++++++++
 ecc/scripts/esp-controller.js       | 18 +++++-----
 ecc/scripts/utils.js                | 17 +++++----
 3 files changed, 77 insertions(+), 14 deletions(-)
 create mode 100644 .github/workflows/sync-branches.yml

diff --git a/.github/workflows/sync-branches.yml b/.github/workflows/sync-branches.yml
new file mode 100644
index 00000000..153a2516
--- /dev/null
+++ b/.github/workflows/sync-branches.yml
@@ -0,0 +1,56 @@
+name: Sync 02 branches
+
+on:
+  push:
+    branches:
+      - dev
+      - stage
+
+jobs:
+  sync-dev02:
+    runs-on: ubuntu-latest
+    if: github.ref == 'refs/heads/dev'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Set up Git
+        run: |
+          git config --global user.name "github-actions[bot]"
+          git config --global user.email "github-actions[bot]@users.noreply.github.com"
+
+      - name: Fetch all branches
+        run: git fetch --all
+
+      - name: Check out dev02 branch
+        run: git checkout dev02
+
+      - name: Merge dev into dev02 with theirs strategy
+        run: git merge origin/dev --strategy-option theirs --allow-unrelated-histories
+
+      - name: Push changes to dev02
+        run: git push origin dev02
+
+  sync-stage02:
+    runs-on: ubuntu-latest
+    if: github.ref == 'refs/heads/stage'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Set up Git
+        run: |
+          git config --global user.name "github-actions[bot]"
+          git config --global user.email "github-actions[bot]@users.noreply.github.com"
+
+      - name: Fetch all branches
+        run: git fetch --all
+
+      - name: Check out stage02 branch
+        run: git checkout stage02
+
+      - name: Merge stage into stage02 with theirs strategy
+        run: git merge origin/stage --strategy-option theirs --allow-unrelated-histories
+
+      - name: Push changes to stage02
+        run: git push origin stage02
diff --git a/ecc/scripts/esp-controller.js b/ecc/scripts/esp-controller.js
index 9e296182..de6ba76e 100644
--- a/ecc/scripts/esp-controller.js
+++ b/ecc/scripts/esp-controller.js
@@ -2,16 +2,18 @@ import { getECCEnv } from './utils.js';
 
 const API_CONFIG = {
   esl: {
-    local: { host: 'http://localhost:8499' },
-    dev: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-9c3ecd.stage.cloud.adobe.io' },
-    stage: { host: 'https://events-service-layer-stage.adobe.io' },
-    prod: { host: 'https://events-service-layer.adobe.io' },
+      dev: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-9c3ecd.stage.cloud.adobe.io' },
+      devO2: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-d5dc93.stage.cloud.adobe.io' },
+      stage: { host: 'https://events-service-layer-stage.adobe.io' },
+      stage02: { host: 'https://events-service-layer-stage02.adobe.io' },
+      prod: { host: 'https://events-service-layer.adobe.io' },
   },
   esp: {
-    local: { host: 'http://localhost:8500' },
-    dev: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-caff5f.stage.cloud.adobe.io' },
-    stage: { host: 'https://events-service-platform-stage.adobe.io' },
-    prod: { host: 'https://events-service-platform.adobe.io' },
+      dev: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-caff5f.stage.cloud.adobe.io' },
+      devO2: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-c81eb6.stage.cloud.adobe.io' },
+      stage: { host: 'https://events-service-platform-stage.adobe.io' },
+      stage02: { host: 'https://events-service-platform-stage02.adobe.io' },
+      prod: { host: 'https://events-service-platform.adobe.io' },
   },
 };
 
diff --git a/ecc/scripts/utils.js b/ecc/scripts/utils.js
index 398d81c7..3517c778 100644
--- a/ecc/scripts/utils.js
+++ b/ecc/scripts/utils.js
@@ -13,16 +13,21 @@ export function getECCEnv() {
 
   if (validEnvs.includes(eccEnv)) return eccEnv;
 
-  if (((host.includes(`${SLD}.page`) || host.includes(`${SLD}.live`)) && host.startsWith('dev--'))
-    || host.includes('localhost')) return 'dev';
+  if ((host.includes(`${SLD}.page`) || host.includes(`${SLD}.live`))) {
+    if (host.startsWith('dev--')) return 'dev';
+    if (host.startsWith('dev02--')) return 'dev02';
+    if (host.startsWith('stage--')) return 'stage';
+    if (host.startsWith('stage02--')) return 'stage02';
+    if (host.startsWith('main--')) return 'prod';
+  }
+
+  if (host.includes('localhost')) return 'dev';
 
-  if (((host.includes(`${SLD}.page`) || host.includes(`${SLD}.live`)) && host.startsWith('stage--'))
-    || host.includes('stage.adobe')
+  if (host.includes('stage.adobe')
     || host.includes('corp.adobe')
     || host.includes('graybox.adobe')) return 'stage';
 
-  if (((host.includes(`${SLD}.page`) || host.includes(`${SLD}.live`)) && host.startsWith('main--')) || host.endsWith('adobe.com')) return 'prod';
-
+  if (host.endsWith('adobe.com')) return 'prod';
   // fallback to dev
   return 'dev';
 }

From 3953e9d7940ecfbb5ff7d032e0eebd278d78867b Mon Sep 17 00:00:00 2001
From: Qiyun Dai <pianoquin@gmail.com>
Date: Mon, 21 Oct 2024 15:30:45 -0500
Subject: [PATCH 04/10] linting

---
 ecc/scripts/esp-controller.js | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/ecc/scripts/esp-controller.js b/ecc/scripts/esp-controller.js
index de6ba76e..b82c5c32 100644
--- a/ecc/scripts/esp-controller.js
+++ b/ecc/scripts/esp-controller.js
@@ -2,18 +2,18 @@ import { getECCEnv } from './utils.js';
 
 const API_CONFIG = {
   esl: {
-      dev: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-9c3ecd.stage.cloud.adobe.io' },
-      devO2: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-d5dc93.stage.cloud.adobe.io' },
-      stage: { host: 'https://events-service-layer-stage.adobe.io' },
-      stage02: { host: 'https://events-service-layer-stage02.adobe.io' },
-      prod: { host: 'https://events-service-layer.adobe.io' },
+    dev: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-9c3ecd.stage.cloud.adobe.io' },
+    devO2: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-d5dc93.stage.cloud.adobe.io' },
+    stage: { host: 'https://events-service-layer-stage.adobe.io' },
+    stage02: { host: 'https://events-service-layer-stage02.adobe.io' },
+    prod: { host: 'https://events-service-layer.adobe.io' },
   },
   esp: {
-      dev: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-caff5f.stage.cloud.adobe.io' },
-      devO2: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-c81eb6.stage.cloud.adobe.io' },
-      stage: { host: 'https://events-service-platform-stage.adobe.io' },
-      stage02: { host: 'https://events-service-platform-stage02.adobe.io' },
-      prod: { host: 'https://events-service-platform.adobe.io' },
+    dev: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-caff5f.stage.cloud.adobe.io' },
+    devO2: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-c81eb6.stage.cloud.adobe.io' },
+    stage: { host: 'https://events-service-platform-stage.adobe.io' },
+    stage02: { host: 'https://events-service-platform-stage02.adobe.io' },
+    prod: { host: 'https://events-service-platform.adobe.io' },
   },
 };
 

From bef3aca2079b5caecc8b512e45adf0c75ff7a070 Mon Sep 17 00:00:00 2001
From: Qiyun Dai <pianoquin@gmail.com>
Date: Wed, 23 Oct 2024 10:56:06 -0500
Subject: [PATCH 05/10] [MWPW-160931] Don't save unfinished agenda (#260)

---
 .../controllers/event-agenda-component-controller.js          | 2 +-
 ecc/components/agenda-fieldset-group/agenda-fieldset-group.js | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

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 59759f2d..097c77d2 100644
--- a/ecc/blocks/form-handler/controllers/event-agenda-component-controller.js
+++ b/ecc/blocks/form-handler/controllers/event-agenda-component-controller.js
@@ -7,7 +7,7 @@ export function onSubmit(component, props) {
 
   let agenda = [];
 
-  if (agendaGroup) agenda = agendaGroup.getAgendas();
+  if (agendaGroup) agenda = agendaGroup.getCompleteAgenda();
 
   const agendaInfo = {
     showAgendaPostEvent,
diff --git a/ecc/components/agenda-fieldset-group/agenda-fieldset-group.js b/ecc/components/agenda-fieldset-group/agenda-fieldset-group.js
index 598074e2..5ded6fe3 100644
--- a/ecc/components/agenda-fieldset-group/agenda-fieldset-group.js
+++ b/ecc/components/agenda-fieldset-group/agenda-fieldset-group.js
@@ -40,8 +40,8 @@ export default class AgendaFieldsetGroup extends LitElement {
     this.agendaItems = this.agendaItems.map((agenda, i) => (i === index ? updatedAgenda : agenda));
   }
 
-  getAgendas() {
-    return this.agendaItems.filter((o) => !(Object.keys(o).length === 0 && o.constructor === Object));
+  getCompleteAgenda() {
+    return this.agendaItems.filter((o) => (o.startTime && o.description));
   }
 
   hasOnlyEmptyAgendaLeft() {

From 4142ce800235af6f2b6d1e87390b0cb067fc661e Mon Sep 17 00:00:00 2001
From: Qiyun Dai <pianoquin@gmail.com>
Date: Wed, 23 Oct 2024 13:51:37 -0500
Subject: [PATCH 06/10] [MWPW-160481] Allow RSVP description unsetting (#262)

---
 .../controllers/registration-details-component-controller.js  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

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 90d12af3..97f52334 100644
--- a/ecc/blocks/form-handler/controllers/registration-details-component-controller.js
+++ b/ecc/blocks/form-handler/controllers/registration-details-component-controller.js
@@ -51,10 +51,10 @@ export function onSubmit(component, props) {
 
   const rsvpData = {};
 
-  if (rsvpDescription) rsvpData.rsvpDescription = rsvpDescription;
+  rsvpData.rsvpDescription = rsvpDescription || '';
+  rsvpData.allowWaitlisting = !!allowWaitlisting;
   if (contactHost && hostEmail) rsvpData.hostEmail = hostEmail;
   if (attendeeLimit) rsvpData.attendeeLimit = attendeeLimit;
-  if (allowWaitlisting) rsvpData.allowWaitlisting = allowWaitlisting;
 
   props.payload = { ...props.payload, ...rsvpData };
 }

From f14c287e13937502bdd82db9ff1b868e1118aa3d Mon Sep 17 00:00:00 2001
From: Qiyun Dai <pianoquin@gmail.com>
Date: Wed, 23 Oct 2024 13:52:07 -0500
Subject: [PATCH 07/10] [MISC.] Update sync-branches.yml (#261)

---
 .github/workflows/sync-branches.yml           | 25 ++++++
 .../attendee-management-table.js              |  4 +-
 ecc/blocks/ecc-dashboard/ecc-dashboard.js     |  4 +-
 .../terms-conditions-component-controller.js  |  4 +-
 .../venue-info-component-controller.js        |  4 +-
 ecc/blocks/form-handler/form-handler.js       |  4 +-
 ecc/scripts/esp-controller.js                 | 82 +++++++++----------
 ecc/scripts/utils.js                          |  6 +-
 8 files changed, 79 insertions(+), 54 deletions(-)

diff --git a/.github/workflows/sync-branches.yml b/.github/workflows/sync-branches.yml
index 153a2516..386e1253 100644
--- a/.github/workflows/sync-branches.yml
+++ b/.github/workflows/sync-branches.yml
@@ -5,6 +5,7 @@ on:
     branches:
       - dev
       - stage
+      - main
 
 jobs:
   sync-dev02:
@@ -54,3 +55,27 @@ jobs:
 
       - name: Push changes to stage02
         run: git push origin stage02
+
+  sync-main02:
+    runs-on: ubuntu-latest
+    if: github.ref == 'refs/heads/main'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Set up Git
+        run: |
+          git config --global user.name "github-actions[bot]"
+          git config --global user.email "github-actions[bot]@users.noreply.github.com"
+
+      - name: Fetch all branches
+        run: git fetch --all
+
+      - name: Check out main02 branch
+        run: git checkout main02
+
+      - name: Merge main into main02 with theirs strategy
+        run: git merge origin/main --strategy-option theirs --allow-unrelated-histories
+
+      - name: Push changes to main02
+        run: git push origin main02
diff --git a/ecc/blocks/attendee-management-table/attendee-management-table.js b/ecc/blocks/attendee-management-table/attendee-management-table.js
index 6d013542..050b7908 100644
--- a/ecc/blocks/attendee-management-table/attendee-management-table.js
+++ b/ecc/blocks/attendee-management-table/attendee-management-table.js
@@ -7,7 +7,7 @@ import {
   camelToSentenceCase,
   readBlockConfig,
   signIn,
-  getECCEnv,
+  getEventServiceEnv,
 } from '../../scripts/utils.js';
 import { SearchablePicker } from '../../components/searchable-picker/searchable-picker.js';
 import { FilterMenu } from '../../components/filter-menu/filter-menu.js';
@@ -715,7 +715,7 @@ export default async function init(el) {
 
   const sp = new URLSearchParams(window.location.search);
   const devToken = sp.get('devToken');
-  if (devToken && getECCEnv() === 'dev') {
+  if (devToken && getEventServiceEnv() === 'dev') {
     buildDashboard(el, config);
     return;
   }
diff --git a/ecc/blocks/ecc-dashboard/ecc-dashboard.js b/ecc/blocks/ecc-dashboard/ecc-dashboard.js
index 9123c0cd..fad59d6a 100644
--- a/ecc/blocks/ecc-dashboard/ecc-dashboard.js
+++ b/ecc/blocks/ecc-dashboard/ecc-dashboard.js
@@ -13,7 +13,7 @@ import {
   getEventPageHost,
   readBlockConfig,
   signIn,
-  getECCEnv,
+  getEventServiceEnv,
 } from '../../scripts/utils.js';
 import { quickFilter } from '../form-handler/data-handler.js';
 import { initProfileLogicTree } from '../../scripts/event-apis.js';
@@ -719,7 +719,7 @@ export default async function init(el) {
 
   const sp = new URLSearchParams(window.location.search);
   const devToken = sp.get('devToken');
-  if (devToken && getECCEnv() === 'dev') {
+  if (devToken && getEventServiceEnv() === 'dev') {
     buildDashboard(el, config);
     return;
   }
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 9c9f7303..0d36d1f6 100644
--- a/ecc/blocks/form-handler/controllers/terms-conditions-component-controller.js
+++ b/ecc/blocks/form-handler/controllers/terms-conditions-component-controller.js
@@ -1,7 +1,7 @@
 /* eslint-disable no-unused-vars */
 import { LIBS } from '../../../scripts/scripts.js';
 import HtmlSanitizer from '../../../scripts/deps/html-sanitizer.js';
-import { fetchThrottledMemoizedText, getECCEnv } from '../../../scripts/utils.js';
+import { fetchThrottledMemoizedText, getEventServiceEnv } from '../../../scripts/utils.js';
 
 const { createTag } = await import(`${LIBS}/utils/utils.js`);
 
@@ -35,7 +35,7 @@ async function loadPreview(component, templateId) {
 
   let host;
   if (window.location.href.includes('.hlx.')) {
-    host = window.location.origin.replace(window.location.hostname, `${getECCEnv()}--events-milo--adobecom.hlx.page`);
+    host = window.location.origin.replace(window.location.hostname, `${getEventServiceEnv()}--events-milo--adobecom.hlx.page`);
   } else {
     host = window.location.origin;
   }
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 74bf0ed1..02c96ee0 100644
--- a/ecc/blocks/form-handler/controllers/venue-info-component-controller.js
+++ b/ecc/blocks/form-handler/controllers/venue-info-component-controller.js
@@ -1,7 +1,7 @@
 /* eslint-disable no-unused-vars */
 import { createVenue, replaceVenue } from '../../../scripts/esp-controller.js';
 import BlockMediator from '../../../scripts/deps/block-mediator.min.js';
-import { changeInputValue, getECCEnv, getSecret } from '../../../scripts/utils.js';
+import { changeInputValue, getEventServiceEnv, getSecret } from '../../../scripts/utils.js';
 import { buildErrorMessage } from '../form-handler.js';
 
 function togglePrefillableFieldsHiddenState(component) {
@@ -20,7 +20,7 @@ function togglePrefillableFieldsHiddenState(component) {
 
 async function loadGoogleMapsAPI(callback) {
   const script = document.createElement('script');
-  const apiKey = await getSecret(`${getECCEnv()}-google-places-api`);
+  const apiKey = await getSecret(`${getEventServiceEnv()}-google-places-api`);
   script.src = `https://maps.googleapis.com/maps/api/js?key=${apiKey}&libraries=places&callback=onGoogleMapsApiLoaded`;
   script.async = true;
   script.defer = true;
diff --git a/ecc/blocks/form-handler/form-handler.js b/ecc/blocks/form-handler/form-handler.js
index af2a2f6d..67a5b0b3 100644
--- a/ecc/blocks/form-handler/form-handler.js
+++ b/ecc/blocks/form-handler/form-handler.js
@@ -6,7 +6,7 @@ import {
   camelToSentenceCase,
   getEventPageHost,
   signIn,
-  getECCEnv,
+  getEventServiceEnv,
 } from '../../scripts/utils.js';
 import {
   createEvent,
@@ -860,7 +860,7 @@ export default async function init(el) {
 
   const sp = new URLSearchParams(window.location.search);
   const devToken = sp.get('devToken');
-  if (devToken && getECCEnv() === 'dev') {
+  if (devToken && getEventServiceEnv() === 'dev') {
     buildECCForm(el).then(() => {
       el.classList.remove('loading');
     });
diff --git a/ecc/scripts/esp-controller.js b/ecc/scripts/esp-controller.js
index b82c5c32..5cb4edf4 100644
--- a/ecc/scripts/esp-controller.js
+++ b/ecc/scripts/esp-controller.js
@@ -1,16 +1,16 @@
-import { getECCEnv } from './utils.js';
+import { getEventServiceEnv } from './utils.js';
 
 const API_CONFIG = {
   esl: {
     dev: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-9c3ecd.stage.cloud.adobe.io' },
-    devO2: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-d5dc93.stage.cloud.adobe.io' },
+    dev02: { host: 'https://wcms-events-service-layer-deploy-ethos102-stage-va-d5dc93.stage.cloud.adobe.io' },
     stage: { host: 'https://events-service-layer-stage.adobe.io' },
     stage02: { host: 'https://events-service-layer-stage02.adobe.io' },
     prod: { host: 'https://events-service-layer.adobe.io' },
   },
   esp: {
     dev: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-caff5f.stage.cloud.adobe.io' },
-    devO2: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-c81eb6.stage.cloud.adobe.io' },
+    dev02: { host: 'https://wcms-events-service-platform-deploy-ethos102-stage-c81eb6.stage.cloud.adobe.io' },
     stage: { host: 'https://events-service-platform-stage.adobe.io' },
     stage02: { host: 'https://events-service-platform-stage02.adobe.io' },
     prod: { host: 'https://events-service-platform.adobe.io' },
@@ -68,7 +68,7 @@ export async function constructRequestOptions(method, body = null) {
   const headers = new Headers();
   const sp = new URLSearchParams(window.location.search);
   const devToken = sp.get('devToken');
-  const authToken = devToken && getECCEnv() === 'dev' ? devToken : window.adobeIMS?.getAccessToken()?.token;
+  const authToken = devToken && getEventServiceEnv() === 'dev' ? devToken : window.adobeIMS?.getAccessToken()?.token;
 
   if (!authToken) window.lana?.log('Error: Failed to get Adobe IMS auth token');
 
@@ -89,10 +89,10 @@ export async function constructRequestOptions(method, body = null) {
 export async function uploadImage(file, configs, tracker, imageId = null) {
   await waitForAdobeIMS();
 
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const sp = new URLSearchParams(window.location.search);
   const devToken = sp.get('devToken');
-  const authToken = devToken && getECCEnv() === 'dev' ? devToken : window.adobeIMS?.getAccessToken()?.token;
+  const authToken = devToken && getEventServiceEnv() === 'dev' ? devToken : window.adobeIMS?.getAccessToken()?.token;
 
   let respJson = null;
 
@@ -181,7 +181,7 @@ function convertToSpeaker(speaker) {
 
 export async function deleteImage(configs, imageId) {
   await waitForAdobeIMS();
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
@@ -202,7 +202,7 @@ export async function deleteImage(configs, imageId) {
 }
 
 export async function createVenue(eventId, venueData) {
-  const { host } = API_CONFIG.esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getEventServiceEnv()];
   const raw = JSON.stringify(venueData);
   const options = await constructRequestOptions('POST', raw);
 
@@ -223,7 +223,7 @@ export async function createVenue(eventId, venueData) {
 }
 
 export async function replaceVenue(eventId, venueId, venueData) {
-  const { host } = API_CONFIG.esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getEventServiceEnv()];
   const raw = JSON.stringify(venueData);
   const options = await constructRequestOptions('PUT', raw);
 
@@ -244,7 +244,7 @@ export async function replaceVenue(eventId, venueId, venueData) {
 }
 
 export async function createEvent(payload) {
-  const { host } = API_CONFIG.esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getEventServiceEnv()];
   const raw = JSON.stringify({ ...payload, liveUpdate: false });
   const options = await constructRequestOptions('POST', raw);
 
@@ -267,7 +267,7 @@ export async function createEvent(payload) {
 export async function createSpeaker(profile, seriesId) {
   const nSpeaker = convertToNSpeaker(profile);
 
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const raw = JSON.stringify({ ...nSpeaker, seriesId });
   const options = await constructRequestOptions('POST', raw);
 
@@ -288,7 +288,7 @@ export async function createSpeaker(profile, seriesId) {
 }
 
 export async function createSponsor(sponsorData, seriesId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const raw = JSON.stringify(sponsorData);
   const options = await constructRequestOptions('POST', raw);
 
@@ -309,7 +309,7 @@ export async function createSponsor(sponsorData, seriesId) {
 }
 
 export async function updateSponsor(sponsorData, sponsorId, seriesId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const raw = JSON.stringify(sponsorData);
   const options = await constructRequestOptions('PUT', raw);
 
@@ -330,7 +330,7 @@ export async function updateSponsor(sponsorData, sponsorId, seriesId) {
 }
 
 export async function addSponsorToEvent(sponsorData, eventId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const raw = JSON.stringify(sponsorData);
   const options = await constructRequestOptions('POST', raw);
 
@@ -351,7 +351,7 @@ export async function addSponsorToEvent(sponsorData, eventId) {
 }
 
 export async function updateSponsorInEvent(sponsorData, sponsorId, eventId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const raw = JSON.stringify(sponsorData);
   const options = await constructRequestOptions('PUT', raw);
 
@@ -372,7 +372,7 @@ export async function updateSponsorInEvent(sponsorData, sponsorId, eventId) {
 }
 
 export async function removeSponsorFromEvent(sponsorId, eventId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
@@ -392,7 +392,7 @@ export async function removeSponsorFromEvent(sponsorId, eventId) {
 }
 
 export async function getSponsor(seriesId, sponsorId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -412,7 +412,7 @@ export async function getSponsor(seriesId, sponsorId) {
 }
 
 export async function getSponsors(seriesId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -432,7 +432,7 @@ export async function getSponsors(seriesId) {
 }
 
 export async function getSponsorImages(seriesId, sponsorId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -452,7 +452,7 @@ export async function getSponsorImages(seriesId, sponsorId) {
 }
 
 export async function addSpeakerToEvent(speakerData, eventId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const raw = JSON.stringify(speakerData);
   const options = await constructRequestOptions('POST', raw);
 
@@ -473,7 +473,7 @@ export async function addSpeakerToEvent(speakerData, eventId) {
 }
 
 export async function updateSpeakerInEvent(speakerData, speakerId, eventId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const raw = JSON.stringify(speakerData);
   const options = await constructRequestOptions('PUT', raw);
 
@@ -494,7 +494,7 @@ export async function updateSpeakerInEvent(speakerData, speakerId, eventId) {
 }
 
 export async function removeSpeakerFromEvent(speakerId, eventId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
@@ -515,7 +515,7 @@ export async function removeSpeakerFromEvent(speakerId, eventId) {
 
 export async function updateSpeaker(profile, seriesId) {
   const nSpeaker = convertToNSpeaker(profile);
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const raw = JSON.stringify({ ...nSpeaker, seriesId });
   const options = await constructRequestOptions('PUT', raw);
 
@@ -536,7 +536,7 @@ export async function updateSpeaker(profile, seriesId) {
 }
 
 export async function updateEvent(eventId, payload) {
-  const { host } = API_CONFIG.esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getEventServiceEnv()];
   const raw = JSON.stringify({ ...payload, liveUpdate: false });
   const options = await constructRequestOptions('PUT', raw);
 
@@ -557,7 +557,7 @@ export async function updateEvent(eventId, payload) {
 }
 
 export async function publishEvent(eventId, payload) {
-  const { host } = API_CONFIG.esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getEventServiceEnv()];
   const raw = JSON.stringify({ ...payload, published: true, liveUpdate: true });
   const options = await constructRequestOptions('PUT', raw);
 
@@ -578,7 +578,7 @@ export async function publishEvent(eventId, payload) {
 }
 
 export async function unpublishEvent(eventId, payload) {
-  const { host } = API_CONFIG.esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getEventServiceEnv()];
   const raw = JSON.stringify({ ...payload, published: false, liveUpdate: true });
   const options = await constructRequestOptions('PUT', raw);
 
@@ -599,7 +599,7 @@ export async function unpublishEvent(eventId, payload) {
 }
 
 export async function deleteEvent(eventId) {
-  const { host } = API_CONFIG.esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getEventServiceEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
@@ -620,7 +620,7 @@ export async function deleteEvent(eventId) {
 }
 
 export async function getEvents() {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -640,7 +640,7 @@ export async function getEvents() {
 }
 
 export async function getEvent(eventId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -660,7 +660,7 @@ export async function getEvent(eventId) {
 }
 
 export async function getVenue(eventId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -680,7 +680,7 @@ export async function getVenue(eventId) {
 }
 
 export async function getSpeaker(seriesId, speakerId) {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -712,7 +712,7 @@ export async function getClouds() {
 }
 
 export async function getSeries() {
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -734,7 +734,7 @@ export async function getSeries() {
 export async function createAttendee(eventId, attendeeData) {
   if (!eventId || !attendeeData) return false;
 
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const raw = JSON.stringify(attendeeData);
   const options = await constructRequestOptions('POST', raw);
 
@@ -757,7 +757,7 @@ export async function createAttendee(eventId, attendeeData) {
 export async function updateAttendee(eventId, attendeeId, attendeeData) {
   if (!eventId || !attendeeData) return false;
 
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const raw = JSON.stringify(attendeeData);
   const options = await constructRequestOptions('PUT', raw);
 
@@ -780,7 +780,7 @@ export async function updateAttendee(eventId, attendeeId, attendeeData) {
 export async function removeAttendeeFromEvent(eventId, attendeeId) {
   if (!eventId || !attendeeId) return false;
 
-  const { host } = API_CONFIG.esl[getECCEnv()];
+  const { host } = API_CONFIG.esl[getEventServiceEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
@@ -802,7 +802,7 @@ export async function removeAttendeeFromEvent(eventId, attendeeId) {
 export async function getEventAttendees(eventId) {
   if (!eventId) return false;
 
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -823,7 +823,7 @@ export async function getEventAttendees(eventId) {
 
 export async function getAllEventAttendees(eventId) {
   const recurGetAttendees = async (fullAttendeeArr = [], nextPageToken = null) => {
-    const { host } = API_CONFIG.esp[getECCEnv()];
+    const { host } = API_CONFIG.esp[getEventServiceEnv()];
     const options = await constructRequestOptions('GET');
     const fetchUrl = nextPageToken ? `${host}/v1/events/${eventId}/attendees?nextPageToken=${nextPageToken}` : `${host}/v1/events/${eventId}/attendees`;
 
@@ -855,7 +855,7 @@ export async function getAllEventAttendees(eventId) {
 export async function getAttendee(eventId, attendeeId) {
   if (!eventId || !attendeeId) return false;
 
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -877,7 +877,7 @@ export async function getAttendee(eventId, attendeeId) {
 export async function getSpeakers(seriesId) {
   if (!seriesId) return false;
 
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -899,7 +899,7 @@ export async function getSpeakers(seriesId) {
 export async function getEventImages(eventId) {
   if (!eventId) return false;
 
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('GET');
 
   try {
@@ -921,7 +921,7 @@ export async function getEventImages(eventId) {
 export async function deleteSpeakerImage(speakerId, seriesId, imageId) {
   if (!speakerId || !seriesId || !imageId) return false;
 
-  const { host } = API_CONFIG.esp[getECCEnv()];
+  const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const options = await constructRequestOptions('DELETE');
 
   try {
diff --git a/ecc/scripts/utils.js b/ecc/scripts/utils.js
index 3517c778..8c10687d 100644
--- a/ecc/scripts/utils.js
+++ b/ecc/scripts/utils.js
@@ -4,7 +4,7 @@ const { createTag, getConfig } = await import(`${LIBS}/utils/utils.js`);
 
 let secretCache = [];
 
-export function getECCEnv() {
+export function getEventServiceEnv() {
   const validEnvs = ['dev', 'stage', 'prod'];
   const { host, search } = window.location;
   const SLD = host.includes('.aem.') ? 'aem' : 'hlx';
@@ -15,7 +15,7 @@ export function getECCEnv() {
 
   if ((host.includes(`${SLD}.page`) || host.includes(`${SLD}.live`))) {
     if (host.startsWith('dev--')) return 'dev';
-    if (host.startsWith('dev02--')) return 'dev02';
+    if (host.startsWith('dev02--') || host.startsWith('main02--')) return 'dev02';
     if (host.startsWith('stage--')) return 'stage';
     if (host.startsWith('stage02--')) return 'stage02';
     if (host.startsWith('main--')) return 'prod';
@@ -86,7 +86,7 @@ export function convertTo24HourFormat(timeStr) {
 
 export function getEventPageHost() {
   if (window.location.href.includes('.hlx.')) {
-    return window.location.origin.replace(window.location.hostname, `${getECCEnv()}--events-milo--adobecom.hlx.page`);
+    return window.location.origin.replace(window.location.hostname, `${getEventServiceEnv()}--events-milo--adobecom.hlx.page`);
   }
 
   return window.location.origin;

From 327fedc5676426015ade6954687aa99d16546d8b Mon Sep 17 00:00:00 2001
From: Qiyun Dai <pianoquin@gmail.com>
Date: Wed, 23 Oct 2024 14:31:51 -0500
Subject: [PATCH 08/10] Update esp-controller.js

---
 ecc/scripts/esp-controller.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/ecc/scripts/esp-controller.js b/ecc/scripts/esp-controller.js
index 5cb4edf4..ed31502f 100644
--- a/ecc/scripts/esp-controller.js
+++ b/ecc/scripts/esp-controller.js
@@ -1,4 +1,4 @@
-import { getEventServiceEnv } from './utils.js';
+import { getEventServiceEnv, getSecret } from './utils.js';
 
 const API_CONFIG = {
   esl: {
@@ -65,6 +65,7 @@ function waitForAdobeIMS() {
 export async function constructRequestOptions(method, body = null) {
   await waitForAdobeIMS();
 
+  const clientIdentity = await getSecret(`${getEventServiceEnv()}-client-identity`);
   const headers = new Headers();
   const sp = new URLSearchParams(window.location.search);
   const devToken = sp.get('devToken');
@@ -75,6 +76,7 @@ export async function constructRequestOptions(method, body = null) {
   headers.append('Authorization', `Bearer ${authToken}`);
   headers.append('x-api-key', 'acom_event_service');
   headers.append('content-type', 'application/json');
+  headers.append('x-client-identity', clientIdentity);
 
   const options = {
     method,
@@ -89,6 +91,7 @@ export async function constructRequestOptions(method, body = null) {
 export async function uploadImage(file, configs, tracker, imageId = null) {
   await waitForAdobeIMS();
 
+  const clientIdentity = await getSecret(`${getEventServiceEnv()}-client-identity`);
   const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const sp = new URLSearchParams(window.location.search);
   const devToken = sp.get('devToken');
@@ -106,6 +109,7 @@ export async function uploadImage(file, configs, tracker, imageId = null) {
     xhr.setRequestHeader('x-image-kind', configs.type);
     xhr.setRequestHeader('x-api-key', 'acom_event_service');
     xhr.setRequestHeader('Authorization', `Bearer ${authToken}`);
+    xhr.setRequestHeader('x-client-identity', clientIdentity);
 
     if (tracker) {
       xhr.upload.onprogress = (event) => {

From 70546550dab2e72bd34f48ff218e1effc76de80d Mon Sep 17 00:00:00 2001
From: Qiyun Dai <pianoquin@gmail.com>
Date: Wed, 23 Oct 2024 17:56:20 -0500
Subject: [PATCH 09/10] Fixing RSVP status column (#264)

---
 .../attendee-management-table/attendee-management-table.js    | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ecc/blocks/attendee-management-table/attendee-management-table.js b/ecc/blocks/attendee-management-table/attendee-management-table.js
index 050b7908..106376ee 100644
--- a/ecc/blocks/attendee-management-table/attendee-management-table.js
+++ b/ecc/blocks/attendee-management-table/attendee-management-table.js
@@ -253,7 +253,7 @@ async function populateRow(props, index) {
 
   ATTENDEE_ATTR_MAP.forEach(({ key, fallback }, i, arr) => {
     const td = createTag('td', {}, attendee[key] || fallback, { parent: row });
-    if (['registrationStatus', 'checkedIn'].includes(key)) {
+    if (['type', 'checkedIn'].includes(key)) {
       td.classList.add(`sticky-right-${arr.length - i}`, 'actions');
     }
   });
@@ -348,7 +348,7 @@ function buildTableHeaders(props, config) {
 
     th.append(getIcon('chev-down'), getIcon('chev-up'));
 
-    if (['registrationStatus', 'checkedIn'].includes(key)) th.classList.add('actions', `sticky-right-${arr.length - i}`);
+    if (['type', 'checkedIn'].includes(key)) th.classList.add('actions', `sticky-right-${arr.length - i}`);
     th.classList.add('sortable');
     th.dataset.field = key;
   });

From ffda0d0452cb6c4ef8c147dbc178e7bc7e3af91d Mon Sep 17 00:00:00 2001
From: Qiyun Dai <pianoquin@gmail.com>
Date: Wed, 23 Oct 2024 20:15:45 -0500
Subject: [PATCH 10/10] Adding request-id header to ECC (#265)

---
 ecc/scripts/esp-controller.js | 26 +++++++++++++++++++++-----
 1 file changed, 21 insertions(+), 5 deletions(-)

diff --git a/ecc/scripts/esp-controller.js b/ecc/scripts/esp-controller.js
index ed31502f..5574f54b 100644
--- a/ecc/scripts/esp-controller.js
+++ b/ecc/scripts/esp-controller.js
@@ -1,3 +1,4 @@
+import { LIBS } from './scripts.js';
 import { getEventServiceEnv, getSecret } from './utils.js';
 
 const API_CONFIG = {
@@ -63,9 +64,15 @@ function waitForAdobeIMS() {
 }
 
 export async function constructRequestOptions(method, body = null) {
-  await waitForAdobeIMS();
+  const [
+    { default: getUuid },
+    clientIdentity,
+  ] = await Promise.all([
+    import(`${LIBS}/utils/getUuid.js`),
+    getSecret(`${getEventServiceEnv()}-client-identity`),
+    waitForAdobeIMS(),
+  ]);
 
-  const clientIdentity = await getSecret(`${getEventServiceEnv()}-client-identity`);
   const headers = new Headers();
   const sp = new URLSearchParams(window.location.search);
   const devToken = sp.get('devToken');
@@ -76,6 +83,7 @@ export async function constructRequestOptions(method, body = null) {
   headers.append('Authorization', `Bearer ${authToken}`);
   headers.append('x-api-key', 'acom_event_service');
   headers.append('content-type', 'application/json');
+  headers.append('x-request-id', await getUuid(new Date().getTime()));
   headers.append('x-client-identity', clientIdentity);
 
   const options = {
@@ -89,9 +97,16 @@ export async function constructRequestOptions(method, body = null) {
 }
 
 export async function uploadImage(file, configs, tracker, imageId = null) {
-  await waitForAdobeIMS();
-
-  const clientIdentity = await getSecret(`${getEventServiceEnv()}-client-identity`);
+  const [
+    { default: getUuid },
+    clientIdentity,
+  ] = await Promise.all([
+    import(`${LIBS}/utils/getUuid.js`),
+    getSecret(`${getEventServiceEnv()}-client-identity`),
+    waitForAdobeIMS(),
+  ]);
+
+  const requestId = await getUuid(new Date().getTime());
   const { host } = API_CONFIG.esp[getEventServiceEnv()];
   const sp = new URLSearchParams(window.location.search);
   const devToken = sp.get('devToken');
@@ -109,6 +124,7 @@ export async function uploadImage(file, configs, tracker, imageId = null) {
     xhr.setRequestHeader('x-image-kind', configs.type);
     xhr.setRequestHeader('x-api-key', 'acom_event_service');
     xhr.setRequestHeader('Authorization', `Bearer ${authToken}`);
+    xhr.setRequestHeader('x-request-id', requestId);
     xhr.setRequestHeader('x-client-identity', clientIdentity);
 
     if (tracker) {