Merge pull request #475 from solocommand/change-email-placeholder

Add change email config and placeholder template
parameter1 · Nov 3, 2022 · 1de66c9 · 1de66c9
2 parents 83622ff + faf3fc4
commit 1de66c9
Show file tree

Hide file tree

Showing 8 changed files with 49 additions and 3 deletions.
diff --git a/packages/marko-web-identity-x/browser/authenticate.vue b/packages/marko-web-identity-x/browser/authenticate.vue
@@ -23,6 +23,7 @@
       :button-label="buttonLabel"
       :call-to-action="callToAction"
       :default-field-labels="defaultFieldLabels"
+      :enable-change-email="enableChangeEmail"
       @profile-updated="redirect"
     />
   </div>
@@ -128,6 +129,10 @@ export default {
       type: String,
       default: null,
     },
+    enableChangeEmail: {
+      type: Boolean,
+      default: false,
+    },
   },
 
   /**

diff --git a/packages/marko-web-identity-x/browser/profile.vue b/packages/marko-web-identity-x/browser/profile.vue
@@ -158,6 +158,14 @@
           <button type="submit" class="btn btn-primary">
             {{ buttonLabel }}
           </button>
+          <a
+            v-if="enableChangeEmail"
+            :href="endpoints.changeEmail"
+            class="ml-3 btn btn-secondary"
+            title="Change your login email address"
+          >
+            Change email
+          </a>
           <span v-if="didSubmit" class="ml-2">
             {{ submitMessage }}
           </span>
@@ -313,6 +321,10 @@ export default {
       type: String,
       default: null,
     },
+    enableChangeEmail: {
+      type: Boolean,
+      default: false,
+    },
   },
 
   /**

diff --git a/packages/marko-web-identity-x/components/form-authenticate.marko b/packages/marko-web-identity-x/components/form-authenticate.marko
@@ -14,16 +14,17 @@ $ const additionalEventData = defaultValue(input.additionalEventData, {});
       redirectTo: query.redirectTo,
       requiredServerFields: identityX.config.getRequiredServerFields(),
       requiredClientFields: identityX.config.getRequiredClientFields(),
-      defaultCountryCode: identityX.config.get('defaultCountryCode'),
+      defaultCountryCode: identityX.config.get("defaultCountryCode"),
       defaultFieldLabels: identityX.config.get("defaultFieldLabels"),
-      booleanQuestionsLabel: identityX.config.get('booleanQuestionsLabel'),
+      booleanQuestionsLabel: identityX.config.get("booleanQuestionsLabel"),
       hiddenFields: identityX.config.getHiddenFields(),
       endpoints: identityX.config.getEndpoints(),
       callToAction: input.callToAction,
       buttonLabel: input.buttonLabel,
       consentPolicy: get(application, "organization.consentPolicy"),
       emailConsentRequest: get(application, "organization.emailConsentRequest"),
       regionalConsentPolicies: get(application, "organization.regionalConsentPolicies"),
+      enableChangeEmail: identityX.config.get("enableChangeEmail")
     };
     <marko-web-browser-component name="IdentityXAuthenticate" props=props />
   </marko-web-identity-x-context>

diff --git a/packages/marko-web-identity-x/components/form-profile.marko b/packages/marko-web-identity-x/components/form-profile.marko
@@ -25,6 +25,7 @@ $ const additionalEventData = defaultValue(input.additionalEventData, {});
       appContextId: identityX.config.get("appContextId"),
       regionalConsentPolicies: get(application, "organization.regionalConsentPolicies"),
       returnTo: query.returnTo,
+      enableChangeEmail: identityX.config.get("enableChangeEmail"),
     };
     <if(isEnabled)>
       <marko-web-browser-component name="IdentityXProfile" props=props />

diff --git a/packages/marko-web-identity-x/config.js b/packages/marko-web-identity-x/config.js
@@ -32,6 +32,7 @@ class IdentityXConfiguration {
     this.appId = appId;
     this.apiToken = apiToken;
     this.options = {
+      enableChangeEmail: false,
       requiredServerFields,
       requiredClientFields,
       defaultFieldLabels,
@@ -48,7 +49,14 @@ class IdentityXConfiguration {
       ...rest,
     };
 
-    this.endpointTypes = ['authenticate', 'login', 'logout', 'register', 'profile'];
+    this.endpointTypes = [
+      'authenticate',
+      'changeEmail',
+      'login',
+      'logout',
+      'register',
+      'profile',
+    ];
     this.hooks = validHooks.reduce((o, name) => ({ ...o, [name]: [] }), {});
   }
 

diff --git a/services/example-website/config/identity-x.js b/services/example-website/config/identity-x.js
@@ -8,6 +8,7 @@ module.exports = new IdentityXConfiguration({
   requiredServerFields: ['givenName', 'familyName', 'countryCode'],
   requiredClientFields: ['regionCode', 'countryCode'],
   booleanQuestionsLabel: 'Choose your subscriptions:',
+  enableChangeEmail: true,
   defaultFieldLabels: {
     phoneNumber: 'Mobile Phone',
     organization: 'Company Name',

diff --git a/services/example-website/server/templates/user/change-email.marko b/services/example-website/server/templates/user/change-email.marko
@@ -0,0 +1,16 @@
+$ const { config } = out.global;
+
+$ const type = "change-email";
+$ const title = "Change Email";
+
+<marko-web-default-page-layout type=type title=title description=title>
+  <@page>
+    <marko-web-page-wrapper>
+      <@section>
+        <p class="lead">Change your email address</p>
+        <p class="text-muted">This feature is coming soon!</p>
+        <p>If you need assistance, please reach out to our <a href="/page/contact-us">support team</a>.</p>
+      </@section>
+    </marko-web-page-wrapper>
+  </@page>
+</marko-web-default-page-layout>
diff --git a/services/example-website/server/templates/user/index.js b/services/example-website/server/templates/user/index.js
@@ -1,10 +1,12 @@
 const authenticate = require('./authenticate');
+const changeEmail = require('./change-email');
 const login = require('./login');
 const logout = require('./logout');
 const profile = require('./profile');
 
 module.exports = {
   authenticate,
+  changeEmail,
   login,
   logout,
   profile,