[Release] Stage to Main (#2260)

libs/blocks/global-navigation/global-navigation.css

@@ -370,6 +370,7 @@ header.global-navigation {
 }
 
 .feds-utilities {
+  position: relative;
   display: flex;
   align-items: center;
   padding: 0 var(--feds-gutter);

libs/blocks/global-navigation/global-navigation.js

@@ -8,38 +8,37 @@ import {
   loadStyle,
 } from '../../utils/utils.js';
 import {
-  toFragment,
-  getFedsPlaceholderConfig,
-  getAnalyticsValue,
+  closeAllDropdowns,
   decorateCta,
+  fetchAndProcessPlainHtml,
+  getActiveLink,
+  getAnalyticsValue,
   getExperienceName,
-  loadDecorateMenu,
+  getFedsPlaceholderConfig,
+  hasActiveLink,
+  icons,
+  isDesktop,
+  isTangentToViewport,
+  lanaLog,
+  loadBaseStyles,
   loadBlock,
+  loadDecorateMenu,
   loadStyles,
-  trigger,
+  logErrorFor,
+  selectors,
   setActiveDropdown,
-  closeAllDropdowns,
-  loadBaseStyles,
-  yieldToMain,
-  isDesktop,
-  isTangentToViewport,
-  setCurtainState,
-  hasActiveLink,
   setActiveLink,
-  getActiveLink,
-  selectors,
-  logErrorFor,
-  lanaLog,
-  fetchAndProcessPlainHtml,
+  setCurtainState,
+  setUserProfile,
+  toFragment,
+  trigger,
+  yieldToMain,
 } from './utilities/utilities.js';
 
 import { replaceKey, replaceKeyArray } from '../../features/placeholders.js';
 
-const CONFIG = {
-  icons: {
-    company: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 133.5 118.1"><defs><style>.cls-1 {fill: #eb1000;}</style></defs><g><g><polygon class="cls-1" points="84.1 0 133.5 0 133.5 118.1 84.1 0"/><polygon class="cls-1" points="49.4 0 0 0 0 118.1 49.4 0"/><polygon class="cls-1" points="66.7 43.5 98.2 118.1 77.6 118.1 68.2 94.4 45.2 94.4 66.7 43.5"/></g></g></svg>',
-    search: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" focusable="false"><path d="M14 2A8 8 0 0 0 7.4 14.5L2.4 19.4a1.5 1.5 0 0 0 2.1 2.1L9.5 16.6A8 8 0 1 0 14 2Zm0 14.1A6.1 6.1 0 1 1 20.1 10 6.1 6.1 0 0 1 14 16.1Z"></path></svg>',
-  },
+export const CONFIG = {
+  icons,
   delays: {
     mainNavDropdowns: 800,
     loadDelayed: 3000,
@@ -63,6 +62,13 @@ const CONFIG = {
             config: {
               enableLocalSection: true,
               miniAppContext: {
+                onMessage: (name, payload) => {
+                  if (name === 'System' && payload.subType === 'AppInitiated') {
+                    window.adobeProfile?.getUserProfile()
+                      .then((data) => { setUserProfile(data); })
+                      .catch(() => { setUserProfile({}); });
+                  }
+                },
                 logger: {
                   trace: () => {},
                   debug: () => {},
@@ -425,6 +431,8 @@ class Gnav {
   };
 
   imsReady = async () => {
+    if (!window.adobeIMS.isSignedInUser() || !this.useUniversalNav) setUserProfile({});
+
     const tasks = [this.useUniversalNav ? this.decorateUniversalNav : this.decorateProfile];
 
     try {
@@ -589,6 +597,9 @@ class Gnav {
       locale,
       imsClientId: window.adobeid?.client_id,
       theme: 'light',
+      onReady: () => {
+        this.decorateAppPrompt({ getAnchorState: () => window.UniversalNav.getComponent?.('app-switcher') });
+      },
       analyticsContext: {
         consumer: {
           name: 'adobecom',
@@ -610,6 +621,27 @@ class Gnav {
     });
   };
 
+  decorateAppPrompt = async ({ getAnchorState } = {}) => {
+    const state = getMetadata('app-prompt')?.toLowerCase();
+    const entName = getMetadata('app-prompt-entitlement')?.toLowerCase();
+    const promptPath = getMetadata('app-prompt-path')?.toLowerCase();
+    if (state === 'off'
+      || !window.adobeIMS?.isSignedInUser()
+      || !isDesktop.matches
+      || !entName?.length
+      || !promptPath?.length) return;
+
+    const { base } = getConfig();
+    const [
+      webappPrompt,
+    ] = await Promise.all([
+      import('../../features/webapp-prompt/webapp-prompt.js'),
+      loadStyle(`${base}/features/webapp-prompt/webapp-prompt.css`),
+    ]);
+
+    webappPrompt.default({ promptPath, entName, parent: this.blocks.universalNav, getAnchorState });
+  };
+
   loadSearch = () => {
     if (this.blocks?.search?.instance) return null;
 

libs/blocks/global-navigation/utilities/menu/menu.js

@@ -1,20 +1,19 @@
 import {
   decorateCta,
+  fetchAndProcessPlainHtml,
   getActiveLink,
   getAnalyticsValue,
-  logErrorFor,
-  setActiveDropdown,
-  trigger,
+  icons,
   isDesktop,
+  lanaLog,
+  logErrorFor,
   selectors,
+  setActiveDropdown,
   toFragment,
+  trigger,
   yieldToMain,
-  fetchAndProcessPlainHtml,
-  lanaLog,
 } from '../utilities.js';
 
-const homeIcon = '<svg xmlns="http://www.w3.org/2000/svg" height="25" viewBox="0 0 18 18" width="25"><path fill="#6E6E6E" d="M17.666,10.125,9.375,1.834a.53151.53151,0,0,0-.75,0L.334,10.125a.53051.53051,0,0,0,0,.75l.979.9785A.5.5,0,0,0,1.6665,12H2v4.5a.5.5,0,0,0,.5.5h4a.5.5,0,0,0,.5-.5v-5a.5.5,0,0,1,.5-.5h3a.5.5,0,0,1,.5.5v5a.5.5,0,0,0,.5.5h4a.5.5,0,0,0,.5-.5V12h.3335a.5.5,0,0,0,.3535-.1465l.979-.9785A.53051.53051,0,0,0,17.666,10.125Z"/></svg>';
-
 const decorateHeadline = (elem, index) => {
   if (!(elem instanceof HTMLElement)) return null;
 
@@ -279,7 +278,7 @@ const decorateCrossCloudMenu = (content) => {
   crossCloudMenuEl.className = 'feds-crossCloudMenu-wrapper';
   crossCloudMenuEl.querySelector('div').className = 'feds-crossCloudMenu';
   crossCloudMenuEl.querySelectorAll('ul li').forEach((el, index) => {
-    if (index === 0) el.querySelector('a')?.prepend(toFragment`${homeIcon}`);
+    if (index === 0) el.querySelector('a')?.prepend(toFragment`${icons.home}`);
     el.className = 'feds-crossCloudMenu-item';
   });
 

libs/blocks/global-navigation/utilities/utilities.js

@@ -32,6 +32,12 @@ export const selectors = {
   columnBreak: '.column-break',
 };
 
+export const icons = {
+  company: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 133.5 118.1"><defs><style>.cls-1 {fill: #eb1000;}</style></defs><g><g><polygon class="cls-1" points="84.1 0 133.5 0 133.5 118.1 84.1 0"/><polygon class="cls-1" points="49.4 0 0 0 0 118.1 49.4 0"/><polygon class="cls-1" points="66.7 43.5 98.2 118.1 77.6 118.1 68.2 94.4 45.2 94.4 66.7 43.5"/></g></g></svg>',
+  search: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" focusable="false"><path d="M14 2A8 8 0 0 0 7.4 14.5L2.4 19.4a1.5 1.5 0 0 0 2.1 2.1L9.5 16.6A8 8 0 1 0 14 2Zm0 14.1A6.1 6.1 0 1 1 20.1 10 6.1 6.1 0 0 1 14 16.1Z"></path></svg>',
+  home: '<svg xmlns="http://www.w3.org/2000/svg" height="25" viewBox="0 0 18 18" width="25"><path fill="#6E6E6E" d="M17.666,10.125,9.375,1.834a.53151.53151,0,0,0-.75,0L.334,10.125a.53051.53051,0,0,0,0,.75l.979.9785A.5.5,0,0,0,1.6665,12H2v4.5a.5.5,0,0,0,.5.5h4a.5.5,0,0,0,.5-.5v-5a.5.5,0,0,1,.5-.5h3a.5.5,0,0,1,.5.5v5a.5.5,0,0,0,.5.5h4a.5.5,0,0,0,.5-.5V12h.3335a.5.5,0,0,0,.3535-.1465l.979-.9785A.53051.53051,0,0,0,17.666,10.125Z"/></svg>',
+};
+
 export const lanaLog = ({ message, e = '', tags = 'errorType=default' }) => {
   const url = getMetadata('gnav-source');
   window.lana.log(`${message} | gnav-source: ${url} | href: ${window.location.href} | ${e.reason || e.error || e.message || e}`, {
@@ -337,3 +343,29 @@ export async function fetchAndProcessPlainHtml({ url, shouldDecorateLinks = true
   body.innerHTML = await replaceText(body.innerHTML, getFedsPlaceholderConfig());
   return body;
 }
+
+export const [setUserProfile, getUserProfile] = (() => {
+  let profileData;
+  let profileResolve;
+  let profileTimeout;
+
+  const profilePromise = new Promise((resolve) => {
+    profileResolve = resolve;
+
+    profileTimeout = setTimeout(() => {
+      profileData = {};
+      resolve(profileData);
+    }, 5000);
+  });
+
+  return [
+    (data) => {
+      if (data && !profileData) {
+        profileData = data;
+        clearTimeout(profileTimeout);
+        profileResolve(profileData);
+      }
+    },
+    () => profilePromise,
+  ];
+})();

libs/blocks/marketo/marketo.js

@@ -13,7 +13,7 @@
 /*
  * Marketo Form
  */
-import { parseEncodedConfig, loadScript, createTag, createIntersectionObserver } from '../../utils/utils.js';
+import { parseEncodedConfig, loadScript, localizeLink, createTag, createIntersectionObserver } from '../../utils/utils.js';
 
 const ROOT_MARGIN = 1000;
 const FORM_ID = 'form id';
@@ -48,7 +48,10 @@ export const decorateURL = (destination, baseURL = window.location) => {
       destinationUrl.pathname = `${pathname}.html`;
     }
 
-    return destinationUrl;
+    const localized = localizeLink(destinationUrl.href, null, true);
+    destinationUrl.pathname = new URL(localized, baseURL.origin).pathname;
+
+    return destinationUrl.href;
   } catch (e) {
     window.lana?.log(`Error with Marketo destination URL: ${destination} ${e.message}`);
   }
@@ -95,7 +98,7 @@ const readyForm = (form) => {
 };
 
 const setPreference = (key, value) => {
-  if (key && key.includes('.')) {
+  if (value && key?.includes('.')) {
     const keyParts = key.split('.');
     const lastKey = keyParts.pop();
     const formDataObject = keyParts.reduce((obj, part) => {
@@ -168,7 +171,7 @@ export default function init(el) {
 
     if (destinationUrl) {
       formData['form.success.type'] = 'redirect';
-      formData['form.success.content'] = destinationUrl.href;
+      formData['form.success.content'] = destinationUrl;
     }
   }
 

libs/blocks/mobile-app-banner/README.md

@@ -0,0 +1,7 @@
+# Mobile App Banner
+
+## Performance Impact
+This block has a known issue of CLS and can add anywhere from 0.03 to 0.07 CLS (the CWV metric for CLS starts failing at 0.1).
+Please make an informed decision based on the business requirements and current CLS on your page when using this block.
+
+This CLS impact can be mitigated if branch banner is configured to load at the bottom of the page in branch dashboard.

libs/blocks/ost/ost.js

@@ -25,6 +25,20 @@ export const WCS_LANDSCAPE = 'PUBLISHED';
  */
 const METADATA_MAPPINGS = { 'checkout-workflow': 'workflow' };
 
+const priceDefaultOptions = {
+  term: true,
+  seat: true,
+  tax: false,
+  old: false,
+  exclusive: false,
+};
+
+const updateParams = (params, key, value) => {
+  if (value !== priceDefaultOptions[key]) {
+    params.set(key, value);
+  }
+};
+
 document.body.classList.add('tool', 'tool-ost');
 
 /**
@@ -65,11 +79,11 @@ export const createLinkMarkup = (
         displayOldPrice,
         forceTaxExclusive,
       } = options;
-      params.set('term', displayRecurrence);
-      params.set('seat', displayPerUnit);
-      params.set('tax', displayTax);
-      params.set('old', displayOldPrice);
-      params.set('exclusive', forceTaxExclusive);
+      updateParams(params, 'term', displayRecurrence);
+      updateParams(params, 'seat', displayPerUnit);
+      updateParams(params, 'tax', displayTax);
+      updateParams(params, 'old', displayOldPrice);
+      updateParams(params, 'exclusive', forceTaxExclusive);
     }
     return `https://milo.adobe.com/tools/ost?${params.toString()}`;
   };

libs/blocks/review/review.js

@@ -4,7 +4,10 @@ import { getMetadata, loadStyle, getConfig } from '../../utils/utils.js';
 import HelixReview from './components/helixReview/HelixReview.js';
 import { checkPostUrl } from './utils/utils.js';
 
-const COMMENT_THRESHOLD = 3;
+const getCommentThreshold = (defaultThreshold = 3) => {
+  const threshold = parseInt(getMetadata('comment-threshold'), 10);
+  return (Number.isInteger(threshold) && threshold > 0) ? threshold : defaultThreshold;
+};
 
 const getReviewPath = (url) => {
   try {
@@ -44,7 +47,7 @@ const getProductJson = () => {
 const App = ({ strings }) => html`
     <${HelixReview}
       clickTimeout="5000"
-      commentThreshold=${COMMENT_THRESHOLD}
+      commentThreshold=${getCommentThreshold()}
       hideTitleOnReload=${strings.hideTitleOnReload}
       lang=${getPageLocale()}
       reviewTitle=${strings.reviewTitle}

libs/blocks/table/table.css

@@ -160,11 +160,7 @@
 }
 
 .table.header-left .row-heading .col.col-heading .buttons-wrapper > * {
-  margin-left: 0;
-}
-
-[dir='rtl'] .table.header-left .row-heading .col.col-heading .buttons-wrapper > * {
-  margin-right: 0;
+  margin-inline-start: 0;
 }
 
 .table .row-heading .col-heading.top-left-rounded {

libs/features/personalization/entitlements.js

@@ -17,6 +17,11 @@ const ENTITLEMENT_MAP = {
   '015c52cb-30b0-4ac9-b02e-f8716b39bfb6': 'not-q-always-on-promo',
   '42e06851-64cd-4684-a54a-13777403487a': '3d-substance-collection',
   'eda8c774-420b-44c2-9006-f9a8d0fb5168': '3d-substance-texturing',
+  // PEP segments
+  '6cb0d58c-3a65-47e2-b459-c52bb158d5b6': 'lightroom-web-usage',
+  'caa3de84-6336-4fa8-8db2-240fc88106cc': 'photoshop-web-usage',
+  '5c6a4bb8-a2f3-4202-8cca-f5e918b969dc': 'firefly-web-usage',
+  '3df0b0b0-d06e-4fcc-986e-cc97f54d04d8': 'acrobat-web-usage',
 };
 
 export const getEntitlementMap = async () => {

libs/features/personalization/stage-entitlements.js

@@ -9,6 +9,11 @@ const STAGE_ENTITLEMENTS = {
   '569f0f9d-83e8-45b4-adbf-07ef08a83398': 'any-cc-product-with-stock',
   '47e204a3-220a-4e53-a95e-94b6eded0d26': '3d-substance-collection',
   '4ec7b469-42c9-4367-a7da-39f11a32d880': '3d-substance-texturing',
+  // PEP segments
+  '9202b767-77dc-4e6e-8d74-488d9ef08900': 'lightroom-web-usage',
+  '3a7ffcce-11b8-4242-8cdf-8c8d059ae1cd': 'photoshop-web-usage',
+  'cbe1d7ab-db7d-49cb-969e-a6a2bbe8c660': 'firefly-web-usage',
+  '96adf81f-97ca-4943-81ff-c41fbe8f3af7': 'acrobat-web-usage',
 };
 
 export default STAGE_ENTITLEMENTS;