async function addNewRule(eventName, workflowConditions) {
  console.log("Existing Workflow Conditions:", workflowConditions);

  const ticketworkflowContainer = document.getElementById('ticketworkflow-container');

  const eventContainer = document.createElement('div');
  eventContainer.classList.add('event-container');
  eventContainer.style.boxShadow = '0 5px 10px 0 rgba(0, 0, 0, 0.2)';
  eventContainer.style.padding = '30px';
  eventContainer.style.marginBottom = '15px';
  eventContainer.style.borderRadius = '5px';
  eventContainer.style.backgroundColor = '#fff';

  const newDropdownSet = document.createElement('div');
  newDropdownSet.classList.add('row', 'ticketworkflow-dropdown');

  let selectedEvent = typeof eventName === 'string' ? eventName : '';
  
  const eventNameContainer = document.createElement('div');
  eventNameContainer.classList.add('col-md-2', 'event-name-container');
  const eventSelect = document.createElement('fw-select');
  eventSelect.classList.add('event-name-dropdown');
  eventSelect.setAttribute('label', 'Select Event Name');
  eventSelect.setAttribute('required', 'true');
  eventSelect.setAttribute('placeholder', 'Your choice');
  eventSelect.setAttribute('hint-text', 'Select singular option');

  const eventOptions = [
      { value: 'TicketCreate', text: 'Ticket Create' },
      { value: 'TicketUpdate', text: 'Ticket Update' },
      { value: 'TicketCreateandUpdate', text: 'Ticket Create and Update' }
  ];

  eventOptions.forEach(option => {
      const fwOption = document.createElement('fw-select-option');
      fwOption.setAttribute('value', option.value);
      if (selectedEvent === option.value) fwOption.setAttribute('selected', 'true');
      fwOption.textContent = option.text;
      eventSelect.appendChild(fwOption);
  });

  eventNameContainer.appendChild(eventSelect);
  newDropdownSet.appendChild(eventNameContainer);

  eventSelect.addEventListener('fwChange', async () => {
      const newEvent = eventSelect.value;

      console.log("Previous Selected Event:", selectedEvent);
      console.log("New Event Name:", newEvent);
      
      const previousEventIndex = workflowConditions.findIndex(cond => cond.eventName === selectedEvent);
      if (previousEventIndex !== -1) {
          workflowConditions.splice(previousEventIndex, 1);
          console.log(`Removed existing condition for event: "${selectedEvent}"`);
      }

      newDropdownSet.querySelectorAll('.field-name-container, .choices-container, .button-container').forEach(container => container.remove());

      const newCondition = { eventName: newEvent, isEnabled: true, fields: {} };
      workflowConditions.push(newCondition);
      console.log(`Added new condition for: "${newEvent}"`);
      
      const fieldNameContainer = document.createElement('div');
      fieldNameContainer.classList.add('col-md-2', 'field-name-container');
      newDropdownSet.appendChild(fieldNameContainer);

      const choicesContainer = document.createElement('div');
      choicesContainer.classList.add('col-md-2', 'choices-container');
      newDropdownSet.appendChild(choicesContainer);

      const buttonContainer = document.createElement('div');
      buttonContainer.classList.add('col-md-3', 'button-container');
      buttonContainer.style.marginTop = '25px';
      newDropdownSet.appendChild(buttonContainer);
      
      await fieldschoosingvalues(newEvent, fieldNameContainer, choicesContainer, buttonContainer, newDropdownSet, );

      selectedEvent = newEvent;
  });

  eventContainer.appendChild(newDropdownSet);
  ticketworkflowContainer.appendChild(eventContainer);
}


in this how you map existing event value to the dropdown