merge main and rebuild

Author: MichaelT372

.github/copilot-instructions.md

@@ -26,7 +26,7 @@
 - Tip: when debugging, `?debug=true` sets body `data-engrid-debug`, unlocking debug panels and conditional UI.
 
 ## When in Doubt
-- Search in `packages/scripts/src` before creating new utilities; most EN behaviours already exist (currency, remember-me, plaid, vgs).
+- Search in `packages/scripts/src` before creating new utilities; most EN behaviours already exist (currency, remember-me, stripe financial connections, vgs).
 - Do not hand-edit files under any `dist/` directory—run the relevant build instead.
 - Follow repo Prettier config (`.prettierrc.js`); formatting is enforced even though there are no automated tests.
-- Document new options by updating the interfaces in `packages/scripts/src/interfaces` and exposing them through `OptionsDefaults`.
+- Document new options by updating the interfaces in `packages/scripts/src/interfaces` and exposing them through `OptionsDefaults`.

README.md

@@ -2,5 +2,5 @@
   "packages": [
     "packages/*"
   ],
-  "version": "0.23.7"
+  "version": "0.24.4"
 }

lerna.json

@@ -1,5 +1,5 @@
 import { DonationAmount, DonationFrequency, EnForm, ProcessingFees, Country, } from "./events";
