@sheerid/jslib 1.150.0 → 1.152.0

package/sheerides6.js

@@ -5028,6 +5028,11 @@ const getStatusLabel = (intl, status, defaultMessages) => {
     }
     return intl.formatHTMLMessage({ id: status, defaultMessage: defaultMessages[status] });
 };
+const orgToOption = (org) => ({
+    value: org.id,
+    label: org.name,
+    country: org.country,
+});
 // The jslib should not be the owner of this mapping,
 // DATA-3164 exists to find another way.
 const countryStatusAllowList = new Map([
@@ -14348,7 +14353,7 @@ const createFetchVerificationRequest = async ({ dispatch, verificationResponsePr
         const messagesPromise = getMessages(locale, themeMessages, verificationResponse.segment);
         const nextSegment = verificationResponse.segment;
         let orgList = null;
-        if (nextSegment === SegmentEnum.MILITARY) {
+        if (nextSegment === SegmentEnum.MILITARY || nextSegment === SegmentEnum.LOW_INCOME) {
             const orgListPromise = fetchProgramOrganizations(programTheme.config.orgSearchUrl, "");
             orgList = await orgListPromise;
             logger.info("orgList received: ", orgList);
@@ -18221,11 +18226,6 @@ const orgsInStatus = (status) => (org) => {
     }
     return !!org.name;
 };
-const orgToOption = (org) => ({
-    value: org.id,
-    label: org.name,
-    country: org.country,
-});
 const updateMilitaryViewModel = (key, value, verificationService, availableStatuses) => {
     const viewModel = verificationService.viewModel;
     const nextState = fn(viewModel, (draft) => {
@@ -19399,15 +19399,39 @@ const StepMoverPersonalInfo = ({ verificationService }) => {
 const StepMoverPersonalInfoComponent = injectIntl(StepMoverPersonalInfo);
 
 const LowIncomeOrganization = ({ value, isErrored, onChange, verificationService, intl, placeholder = "", isRequired = false, }) => {
-    const { programId } = verificationService;
+    const { viewModel, orgList } = verificationService;
+    const { countryChoice } = viewModel;
+    let options = [];
+    const inputId = "sid-low-income";
+    if (orgList) {
+        let newOrganizations = orgList;
+        if (countryChoice) {
+            newOrganizations = orgList.filter((org) => org.country === countryChoice.value);
+        }
+        options = newOrganizations.map(orgToOption);
+    }
+    const handleStateChange = (selectedOrgOption, onChange) => {
+        if (selectedOrgOption) {
+            onChange({
+                id: selectedOrgOption.value,
+                name: selectedOrgOption.label,
+            });
+        }
+        else {
+            onChange({
+                id: 0,
+                name: "",
+            });
+        }
+    };
     return (React.createElement("div", { className: "sid-field sid-low-income-id" },
         React.createElement("div", { className: "sid-l-space-top-md" }),
         React.createElement(FieldLabel, { text: React.createElement(FormattedHTMLMessage, { id: "lowIncomeOrganization", defaultMessage: "Government Assistance Program" }), htmlForLabel: "sid-low-income", id: "sid-low-income-label", displayClasses: placeholder && "sid-h-screen-reader-only", isRequired: isRequired }),
-        React.createElement(TypeaheadComponent, { className: isErrored ? "sid-text-input--error" : "", countryCode: getSafe(() => verificationService.viewModel.countryChoice.value), onChange: (choice) => onChange(choice), minimumSearchValueLength: getOptions().minimumOrganizationSearchLength, placeholder: placeholder ||
+        React.createElement(InputSelectComponent, { fieldId: "organization", inputId: inputId, fieldLabelId: `${inputId}-label`, isErrored: isErrored, options: SortByLabel(options), onChange: (organization) => handleStateChange(organization, onChange), value: options.find((option) => option.value === (value && value.value)), placeholder: placeholder ||
                 intl.formatHTMLMessage({
                     id: "lowIncomeOrganizationPlaceholder",
                     defaultMessage: "Government Assistance Program",
-                }), programId: programId, value: value, inputHtmlId: "sid-low-income", openOrgSearchEnabled: verificationService.programTheme.openOrgSearchEnabled, orgSearchUrl: verificationService.programTheme.config.orgSearchUrl }),
+                }), isRequired: isRequired }),
         isErrored ? (React.createElement("div", { className: "sid-field-error" },
             React.createElement(FormattedHTMLMessage, { id: "errorId.invalidOrganization", defaultMessage: "You must select an organization from the list" }))) : null));
 };
@@ -19494,7 +19518,7 @@ const StepLowIncomePersonalInfo = ({ intl, verificationService, }) => {
         selectedStatus === "OTHER_GOVERNMENT_ASSISTANCE" && (React.createElement(LowIncomeOrganizationComponent, { isErrored: !!fieldValidationErrors.organization, onChange: (choice) => {
                 updateViewModelOrganization(choice, verificationService);
                 updateFieldValidationErrorsByFieldId("organization", choice, verificationService);
-            }, value: verificationService.viewModel.organization, verificationService: verificationService, isRequired: true })),
+            }, value: orgToOption(verificationService.viewModel.organization), verificationService: verificationService, isRequired: true })),
         React.createElement("div", { className: "sid-names" },
             React.createElement(FirstNameComponent, { value: viewModel.firstName, isErrored: !!fieldValidationErrors.firstName, onChange: (newValue) => {
                     updateLowIncomeViewModel("firstName", newValue);
@@ -22290,8 +22314,13 @@ class NewVerification extends React.Component {
         N(); // https://sheerid.atlassian.net/browse/UX-362
         maintainFocusInLightbox();
         listenToInstallPage((event) => {
-            if (event.data.action === "setViewModel") {
-                setViewModel(event.data.viewModel);
+            switch (event.data.action) {
+                case "setViewModel":
+                    setViewModel(event.data.viewModel);
+                    break;
+                case "setOptions":
+                    setOptions(event.data.options);
+                    break;
             }
         });
         // Special-case, mocking the loading psuedo-step
@@ -22538,7 +22567,18 @@ class Iframe {
             action: "setViewModel",
             viewModel,
         };
-        this.addOnLoadEvent(() => this.iframe.contentWindow.postMessage(message, this.verificationUrl.origin));
+        this.addOnLoadEvent(() => {
+            this.iframe.contentWindow.postMessage(message, this.verificationUrl.origin);
+        });
+    }
+    setOptions(options) {
+        const message = {
+            action: "setOptions",
+            options,
+        };
+        this.addOnLoadEvent(() => {
+            this.iframe.contentWindow.postMessage(message, this.verificationUrl.origin);
+        });
     }
     setInstallType(installType) {
         this.installType = installType;
@@ -22659,6 +22699,9 @@ class Modal {
     setViewModel(viewModel) {
         this.iframeInstance.setViewModel(viewModel);
     }
+    setOptions(options) {
+        this.iframeInstance.setOptions(options);
+    }
 }
 
 // Called from the parent page to load the jslib within an iFrame NOT in a modal, but in the flow of a page. e.g. between two divs