@salesforcedevs/dw-components 1.3.218 → 1.3.225

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@salesforcedevs/dw-components",
-    "version": "1.3.218",
+    "version": "1.3.225",
     "description": "Lightning web components for https://developer.salesforce.com",
     "license": "MIT",
     "engines": {
@@ -24,5 +24,5 @@
         "@types/setimmediate": "^1.0.2",
         "setimmediate": "^1.0.5"
     },
-    "gitHead": "4da04a9390fd75ee83751992b259acb60a47fd98"
+    "gitHead": "e7e2b7ebb5f6b791661026834a9192022fe256ff"
 }

package/src/modules/dw/deSignupForm/deSignupForm.css

@@ -1,4 +1,11 @@
 :host {
+    --dx-c-button-custom-background: var(--dx-g-blue-vibrant-50);
+    --dx-c-button-custom-color: white;
+    --dx-c-button-custom-border: var(--dx-g-blue-vibrant-50);
+    --dx-c-button-custom-color-hover: white;
+    --dx-c-button-custom-background-hover: var(--dx-g-blue-vibrant-40);
+    --dx-c-button-custom-border-hover: var(--dx-g-blue-vibrant-40);
+
     display: block;
 }
 
@@ -55,11 +62,6 @@ form > .full-name-field {
     width: 100%;
 }
 
-.form-submit:hover {
-    background-color: var(--dx-g-blue-vibrant-40);
-    border-color: var(--dx-g-blue-vibrant-40);
-}
-
 @media screen and (min-width: 641px) {
     form > .full-name-field:first-of-type {
         margin-right: var(--dx-g-spacing-lg);

package/src/modules/dw/deSignupForm/deSignupForm.html

@@ -119,6 +119,7 @@
 
         <dx-button
             class="submit-button"
+            variant="custom"
             disabled={disableSubmit}
             size="large"
             type="submit"

package/src/modules/dw/deSignupForm/deSignupForm.ts

@@ -16,6 +16,7 @@ const DEFAULT_DRIVER = "7013000000005wb";
 const DUPLICATE_USERNAME_MESSAGE =
     "You are already using that username in another Salesforce login credential. Your username needs to be unique and in the form of an email address.";
 const SIGN_UP_LABEL = "Sign me Up";
+const SIGN_UP_FORM_TIMEOUT_MS = 18.5 * 1000; // Something in trialforce/DRM's backend (still under investigation) is causing requests to timeout around 20 seconds; we use 18.5 here in case it's sometimes a little faster than that
 
 export default class DeSignupForm extends LightningElement {
     @api
@@ -98,6 +99,26 @@ export default class DeSignupForm extends LightningElement {
         return uuid;
     }
 
+    setSubmitButtonDisabled(isDisabled: boolean): void {
+        this.disableSubmit = isDisabled;
+
+        let backgroundAndBorderColor: string;
+        if (isDisabled) {
+            backgroundAndBorderColor = "var(--dx-g-gray-80)";
+        } else {
+            backgroundAndBorderColor = "var(--dx-g-blue-vibrant-50)";
+        }
+
+        this.template.host.style.setProperty(
+            "--dx-c-button-custom-background",
+            backgroundAndBorderColor
+        );
+        this.template.host.style.setProperty(
+            "--dx-c-button-custom-border",
+            backgroundAndBorderColor
+        );
+    }
+
     handleSubmit(event: Event): void {
         event.preventDefault();
 
@@ -113,7 +134,21 @@ export default class DeSignupForm extends LightningElement {
             return;
         }
 
-        this.disableSubmit = true;
+        // Due to Heroku's non-configurable 30 second request timeout, the POST request that
+        // submits the form can "fail" even though org creation is actually succeeding (but
+        // taking longer than 30 seconds). The back-end only gives us a "generic" error in that
+        // case, so we use a "good enough" heuristic here and direct the user to an "account-verification"
+        // page that doesn't ultimately say things worked, but tells them to watch their email.
+        // This should be a temporary bandaid, not a full solution.
+        let didSubmitTimeout = false;
+        let formSubmissionTimeoutId: number | undefined = window.setTimeout(
+            () => {
+                didSubmitTimeout = true;
+            },
+            SIGN_UP_FORM_TIMEOUT_MS
+        );
+
+        this.setSubmitButtonDisabled(true);
         submitForm(formData)
             .then(() => {
                 trackGtm(event.target!, "custEv_signUp", {
@@ -136,14 +171,27 @@ export default class DeSignupForm extends LightningElement {
                 window.location.href = "/signup/success";
             })
             .catch((error) => {
-                if (error.message === ErrorCode.DUPLICATE) {
-                    this.knownDuplicateUsers.push(formData.user.username);
-                    return;
+                if (error.message === ErrorCode.GENERIC && didSubmitTimeout) {
+                    // If the timeout time has passed at the point of error, and the error code is simply "GENERIC",
+                    // we do not know whether the org will ultimately be created (and we have no current way of confirming),
+                    // so we navigate the user to an interim page that tells them to watch their email.
+                    window.location.href = "/signup/account-verification";
+                } else {
+                    this.setSubmitButtonDisabled(false);
+                    if (error.message === ErrorCode.DUPLICATE) {
+                        this.knownDuplicateUsers.push(formData.user.username);
+                    } else {
+                        console.warn(
+                            "Oops, something went wrong",
+                            error.message
+                        );
+                    }
                 }
-
-                console.log("Oops, something went wrong", error.message);
             })
-            .finally(() => (this.disableSubmit = false));
+            .finally(() => {
+                clearTimeout(formSubmissionTimeoutId);
+                formSubmissionTimeoutId = undefined;
+            });
     }
 
     handleKeyDown(e: KeyboardEvent): void {