-import { AmountLabel, Loader, ProgressBar, UpsellLightbox, ENGrid, OptionsDefaults, setRecurrFreq, PageBackground, MediaAttribution, ApplePay, A11y, CapitalizeFields, Ecard, ClickToExpand, Advocacy, DataAttributes, LiveVariables, iFrame, InputPlaceholders, InputHasValueAndFocus, ShowHideRadioCheckboxes, AutoCountrySelect, SkipToMainContentLink, SrcDefer, NeverBounce, AutoYear, Autocomplete, RememberMe, TranslateFields, ShowIfAmount, EngridLogger, OtherAmount, MinMaxAmount, Ticker, DataReplace, DataHide, AddNameToMessage, ExpandRegionName, AppVersion, UrlToForm, RequiredIfVisible, TidyContact, DataLayer, LiveCurrency, Autosubmit, EventTickets, SwapAmounts, DebugPanel, DebugHiddenFields, FreshAddress, BrandingHtml, CountryDisable, PremiumGift, DigitalWallets, MobileCTA, LiveFrequency, UniversalOptIn, Plaid, GiveBySelect, UrlParamsToBodyAttrs, ExitIntentLightbox, SupporterHub, FastFormFill, SetAttr, ShowIfPresent, ENValidators, CustomCurrency, VGS, PostalCodeValidator, CountryRedirect, WelcomeBack, EcardToTarget, UsOnlyForm, ThankYouPageConditionalContent, EmbeddedEcard, CheckboxLabel, UpsellCheckbox, PostDonationEmbed, FrequencyUpsell, CustomPremium, StickyNSG, StickyPrepopulation, PreferredPaymentMethod, } from ".";
+import { AmountLabel, Loader, ProgressBar, UpsellLightbox, ENGrid, OptionsDefaults, setRecurrFreq, PageBackground, MediaAttribution, ApplePay, A11y, CapitalizeFields, Ecard, ClickToExpand, Advocacy, DataAttributes, LiveVariables, iFrame, InputPlaceholders, InputHasValueAndFocus, ShowHideRadioCheckboxes, AutoCountrySelect, SkipToMainContentLink, SrcDefer, NeverBounce, AutoYear, Autocomplete, RememberMe, TranslateFields, ShowIfAmount, EngridLogger, OtherAmount, MinMaxAmount, Ticker, DataReplace, DataHide, AddNameToMessage, ExpandRegionName, AppVersion, UrlToForm, RequiredIfVisible, TidyContact, DataLayer, LiveCurrency, Autosubmit, EventTickets, SwapAmounts, DebugPanel, DebugHiddenFields, FreshAddress, BrandingHtml, CountryDisable, PremiumGift, DigitalWallets, MobileCTA, LiveFrequency, UniversalOptIn, StripeFinancialConnections, GiveBySelect, UrlParamsToBodyAttrs, ExitIntentLightbox, SupporterHub, FastFormFill, SetAttr, ShowIfPresent, ENValidators, CustomCurrency, VGS, PostalCodeValidator, CountryRedirect, WelcomeBack, EcardToTarget, UsOnlyForm, ThankYouPageConditionalContent, EmbeddedEcard, CheckboxLabel, UpsellCheckbox, PostDonationEmbed, FrequencyUpsell, CustomPremium, StickyNSG, StickyPrepopulation, PreferredPaymentMethod, } from ".";
 export class App extends ENGrid {
     constructor(options) {
         super();
@@ -264,9 +264,7 @@ export class App extends ENGrid {
         new LiveFrequency();
         // Universal Opt In
         new UniversalOptIn();
-        // Plaid
-        if (this.options.Plaid)
-            new Plaid();
+        new StripeFinancialConnections();
         //Exit Intent Lightbox
         new ExitIntentLightbox();
         new UrlParamsToBodyAttrs();

packages/scripts/dist/app.js

@@ -20,7 +20,6 @@ export declare class DataLayer {
     private handleFieldValueChange;
     private geRetainedFieldsValue;
     private hash;
-    private shaHash;
     private getFieldLabel;
     addEndOfGiftProcessEvent(eventName: string, eventProperties?: object): void;
     addEndOfGiftProcessVariable(variableName: string, variableValue?: any): void;

packages/scripts/dist/data-layer.d.ts

@@ -188,7 +188,7 @@ export class DataLayer {
             if (el.value === "" || this.excludedFields.includes(el.name))
                 return;
             const value = this.hashedFields.includes(el.name)
-                ? this.hash(el.value)
+                ? yield this.hash(el.value)
                 : el.value;
             if (["checkbox", "radio"].includes(el.type)) {
                 if (el.checked) {
@@ -216,7 +216,7 @@ export class DataLayer {
             }
             if (el.name === this.retainedEmailField) {
                 const retainedEmailValue = this.geRetainedFieldsValue("email");
-                const sha256value = yield this.shaHash(retainedEmailValue);
+                const sha256value = yield this.hash(retainedEmailValue);
                 localStorage.setItem(`EN_HASH_EMAIL`, sha256value);
                 this.dataLayer.push({
                     event: "EN_HASH_VALUE_UPDATED",
@@ -228,7 +228,7 @@ export class DataLayer {
             }
             else if (this.retainedAddressFields.includes(el.name)) {
                 const retainedAddressValue = this.geRetainedFieldsValue("address");
-                const sha256value = yield this.shaHash(retainedAddressValue);
+                const sha256value = yield this.hash(retainedAddressValue);
                 localStorage.setItem(`EN_HASH_ADDRESS`, sha256value);
                 this.dataLayer.push({
                     event: "EN_HASH_VALUE_UPDATED",
@@ -239,7 +239,7 @@ export class DataLayer {
             }
             else if (this.retainedPhoneFields.includes(el.name)) {
                 const retainedPhoneValue = this.geRetainedFieldsValue("phone");
-                const sha256value = yield this.shaHash(retainedPhoneValue);
+                const sha256value = yield this.hash(retainedPhoneValue);
                 localStorage.setItem(`EN_HASH_PHONE`, sha256value);
                 this.dataLayer.push({
                     event: "EN_HASH_VALUE_UPDATED",
@@ -281,10 +281,6 @@ export class DataLayer {
         }
     }
     hash(value) {
-        return btoa(value);
-    }
-    // TODO: Replace the hash function with this secure SHA-256 implementation later
-    shaHash(value) {
         return __awaiter(this, void 0, void 0, function* () {
             const data = this.encoder.encode(value);
             const hashBuffer = yield crypto.subtle.digest("SHA-256", data);

packages/scripts/dist/data-layer.js

@@ -15,4 +15,6 @@ export declare class FreshAddress {
     private callAPI;
     private validateResponse;
     private validate;
+    private callProxy;
+    private validateProxyResponse;
 }

packages/scripts/dist/freshaddress.d.ts

@@ -9,6 +9,7 @@ import { ENGrid, EngridLogger } from ".";
 import { EnForm } from "./events";
 export class FreshAddress {
     constructor() {
+        var _a;
         this.form = EnForm.getInstance();
         this.emailField = null;
         this.emailWrapper = document.querySelector(".en__field--emailAddress");
@@ -18,8 +19,10 @@ export class FreshAddress {
         this.logger = new EngridLogger("FreshAddress", "#039bc4", "#dfdfdf", "📧");
         this.shouldRun = true;
         this.options = ENGrid.getOption("FreshAddress");
-        if (this.options === false || !window.FreshAddress)
+        if (this.options === false ||
+            (!window.FreshAddress && !((_a = this.options) === null || _a === void 0 ? void 0 : _a.proxyUrl))) {
             return;
+        }
         this.emailField = document.getElementById("en__field_supporter_emailAddress");
         if (this.emailField) {
             this.createFields();
@@ -89,7 +92,12 @@ export class FreshAddress {
                 return;
             }
             this.logger.log("Validating " + ((_b = this.emailField) === null || _b === void 0 ? void 0 : _b.value));
-            this.callAPI();
+            if (this.options && this.options.proxyUrl) {
+                this.callProxy();
+            }
+            else {
+                this.callAPI();
+            }
         });
         // Add event listener to submit
         this.form.onValidate.subscribe(this.validate.bind(this));
@@ -192,7 +200,7 @@ export class FreshAddress {
         else if (this.faStatus.value === "Invalid") {
             this.form.validate = false;
             window.setTimeout(() => {
-                ENGrid.setError(this.emailWrapper, this.faMessage.value);
+                ENGrid.setError(this.emailWrapper, "This email address is not valid.");
             }, 100);
             (_a = this.emailField) === null || _a === void 0 ? void 0 : _a.focus();
             ENGrid.enableSubmit();
@@ -201,4 +209,87 @@ export class FreshAddress {
         this.form.validate = true;
         return true;
     }
+    callProxy() {
+        var _a, _b;
+        if (!this.options || !this.shouldRun)
+            return;
+        window.FreshAddressStatus = "validating";
+        ENGrid.disableSubmit("Validating Email Address...");
+        // Before calling the API, do a basic check to see if the email is in a valid format.
+        // This is to prevent unnecessary API calls.
+        const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+        if (!emailRegex.test(this.emailField.value)) {
+            this.logger.log("Invalid Email Format from Basic Check");
+            this.writeToFields("Invalid", "Invalid Email Format");
+            ENGrid.setError(this.emailWrapper, "This email address is not valid.");
+            (_a = this.emailField) === null || _a === void 0 ? void 0 : _a.focus();
+            ENGrid.enableSubmit();
+            return;
+        }
+        fetch(this.options.proxyUrl, {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json",
+            },
+            body: JSON.stringify({ email: (_b = this.emailField) === null || _b === void 0 ? void 0 : _b.value }),
+            signal: AbortSignal.timeout(5000),
+        })
+            .then((response) => {
+            if (!response.ok) {
+                throw new Error(`HTTP error ${response.status}`);
+            }
+            return response.json();
+        })
+            .then((data) => {
+            this.logger.log("Proxy API Response", data);
+            this.validateProxyResponse(data);
+        })
+            .catch((error) => {
+            // 422 (Unprocessable Content) - This means the email is in an invalid format.
+            if (error.message.includes("422")) {
+                this.logger.log("Invalid Email Format");
+                this.writeToFields("Invalid", "Invalid Email Format");
+                ENGrid.setError(this.emailWrapper, "This email address is not valid.");
+                return;
+            }
+            if (error.name === "AbortError") {
+                this.logger.log("Proxy API request timed out");
+                this.writeToFields("Request Timeout", "The request took too long.");
+                return;
+            }
+            this.logger.log("Proxy API Error", error);
+            this.writeToFields("Service Error", error.toString());
+        })
+            .finally(() => {
+            window.FreshAddressStatus = "idle";
+            ENGrid.enableSubmit();
+        });
+    }
+    /*
+     * Validate a request proxied to AtData's Safe To Send API.
+     * https://docs.atdata.com/reference/safe-to-send
+     * https://docs.atdata.com/reference/email-status
+     * https://docs.atdata.com/reference/status-codes-safe-to-send
+     */
+    validateProxyResponse(data) {
+        var _a;
+        // If response is not in expected format, log error and let through.
+        if (!data.safe_to_send) {
+            this.logger.log("Invalid Proxy Response");
+            this.writeToFields("Service Error", "Invalid Proxy Response");
+            return true;
+        }
+        const res = data.safe_to_send;
+        ENGrid.removeError(this.emailWrapper);
+        this.writeToFields(res.status, res.status_code);
+        if (["invalid", "trap"].includes(res.status)) {
+            this.writeToFields("Invalid", res.status_code); // Must be "Invalid" to trigger validation error on submit
+            ENGrid.setError(this.emailWrapper, "This email address is not valid.");
+            (_a = this.emailField) === null || _a === void 0 ? void 0 : _a.focus();
+            if (res.email_corrections && res.email_corrections.length > 0) {
+                this.emailField.value = res.email_corrections[0];
+                ENGrid.setError(this.emailWrapper, `This email address is not valid. Did you mean ${res.email_corrections[0]}?`);
+            }
+        }
+    }
 }

packages/scripts/dist/freshaddress.js

@@ -63,7 +63,7 @@ export * from "./digital-wallets";
 export * from "./mobile-cta";
 export * from "./live-frequency";
 export * from "./universal-opt-in";
-export * from "./plaid";
+export * from "./stripe-financial-connections";
 export * from "./give-by-select";
 export * from "./url-params-to-body-attrs";
 export * from "./exit-intent-lightbox";

packages/scripts/dist/index.d.ts

@@ -63,7 +63,7 @@ export * from "./digital-wallets";
 export * from "./mobile-cta";
 export * from "./live-frequency";
 export * from "./universal-opt-in";
-export * from "./plaid";
+export * from "./stripe-financial-connections";
 export * from "./give-by-select";
 export * from "./url-params-to-body-attrs";
 export * from "./exit-intent-lightbox";