From 2f9a6ac593003c721dc065f3874716bacdfe34ef Mon Sep 17 00:00:00 2001
From: Jack <xjlin0@gmail.com>
Date: Mon, 20 May 2024 07:01:13 -0700
Subject: [PATCH] fix the bug after add/deteling family for an attendee in
 attendee update page

---
 .../static/js/persons/attendee_update_view.js      | 14 ++++++++++++++
 attendees/static/js/shared/utilities.js            |  5 +++++
 2 files changed, 19 insertions(+)

diff --git a/attendees/static/js/persons/attendee_update_view.js b/attendees/static/js/persons/attendee_update_view.js
index b5ea49e..1ef6219 100644
--- a/attendees/static/js/persons/attendee_update_view.js
+++ b/attendees/static/js/persons/attendee_update_view.js
@@ -219,6 +219,18 @@ Attendees.datagridUpdate = {
     }, {});
   },
 
+  removeFamilyFromAttendeeDropDowns: (deletingFamilyId) => {
+    const newAttendeeDxDropDownButton = Attendees.datagridUpdate.attendeeMainDxForm.getEditor('add_new_attendee');
+    Attendees.utilities.removeElementFromArray(Attendees.datagridUpdate.families, 'id', deletingFamilyId);
+    document.querySelectorAll('div.dropdown-menu-right a').forEach(x=> { if (x.getAttribute('href').includes(deletingFamilyId)) {x.parentNode.removeChild(x)} });
+    newAttendeeDxDropDownButton.option('dataSource', Attendees.datagridUpdate.families);
+    if (Attendees.datagridUpdate.families.length < 1) {
+      newAttendeeDxDropDownButton.option('text', '+New family member');
+      newAttendeeDxDropDownButton.option('hint', 'Need at least one family to add family members');
+      newAttendeeDxDropDownButton.option('disabled', true);
+    }
+  },
+
   patchNewAttendeeDropDownAndFamilyAddress: (newFamily) => {
     const newAttendeeDxDropDownButton = Attendees.datagridUpdate.attendeeMainDxForm.getEditor('add_new_attendee');
     const $newAttendeeLinkWithoutFamily = $('a.add-new-attendee').last();  // Non-devextreme button for creating attendee (to family)
@@ -256,6 +268,7 @@ Attendees.datagridUpdate = {
       });
     }
     if (Attendees.datagridUpdate.families.length > 0) {
+      newAttendeeDxDropDownButton.option('disabled', false);
       newAttendeeDxDropDownButton.option('dataSource', Attendees.datagridUpdate.families);
       newAttendeeDxDropDownButton.option('hint', 'Select a family to add a new member');
     }
@@ -3625,6 +3638,7 @@ Attendees.datagridUpdate = {
                       url: `${$('form#family-attr-update-popup-form').attr('action')}${Attendees.datagridUpdate.familyAttrPopupDxFormData.id}/`,
                       method: 'DELETE',
                       success: (response) => {
+                        Attendees.datagridUpdate.removeFamilyFromAttendeeDropDowns(familyAttrButton.value);
                         Attendees.datagridUpdate.familyAttrPopup.hide();
                         DevExpress.ui.notify(
                           {
diff --git a/attendees/static/js/shared/utilities.js b/attendees/static/js/shared/utilities.js
index 3fbd5f6..13eeeb5 100644
--- a/attendees/static/js/shared/utilities.js
+++ b/attendees/static/js/shared/utilities.js
@@ -231,6 +231,11 @@ Attendees.utilities = {
     window.sessionStorage.setItem(storageKey, JSON.stringify(state));
   },  // to remove annoyed search text.  Custom stateStoring interfered with column visibility
 
+  removeElementFromArray: (array, key, value) => {
+    const index = array.findIndex(obj => obj[key] === value);
+    return array.splice(index, 1);
+  },
+
   genderEnums: () => {
     return [
       {name: 'MALE'},