@salesforcedevs/dw-components 1.3.105-alpha.0 → 1.3.119

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@salesforcedevs/dw-components",
-    "version": "1.3.105-alpha.0",
+    "version": "1.3.119",
     "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": "22cde8b5972d7ef34581c5c10547c8a25da9bfd4"
+    "gitHead": "a04d7ab5bb8a1686d1d0784dedb688b7f16b5635"
 }

package/src/modules/dw/codeSamplesGrid/codeSamplesGrid.ts

@@ -118,7 +118,6 @@ export default class CodeSamplesGrid extends LightningElement {
             this.selectedProductFilter?.forEach((filter) => {
                 track(document, "custEv_filterAbandoned", {
                     click_text: filter,
-                    click_url: filter,
                     element_title: "CodeSamplesGrid",
                     element_type: "filter abandoned",
                     content_category: "filter"

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

@@ -25,9 +25,7 @@ span {
 }
 
 dx-checkbox,
-.privacy-notice,
-span.privacy-terms,
-span.marketing-terms {
+.privacy-notice {
     width: 100%;
     margin-bottom: var(--dx-g-spacing-lg);
 }

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

@@ -52,7 +52,7 @@
             placeholder="Select Country/Region"
             required
             value=""
-            onchange={handleConsent}
+            onchange={handleCountryChange}
         ></dx-select>
         <dx-input
             label="Postal Code"
@@ -80,33 +80,24 @@
         <dx-checkbox required name="eula" value="accepted">
             <span lwc:dom="manual" class="legal-terms"></span>
         </dx-checkbox>
-
-        <template if:false={showMarketingCheckbox}>
+        <dx-checkbox
+            if:true={showMarketingCheckbox}
+            name="opt_in"
+            value="False"
+        >
             <span lwc:dom="manual" class="marketing-terms"></span>
-        </template>
-        <template if:true={showMarketingCheckbox}>
-            <dx-checkbox
-                name="marketingCheckbox"
-                class="marketing-terms"
-                value="false"
-                onchange={handleMarketingCheckbox}
-            >
-                <span>{marketingText}</span>
-            </dx-checkbox>
-        </template>
-
-        <template if:false={showLegalCheckbox}>
-            <span lwc:dom="manual" class="legal-checkbox privacy-terms"></span>
-        </template>
+        </dx-checkbox>
         <dx-checkbox
-            if:true={showLegalCheckbox}
-            class="privacy-terms"
-            value={legalCheckbox}
-            required="true"
+            if:true={showPrivacyCheckbox}
+            required
+            name="privacy"
+            value="privacy_accepted"
         >
-            <span lwc:dom="manual" class="legal-checkbox privacy-terms"></span>
+            <span lwc:dom="manual" class="privacy-terms"></span>
         </dx-checkbox>
-
+        <template if:false={showPrivacyCheckbox}>
+            <span lwc:dom="manual" class="privacy-terms privacy-notice"></span>
+        </template>
         <dx-button
             class="submit-button"
             disabled={disableSubmit}

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

@@ -2,7 +2,6 @@ import { LightningElement, api, track } from "lwc";
 import { toJson } from "dxUtils/normalizers";
 import { track as trackGtm } from "dxUtils/analytics";
 import { submitForm, ErrorCode, SignupForm, UserData } from "./submitForm";
-import { CountryOptions } from "typings/custom";
 
 type SelectOption = { value: string; label: string };
 type Country = SelectOption & {
@@ -35,21 +34,16 @@ export default class DeSignupForm extends LightningElement {
         this._roles = toJson(value);
     }
 
+    @api marketingText: string = "";
+    @api privacyText: string = "";
     @api legalText: string = "";
-    @api drmDomain: string = "https://drm.my.salesforce-sites.com";
 
     private country: Country = null;
     private disableSubmit = false;
     private username = "";
-    private _countries: string = "";
+    private updateCheckboxLabels = true;
+    private _countries: Array<Country>;
     private _roles: Array<SelectOption>;
-    private showMarketingCheckbox: boolean = false;
-    private marketingCheckbox: boolean = false;
-    private marketingText: string = "";
-    private showLegalCheckbox: boolean = false;
-    private privacyText: string = "";
-    private hasRendered = false;
-
     @track knownDuplicateUsers = [];
 
     get usernameError(): string {
@@ -62,6 +56,10 @@ export default class DeSignupForm extends LightningElement {
         return !this.knownDuplicateUsers.includes(this.username);
     }
 
+    get showMarketingCheckbox(): boolean {
+        return this.country && this.country.showMarketingCheckbox;
+    }
+
     get showPrivacyCheckbox(): boolean {
         return this.country && !!this.country.privacyOptIn;
     }
@@ -70,18 +68,22 @@ export default class DeSignupForm extends LightningElement {
         return this.disableSubmit ? "Beep boop processing" : SIGN_UP_LABEL;
     }
 
-    connectedCallback(): void {
-        this.getCountryList();
-    }
-
     renderedCallback(): void {
-        if (!this.hasRendered) {
-            this.hasRendered = true;
+        if (!this.updateCheckboxLabels) {
             return;
         }
-        this.updateInnerHtml("span.legal-terms", this.legalText);
-        this.updateInnerHtml("span.marketing-terms", this.marketingText);
-        this.updateInnerHtml("span.legal-checkbox", this.privacyText);
+
+        this.updateCheckboxLabels =
+            this.updateInnerHtml("span.legal-terms", this.legalText) ||
+            this.updateInnerHtml(
+                "span.marketing-terms",
+                this.marketingText,
+                this.showMarketingCheckbox
+            ) ||
+            this.updateInnerHtml(
+                "span.privacy-terms",
+                this.country?.privacyText || this.privacyText
+            );
     }
 
     handleSubmit(event: Event): void {
@@ -139,6 +141,13 @@ export default class DeSignupForm extends LightningElement {
         this.username = event.detail;
     }
 
+    handleCountryChange(event: CustomEvent<{ value: string }>): void {
+        this.country = this.countries.find(
+            ({ value }) => value === event.detail.value
+        );
+        this.updateCheckboxLabels = true;
+    }
+
     private prepareUserData(): SignupForm | null {
         const fields = Array.from(
             this.template.querySelectorAll<HTMLFormElement>(
@@ -150,7 +159,9 @@ export default class DeSignupForm extends LightningElement {
             value: element.value
         }));
 
-        if (fields.some((field) => !field.valid)) {
+        const checkboxes = this.getCheckboxesResult();
+
+        if (fields.some((field) => !field.valid) || !checkboxes.valid) {
             return null;
         }
 
@@ -159,15 +170,17 @@ export default class DeSignupForm extends LightningElement {
             userData[field.name] = field.value;
         });
 
-        (userData as UserData).consent = this.showMarketingCheckbox
+        (userData as UserData).consent = this.country.showMarketingCheckbox
             ? "Explicit"
-            : "Implied";
+            : "Implied ";
         const InfoEmail =
-            this.showMarketingCheckbox && !this.marketingCheckbox
+            this.country.showMarketingCheckbox && !checkboxes.values.opt_in
                 ? "False"
                 : "True";
+
         const formData: SignupForm = {
             user: userData as UserData,
+            eula: checkboxes.values.eula,
             default_driver: DEFAULT_DRIVER,
             info_email: InfoEmail
         };
@@ -175,72 +188,24 @@ export default class DeSignupForm extends LightningElement {
         return formData;
     }
 
-    handleConsent(countrySelectElement: any) {
-        countrySelectElement = countrySelectElement.target;
-        const countryOptions = countrySelectElement.options.find(
-            (option: any) => option.value === countrySelectElement.value
-        );
-        this.marketingCheckbox = false;
-        this.setLegalAndMarketingData(countryOptions);
-    }
-
-    handleMarketingCheckbox(marketingCheckbox: any) {
-        this.marketingCheckbox = marketingCheckbox.target.checked;
-    }
-
-    setLegalAndMarketingData(countryOptions: CountryOptions) {
-        // Set the checkbox text
-        this.setCheckboxTextSet(
-            countryOptions.marketingText,
-            countryOptions.learnMore
-                ? `${countryOptions.legalText} </br> ${countryOptions.learnMore}`
-                : countryOptions.legalText
-        );
-
-        // Toggle visibility of legal/marketing data
-        this.toggleLegalAndMarketingVisibility(
-            countryOptions.showMarketingText,
-            countryOptions.showLegalCheckbox
-        );
-    }
-
-    setCheckboxTextSet(marketingText: string, privacyText: string) {
-        this.marketingText = marketingText;
-        this.privacyText = privacyText;
-    }
-
-    toggleLegalAndMarketingVisibility(
-        showMarketingCheckbox: boolean,
-        showLegalCheckbox: boolean
-    ) {
-        this.showMarketingCheckbox = showMarketingCheckbox;
-        this.showLegalCheckbox = showLegalCheckbox;
-    }
-
-    setInnerHtml(element: HTMLElement, value: string) {
-        // disable lwc warning because text received from json has HTML
-        // eslint-disable-next-line @lwc/lwc/no-inner-html
-        element.innerHTML = value;
-    }
-
-    async getCountryList() {
-        const errorMsg = "Error while getting county list";
-
-        try {
-            const res = await fetch(
-                `${this.drmDomain}/utilities/services/apexrest/countries`
-            );
+    private getCheckboxesResult(): {
+        valid: boolean;
+        values: { eula: string; opt_in: "true" | "false" };
+    } {
+        let valid = true;
+        const values: { eula: string; opt_in: "true" | "false" } = {
+            eula: "",
+            opt_in: "false"
+        };
 
-            if (!res.ok) {
-                throw new Error(errorMsg);
-            }
+        Array.from(
+            this.template.querySelectorAll<HTMLInputElement>("dx-checkbox")
+        ).forEach((checkbox) => {
+            valid = valid && checkbox.reportValidity();
+            values[checkbox.name] = checkbox.checked;
+        });
 
-            const data = await res.json();
-            // eslint-disable-next-line @lwc/lwc/no-api-reassignments
-            this._countries = JSON.stringify(data);
-        } catch (error) {
-            console.error(error);
-        }
+        return { valid, values };
     }
 
     private updateInnerHtml(

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

@@ -20,6 +20,7 @@ export type UserData = {
 
 export type SignupForm = {
     user: UserData;
+    eula: string;
     default_driver: string;
     info_email: "True" | "False";
 };

package/src/modules/dw/docsGrid/docsGrid.ts

@@ -548,7 +548,6 @@ export default abstract class DocsGrid extends LightningElement {
             this.selectedProductFilters?.forEach((filter) => {
                 track(document, "custEv_filterAbandoned", {
                     click_text: filter,
-                    click_url: filter,
                     element_title: "docs grid",
                     element_type: "filter abandoned",
                     content_category: "filter"