diff --git a/src/registrar/assets/js/get-gov-admin.js b/src/registrar/assets/js/get-gov-admin.js
index b79123221..7295ec6ce 100644
--- a/src/registrar/assets/js/get-gov-admin.js
+++ b/src/registrar/assets/js/get-gov-admin.js
@@ -510,110 +510,94 @@ document.addEventListener('DOMContentLoaded', function() {
const dropdown = document.getElementById("id_action_needed_reason");
const textarea = document.getElementById("id_action_needed_reason_email")
const domainRequestId = dropdown ? document.getElementById("domain_request_id").value : null
-
- if(dropdown && textarea && domainRequestId) {
-
- const texareaPlaceholder = document.querySelector(".field-action_needed_reason_email__placeholder");
- const directEditButton = document.querySelector('.field-action_needed_reason_email__edit');
- const modalTrigger = document.querySelector('.field-action_needed_reason_email__modal-trigger');
- const modalConfirm = document.getElementById('confirm-edit-email');
- const formLabel = document.querySelector('label[for="id_action_needed_reason_email"]');
- const greenCheckMark = ``;
- let lastSentEmailContent = document.getElementById("last-sent-email-content");
-
- const helpText = document.querySelector('.field-action_needed_reason_email .help');
-
- // Get the list of emails associated with each action-needed dropdown value
- const emailData = document.getElementById('action-needed-emails-data');
- const actionNeededEmailData = emailData.textContent;
- const actionNeededEmailsJson = JSON.parse(actionNeededEmailData);
- // Get initial dropdown and email
- const initialDropdownValue = dropdown ? dropdown.value : null;
- const initialEmailValue = actionNeededEmailData ? actionNeededEmailData.value : null;
-
- if(
- !formLabel ||
- !modalConfirm ||
- !actionNeededEmailData) {
- return;
- }
-
- function updateUserInterface(reason) {
- if (!reason) {
- // No reason selected, we will set the label to "Email", show the "Make a selection" placeholder, hide the trigger, textarea, hide the help text
- formLabel.innerHTML = "Email:";
- showElement(texareaPlaceholder);
- texareaPlaceholder.innerHTML = "Select an action needed reason to see email";
- hideElement(directEditButton);
- hideElement(modalTrigger);
- hideElement(textarea);
- hideElement(helpText);
- } else if (reason == 'other') {
- // 'Other' selected, we will set the label to "Email", show the "No email will be sent" placeholder, hide the trigger, textarea, hide the help text
- formLabel.innerHTML = "Email:";
- showElement(helpText);
- showElement(texareaPlaceholder);
- texareaPlaceholder.innerHTML = "No email will be sent";
- hideElement(directEditButton);
- hideElement(modalTrigger);
- hideElement(textarea);
- hideElement(helpText);
- } else {
- // A triggering selection is selected, all hands on board:
- hideElement(texareaPlaceholder);
- showElement(textarea);
- textarea.setAttribute('readonly', true);
- showElement(helpText);
- if (checkEmailAlreadySent()) {
- hideElement(directEditButton);
- showElement(modalTrigger);
- formLabel.innerHTML = greenCheckMark + "Email sent to the creator:"
- helpText.innerHTML = "This email has been sent to the creator of this request"
- } else {
- showElement(directEditButton);
- hideElement(modalTrigger);
- formLabel.innerHTML = "Auto-generated email that will be sent to the creator";
- helpText.innerHTML = "This email will be sent to the creator of this request after saving";
- }
- }
- }
-
- function checkEmailAlreadySent() {
- lastEmailSent = lastSentEmailContent.value.replace(/\s+/g, '')
- currentEmailInTextArea = textarea.value.replace(/\s+/g, '')
- return lastEmailSent === currentEmailInTextArea
- }
-
- // Init the UI
- updateUserInterface(dropdown.value);
-
- // Add a change listener to the action needed reason dropdown
- dropdown.addEventListener("change", function() {
- let reason = dropdown.value;
- let emailBody = reason in actionNeededEmailsJson ? actionNeededEmailsJson[reason] : null;
-
- if (reason && emailBody) {
- // If it's not the initial value
- if (initialDropdownValue !== dropdown.value || initialEmailValue !== textarea.value) {
- // Replace the email content
- textarea.value = emailBody;
- }
- }
-
- // Update the UI
- updateUserInterface(reason);
- });
-
- modalConfirm.addEventListener("click", function() {
- textarea.removeAttribute('readonly');
- });
-
- directEditButton.addEventListener("click", function() {
- textarea.removeAttribute('readonly');
- });
+ const texareaPlaceholder = document.querySelector(".field-action_needed_reason_email__placeholder");
+ const directEditButton = document.querySelector('.field-action_needed_reason_email__edit');
+ const modalTrigger = document.querySelector('.field-action_needed_reason_email__modal-trigger');
+ const modalConfirm = document.getElementById('confirm-edit-email');
+ const formLabel = document.querySelector('label[for="id_action_needed_reason_email"]');
+ const greenCheckMark = ``;
+ let lastSentEmailContent = document.getElementById("last-sent-email-content");
+ const helpText = document.querySelector('.field-action_needed_reason_email .help');
+ const emailData = document.getElementById('action-needed-emails-data');
+ const actionNeededEmailData = emailData.textContent;
+ const actionNeededEmailsJson = JSON.parse(actionNeededEmailData);
+ const initialDropdownValue = dropdown ? dropdown.value : null;
+ const initialEmailValue = actionNeededEmailData ? actionNeededEmailData.value : null;
+ // We will use the const to control the modal
+ let isEmailAlreadySentConst = lastSentEmailContent.value.replace(/\s+/g, '') === textarea.value.replace(/\s+/g, '');
+ // We will use the function to control the label and help
+ function isEmailAlreadySent() {
+ return lastSentEmailContent.value.replace(/\s+/g, '') === textarea.value.replace(/\s+/g, '');
}
+
+ if (!dropdown || !textarea || !domainRequestId || !formLabel || !modalConfirm || !emailData) return;
+
+ function updateUserInterface(reason) {
+ if (!reason) {
+ // No reason selected, we will set the label to "Email", show the "Make a selection" placeholder, hide the trigger, textarea, hide the help text
+ formLabel.innerHTML = "Email:";
+ showElement(texareaPlaceholder);
+ texareaPlaceholder.innerHTML = "Select an action needed reason to see email";
+ hideElement(directEditButton);
+ hideElement(modalTrigger);
+ hideElement(textarea);
+ hideElement(helpText);
+ } else if (reason == 'other') {
+ // 'Other' selected, we will set the label to "Email", show the "No email will be sent" placeholder, hide the trigger, textarea, hide the help text
+ formLabel.innerHTML = "Email:";
+ showElement(helpText);
+ showElement(texareaPlaceholder);
+ texareaPlaceholder.innerHTML = "No email will be sent";
+ hideElement(directEditButton);
+ hideElement(modalTrigger);
+ hideElement(textarea);
+ hideElement(helpText);
+ } else {
+ // A triggering selection is selected, all hands on board:
+ hideElement(texareaPlaceholder);
+ showElement(textarea);
+ textarea.setAttribute('readonly', true);
+ showElement(helpText);
+ if (isEmailAlreadySentConst) {
+ hideElement(directEditButton);
+ showElement(modalTrigger);
+ } else {
+ showElement(directEditButton);
+ hideElement(modalTrigger);
+ }
+ if (isEmailAlreadySent()) {
+ formLabel.innerHTML = greenCheckMark + "Email sent to the creator:"
+ helpText.innerHTML = "This email has been sent to the creator of this request"
+ } else {
+ formLabel.innerHTML = "Auto-generated email that will be sent to the creator";
+ helpText.innerHTML = "This email will be sent to the creator of this request after saving";
+ }
+ }
+ }
+
+ // Initialize UI
+ updateUserInterface(dropdown.value);
+
+ dropdown.addEventListener("change", function() {
+ const reason = dropdown.value;
+ const emailBody = reason in actionNeededEmailsJson ? actionNeededEmailsJson[reason] : null;
+
+ if (reason && emailBody) {
+ // If it's not the initial value
+ if (initialDropdownValue !== dropdown.value || initialEmailValue !== textarea.value) {
+ // Replace the email content
+ textarea.value = emailBody;
+ }
+ }
+
+ // Update the UI
+ updateUserInterface(reason);
+ });
+
+ modalConfirm.addEventListener("click", () => textarea.removeAttribute('readonly'));
+ directEditButton.addEventListener("click", () => textarea.removeAttribute('readonly'));
});