MWPW-154135: restricted gnav personalization

edsdme/scripts/personalization.js

@@ -6,6 +6,7 @@ import {
   getPartnerDataCookieObject,
   signedInNonMember,
   isReseller,
+  hasSalesCenterAccess,
   getNodesByXPath,
   isRenew,
 }
@@ -33,6 +34,11 @@ const PERSONALIZATION_CONDITIONS = {
   'partner-level': (level) => PARTNER_LEVEL === level,
 };
 
+const SALES_FORCE_DOMAINS = {
+  stage: 'adobe--sfstage.sandbox.my.site.com',
+  prod: 'adobe.force.com',
+};
+
 function personalizePlaceholders(placeholders, context = document) {
   Object.entries(placeholders).forEach(([key, value]) => {
     const placeholderValue = COOKIE_OBJECT[key];
@@ -47,17 +53,23 @@ function personalizePlaceholders(placeholders, context = document) {
   });
 }
 
-function shouldHide(conditions) {
+function shouldHide(conditions, conditionsConfig = PERSONALIZATION_CONDITIONS) {
   return conditions.every((condition) => {
     const conditionLevel = condition.startsWith(LEVEL_CONDITION) ? condition.split('-').pop() : '';
     return conditionLevel
-      ? !PERSONALIZATION_CONDITIONS[LEVEL_CONDITION](conditionLevel) : !PERSONALIZATION_CONDITIONS[condition];
+      ? !conditionsConfig[LEVEL_CONDITION](conditionLevel) : !conditionsConfig[condition];
   });
 }
 
-function hideElement(element, conditions) {
+function hideElement(element, conditions, conditionsConfig = PERSONALIZATION_CONDITIONS, remove = false) {
   if (!element || !conditions?.length) return;
-  shouldHide(conditions) && element.classList.add(PERSONALIZATION_HIDE);
+  if (shouldHide(conditions, conditionsConfig)) {
+    if (remove) {
+      element.remove();
+    } else {
+      element.classList.add(PERSONALIZATION_HIDE);
+    }
+  }
 }
 
 function hideSections(page) {
@@ -127,18 +139,12 @@ function processRenew(profile) {
 }
 
 function processSalesAccess(el) {
-  const salesAccess = COOKIE_OBJECT['salesCenterAccess'];
+  const salesAccess = hasSalesCenterAccess();
   const element = el.parentElement;
   if (!salesAccess) {
     element.classList.add(PERSONALIZATION_HIDE);
     return;
   }
-  const { env } = getConfig();
-  if (env.name !== 'prod') {
-    const url = new URL(el.href);
-    url.hostname = 'adobe--sfstage.sandbox.my.site.com';
-    el.href = url;
-  }
   const divider = document.createElement('hr');
   element.insertBefore(divider, el);
 }
@@ -155,12 +161,13 @@ function processAccountManagement(el) {
 function processGnavElements(elements) {
   const regex = /(?<=\().*?(?=\))/g;
   return elements.map((el) => {
-    const match = el.textContent.match(regex)[0];
-    if (!match) return {};
+    const matches = el.textContent.match(regex);
+    if (!matches?.length) return {};
+    const match = matches[0];
     el.textContent = el.textContent.replace(`(${match})`, '');
     const conditions = match.split(',').map((condition) => condition.trim());
     if (!conditions.length) return {};
-    return { el, conditions }
+    return { el, conditions };
   });
 }
 
@@ -174,24 +181,76 @@ function personalizeDropdownElements(profile) {
   const personalizationXPath = `//*[contains(text(), "${PERSONALIZATION_MARKER}")]`;
   const elements = getNodesByXPath(personalizationXPath, profile);
   const processedElements = processGnavElements(elements);
-  processedElements.forEach(({el, conditions}) => {
+  processedElements.forEach(({ el, conditions }) => {
     if (!el || !conditions) return;
     const action = conditions.pop();
     PROFILE_PERSONALIZATION_ACTIONS[action]?.(el);
   });
 }
 
+const MAIN_NAV_PERSONALIZATION_CONDITIONS = {
+  ...PERSONALIZATION_CONDITIONS,
+  'partner-sales-access': hasSalesCenterAccess(),
+};
+
+function personalizeMainNav(gnav) {
+  const personalizationXPath = `//*[contains(text(), "${PERSONALIZATION_MARKER}") and not(ancestor::*[contains(@class, "profile")])]`;
+  const elements = getNodesByXPath(personalizationXPath, gnav);
+  const processedElements = processGnavElements(elements);
+  const separatorSelector = 'h5';
+
+  processedElements.forEach(({ el, conditions }) => {
+    if (!el || !conditions) return;
+
+    if (el.tagName.toLowerCase() === separatorSelector) {
+      // main nav dropdown menu group separators
+      const { nextElementSibling } = el;
+      const hide = shouldHide(conditions, MAIN_NAV_PERSONALIZATION_CONDITIONS);
+      if (nextElementSibling?.tagName.toLowerCase() !== separatorSelector && hide) {
+        nextElementSibling.remove();
+      }
+    }
+
+    const wrapperEl = el.closest('h2, li');
+    hideElement(wrapperEl || el, conditions, MAIN_NAV_PERSONALIZATION_CONDITIONS, true);
+  });
+
+  // link group blocks
+  const linkGroups = gnav.querySelectorAll('.link-group.partner-personalization');
+  Array.from(linkGroups).forEach((el) => {
+    const conditions = Object.values(el.classList);
+    hideElement(el, conditions, MAIN_NAV_PERSONALIZATION_CONDITIONS, true);
+  });
+}
+
 function personalizeProfile(gnav) {
   const profile = gnav.querySelector('.profile');
   personalizePlaceholders(GNAV_PERSONALIZATION_PLACEHOLDERS, profile);
   personalizeDropdownElements(profile);
   processRenew(profile);
 }
 
+function rewriteSalesForceLinks(gnav) {
+  const { env } = getConfig();
+
+  if (env.name !== 'prod') {
+    const links = gnav.querySelectorAll('a[href]');
+    links.forEach((link) => {
+      const href = link.getAttribute('href');
+
+      if (href.includes(SALES_FORCE_DOMAINS.prod)) {
+        const newHref = href.replace(SALES_FORCE_DOMAINS.prod, SALES_FORCE_DOMAINS.stage);
+        link.setAttribute('href', newHref);
+      }
+    });
+  }
+}
+
 export function applyGnavPersonalization(gnav) {
   if (!isMember()) return gnav;
   const importedGnav = document.importNode(gnav, true);
+  rewriteSalesForceLinks(importedGnav);
+  personalizeMainNav(importedGnav);
   personalizeProfile(importedGnav);
   return importedGnav;
 }
-

edsdme/scripts/utils.js

@@ -138,6 +138,11 @@ export function isReseller(level) {
   return RESSELER_LEVELS.includes(level?.toLowerCase());
 }
 
+export function hasSalesCenterAccess() {
+  const { salesCenterAccess } = getPartnerDataCookieObject(getCurrentProgramType());
+  return !!salesCenterAccess;
+}
+
 export function getMetadataContent(name) {
   return document.querySelector(`meta[name="${name}"]`)?.content;
 }

test/scripts/mocks/gnav-personalization.html

@@ -5,6 +5,28 @@
       </div>
     </div>
   </div>
+  <div>
+    <h2 id="text-platinum">text platinum(partner-personalization, partner-level-platinum)</h2>
+  </div>
+  <div>
+    <p>
+      <strong>
+        <a href="/channelpartners/program/">cta primary platinum(partner-personalization, partner-level-platinum)</a>
+      </strong>
+    </p>
+  </div>
+  <div>
+    <p>
+      <em>
+        <a href="/channelpartners/program/">cta secondary platinum(partner-personalization, partner-level-platinum)</a>
+      </em>
+    </p>
+  </div>
+  <div>
+    <h2>
+      <a href="/channelpartners/program/">link platinum(partner-personalization, partner-level-platinum)</a>
+    </h2>
+  </div>
   <div>
     <p><a href="http://main--dme-partners--adobecom.hlx.page/channelpartners/">Personalization Gnav</a></p>
   </div>
@@ -13,16 +35,22 @@ <h2 id="price-listpartner-personalization-partner-level-platinum"><a href="http:
   </div>
   <div>
     <h2 id="sales--marketing">Sales &amp; Marketing</h2>
-    <h5 id="marketingpartner-personalization-partner-level-platinum">Marketing(partner-personalization, partner-level-platinum)</h5>
+    <h5 id="marketingpartner-personalization-partner-level-gold">Marketing
+    </h5>
     <ul>
       <li><a href="/channelpartners/program/">Logos &amp; Badges</a></li>
     </ul>
-    <h5 id="sales-centerpartner-personalization-partner-level-gold">Sales Center(partner-personalization, partner-level-gold)</h5>
+    <h5 id="sales-center">Sales Center(partner-personalization, partner-sales-access)</h5>
     <ul>
-      <li><a href="/channelpartners/program/">Dashboard and reports</a></li>
-      <li><a href="/channelpartners/program/">Accounts(partner-personalization, partner-level-platinum)</a></li>
+      <li><a href="/channelpartners/program/">Dashboard and reports</a>
+      </li>
+      <li><a href="/channelpartners/program/">Accounts</a></li>
       <li><a href="/channelpartners/program/">Opportunities</a></li>
-      <li><em><a href="/channelpartners/program/">Create new opportunity(partner-personalization, partner-level-platinum)</a></em></li>
+      <li>
+        <em>
+          <a href="/channelpartners/program/">Create new opportunity</a>
+        </em>
+      </li>
     </ul>
   </div>
   <div>
@@ -37,7 +65,7 @@ <h2 id="sales--marketing-1">Sales &amp; Marketing</h2>
     <h2 id="program"><a href="/channelpartners/program/">Program</a></h2>
   </div>
   <div>
-    <h2 id="announcementspartner-personalizationregion-es">Announcements(partner-personalization,region-es)</h2>
+    <h2 id="announcements">Announcements</h2>
   </div>
   <div>
     <h2 id="support"><a href="/channelpartners/program/">Support</a></h2>

test/scripts/personalization.jest.js

@@ -269,6 +269,62 @@ describe('Test personalization.js', () => {
         expect(salesCenterLink.classList.contains(PERSONALIZATION_HIDE_CLASS)).toBeFalsy();
       });
     });
+    it('Should hide partner-level-platinum gnav items for non-platinum user', () => {
+      jest.isolateModules(() => {
+        const cookieObject = {
+          CPP: {
+            status: 'MEMBER',
+            firstName: 'Test user',
+            level: 'Silver',
+          },
+        };
+        document.cookie = `partner_data=${JSON.stringify(cookieObject)}`;
+        const { applyGnavPersonalization } = importModules();
+
+        let platinumText = gnav.querySelector('#text-platinum');
+        const anchorsFilterPredicate = (el) => el.textContent.includes('cta primary platinum') || el.textContent.includes('cta secondary platinum') || el.textContent.includes('link platinum');
+        let anchorsArray = Array.from(gnav.querySelectorAll('a')).filter(anchorsFilterPredicate);
+
+        expect(platinumText).not.toBeNull();
+        expect(anchorsArray.length).toBe(3);
+
+        const result = applyGnavPersonalization(gnav);
+
+        platinumText = result.querySelector('#text-platinum');
+        anchorsArray = Array.from(gnav.querySelectorAll('a')).filter(anchorsFilterPredicate);
+
+        expect(platinumText).toBeNull();
+        expect(anchorsArray.length).toBe(0);
+      });
+    });
+
+    it('Should hide partner-sales-access gnav items for users without sales center access', () => {
+      jest.isolateModules(() => {
+        const cookieObject = {
+          CPP: {
+            status: 'MEMBER',
+            firstName: 'Test user',
+            level: 'Silver',
+            salesCenterAccess: false,
+          },
+        };
+        document.cookie = `partner_data=${JSON.stringify(cookieObject)}`;
+        const { applyGnavPersonalization } = importModules();
+
+        let heading = gnav.querySelector('#sales-center');
+        let list = gnav.querySelector('#sales-center + ul');
+
+        expect(heading).not.toBeNull();
+        expect(list).not.toBeNull();
+
+        const result = applyGnavPersonalization(gnav);
+
+        heading = result.querySelector('#sales-center');
+        list = result.querySelector('#sales-center + ul');
+
+        expect(heading).toBeNull();
+        expect(list).toBeNull();
+      });
+    });
   });
 });
-