Skip to content

Commit

Permalink
Merge branch 'stage' into MWPW-154335
Browse files Browse the repository at this point in the history
* stage:
  MWPW-154998 [MEP][MILO] Manifests do not execute in the right order when there is a disabled manifest (adobecom#2632)
  mwpw-154965: Fetch federal stage content from hlx.page instead of stage.adobe.com (adobecom#2618)
  Correct error messages for duplicate files on the stage to main workflow (adobecom#2621)
  MWPW-153245 [merch][analytics] dispatch wcomp events, and let default lh (adobecom#2610)
  Revert "MWPW-146528[MILO][MEP][ANALYTICS] Add attribute to content changed by Target for analytics and MWPW-152274" (adobecom#2627)
  MWPW-128600 Locale Tool: Langstore points to langstore/en (adobecom#2615)
  Fix for errors in dynamically loaded scripts in test cases (adobecom#2619)
  MWPW-146528[MILO][MEP][ANALYTICS] Add attribute to content changed by Target for analytics and MWPW-152274 (adobecom#2593)
  Bootstrapper script for milo feds blocks (adobecom#2560)
  Revert "[MWPW-152968] mWeb - Passing ECID to Branch.io banner - Implementation" (adobecom#2612)
  MWPW-146743 Improve Article Header Performance (adobecom#2577)
  MWPW-153808: fix duplicate tax label (adobecom#2614)
  MWPW-154026: Long CTAs fall in the second line in merch card footer (adobecom#2565)
  Revert "[MWPW-154795] Style Feds Global-footer region picker drop-up variant (without hash)" (adobecom#2611)
  [AUTOMATED-PR] Update imslib.min.js dependency (adobecom#2605)
  [MWPW-154795] Style Feds Global-footer region picker drop-up variant (without hash) (adobecom#2599)
  MWPW-143053 [MEP] Request for New Personalization Tag - CC Paid (adobecom#2604)
  [MWPW-152674] [Gray Box] Desktop gnav not hidden when device view is open (adobecom#2597)
  MWPW-150566 - 🆕 Editorial-Card block (adobecom#2533)

# Conflicts:
#	libs/deps/merch-card.js
  • Loading branch information
Rohit Sahu committed Jul 26, 2024
2 parents f396e69 + add9745 commit c0f9fa7
Show file tree
Hide file tree
Showing 42 changed files with 1,099 additions and 685 deletions.
5 changes: 3 additions & 2 deletions .github/workflows/merge-to-stage.js
Original file line number Diff line number Diff line change
Expand Up @@ -130,9 +130,10 @@ const merge = async ({ prs, type }) => {

for await (const { number, files, html_url, title } of prs) {
try {
if (files.some((file) => SEEN[file])) {
const fileOverlap = files.find((file) => SEEN[file]);
if (fileOverlap) {
commentOnPR(
`Skipped ${number}: ${title} due to file "${file}" overlap. Merging will be attempted in the next batch`,
`Skipped ${number}: "${title}" due to file "${fileOverlap}" overlap. Merging will be attempted in the next batch`,
number
);
continue;
Expand Down
108 changes: 72 additions & 36 deletions libs/blocks/article-header/article-header.js
Original file line number Diff line number Diff line change
@@ -1,16 +1,15 @@
import { createTag, getMetadata, getConfig } from '../../utils/utils.js';
import { copyToClipboard } from '../../utils/tools.js';
import { loadTaxonomy, getLinkForTopic, getTaxonomyModule } from '../article-feed/article-helpers.js';
import { replaceKey } from '../../features/placeholders.js';
import { fetchIcons } from '../../features/icons/icons.js';
import { buildFigure } from '../figure/figure.js';

let copyText = 'Copied to clipboard';

async function validateAuthorUrl(url) {
if (!url) return null;

const resp = await fetch(`${url.toLowerCase()}.plain.html`);
if (!resp?.ok) {
console.log(`Could not retrieve metadata for ${url}`);
/* c8 ignore next 3 */
window.lana?.log(`Could not retrieve metadata for ${url}`, { tags: 'errorType=warn,module=article-header' });
return null;
}

Expand All @@ -34,7 +33,6 @@ function openPopup(e) {

async function buildAuthorInfo(authorEl, bylineContainer) {
const { href, textContent } = authorEl;

const config = getConfig();
const base = config.miloLibs || config.codeRoot;
const authorImg = createTag('div', { class: 'article-author-image' });
Expand All @@ -57,6 +55,7 @@ async function buildAuthorInfo(authorEl, bylineContainer) {
authorImg.style.backgroundImage = 'none';
});
img.addEventListener('error', () => {
/* c8 ignore next 1 */
img.remove();
});
} else {
Expand All @@ -65,33 +64,63 @@ async function buildAuthorInfo(authorEl, bylineContainer) {
}
}

async function copyToClipboard(button, copyTxt) {
try {
await navigator.clipboard.writeText(window.location.href);
button.setAttribute('title', copyTxt);
button.setAttribute('aria-label', copyTxt);

const tooltip = createTag('div', { role: 'status', 'aria-live': 'polite', class: 'copied-to-clipboard' }, copyTxt);
button.append(tooltip);

setTimeout(() => {
/* c8 ignore next 1 */
tooltip.remove();
}, 3000);
button.classList.remove('copy-failure');
button.classList.add('copy-success');
} catch (e) {
button.classList.add('copy-failure');
button.classList.remove('copy-success');
}
}

async function updateShareText(shareBlock) {
const { replaceKey } = await import('../../features/placeholders.js');
const config = getConfig();
const labels = [
`${await replaceKey('share-twitter', config)}`,
`${await replaceKey('share-linkedin', config)}`,
`${await replaceKey('share-facebook', config)}`,
`${await replaceKey('copy-to-clipboard', config)}`,
];
const shareLinks = shareBlock.querySelectorAll('a');
[...shareLinks].forEach((el, index) => el.setAttribute('aria-label', labels[index]));
copyText = await replaceKey('copied-to-clipboard', config);
}

async function buildSharing() {
const url = encodeURIComponent(window.location.href);
const title = encodeURIComponent(document.querySelector('h1').textContent);
const description = encodeURIComponent(getMetadata('description'));

const platformMap = {
twitter: {
'data-href': `https://www.twitter.com/share?&url=${url}&text=${title}`,
alt: `${await replaceKey('share-twitter', getConfig())}`,
'aria-label': `${await replaceKey('share-twitter', getConfig())}`,
'aria-label': 'share twitter',
},
linkedin: {
'data-type': 'LinkedIn',
'data-href': `https://www.linkedin.com/shareArticle?mini=true&url=${url}&title=${title}&summary=${description || ''}`,
alt: `${await replaceKey('share-linkedin', getConfig())}`,
'aria-label': `${await replaceKey('share-linkedin', getConfig())}`,
'aria-label': 'share linkedin',
},
facebook: {
'data-type': 'Facebook',
'data-href': `https://www.facebook.com/sharer/sharer.php?u=${url}`,
alt: `${await replaceKey('share-facebook', getConfig())}`,
'aria-label': `${await replaceKey('share-facebook', getConfig())}`,
'aria-label': 'share facebook',
},
link: {
id: 'copy-to-clipboard',
alt: `${await replaceKey('copy-to-clipboard', getConfig())}`,
'aria-label': `${await replaceKey('copy-to-clipboard', getConfig())}`,
'aria-label': 'copy to clipboard',
},
};

Expand All @@ -115,37 +144,46 @@ async function buildSharing() {
link.addEventListener('click', openPopup);
});
const copyButton = sharing.querySelector('#copy-to-clipboard');
copyButton.addEventListener('click', async () => {
const copyText = await replaceKey('copied-to-clipboard', getConfig());
await copyToClipboard(copyButton, copyText);
});
copyButton.addEventListener('click', () => copyToClipboard(copyButton, copyText));

return sharing;
}

async function validateDate(date) {
function validateDate(date) {
const { env } = getConfig();
if (env?.name === 'prod') return;
if (date && !/^[0-1]\d{1}-[0-3]\d{1}-[2]\d{3}$/.test(date.textContent.trim())) {
// match publication date to MM-DD-YYYY format
date.classList.add('article-date-invalid');
date.setAttribute('title', await replaceKey('invalid-date', getConfig()));
date.setAttribute('title', 'Invalid Date Format: Must be MM-DD-YYYY');
}
}

export default async function init(blockEl) {
if (!getTaxonomyModule()) {
await loadTaxonomy();
function decorateFigure(el) {
el.classList.add('article-feature-image');
const picture = el.querySelector('picture');
const caption = el.querySelector('em');
const figure = document.createElement('figure');

if (caption) {
caption.classList.add('caption');
const figcaption = document.createElement('figcaption');
figcaption.append(caption);
figure.append(figcaption);
}

const childrenEls = Array.from(blockEl.children);
if (childrenEls.length < 4) {
console.warn('Block does not have enough children');
}
figure.classList.add('figure-feature');
figure.prepend(picture);
el.prepend(figure);
el.lastElementChild.remove();
}

export default async function init(blockEl) {
const childrenEls = Array.from(blockEl.children);
const categoryContainer = childrenEls[0];
const categoryEl = categoryContainer.firstElementChild.firstElementChild;
if (categoryEl?.textContent) {
const { getTaxonomyModule, loadTaxonomy, getLinkForTopic } = await import('../article-feed/article-helpers.js');
if (!getTaxonomyModule()) await loadTaxonomy();
const categoryTag = getLinkForTopic(categoryEl.textContent);
categoryEl.innerHTML = categoryTag;
}
Expand All @@ -162,19 +200,17 @@ export default async function init(blockEl) {
const authorEl = authorContainer.querySelector('a');
authorContainer.classList.add('article-author');

await buildAuthorInfo(authorEl, bylineContainer);
buildAuthorInfo(authorEl, bylineContainer);

const date = bylineContainer.querySelector('.article-byline-info > p:last-child');
date.classList.add('article-date');
await validateDate(date);
validateDate(date);

const shareBlock = await buildSharing();
bylineContainer.append(shareBlock);

const featureImgContainer = childrenEls[3];
featureImgContainer.classList.add('article-feature-image');
const featureFigEl = buildFigure(featureImgContainer.firstElementChild);
featureFigEl.classList.add('figure-feature');
featureImgContainer.prepend(featureFigEl);
featureImgContainer.lastElementChild.remove();
decorateFigure(featureImgContainer);

document.addEventListener('milo:deferred', () => updateShareText(shareBlock));
}
Loading

0 comments on commit c0f9fa7

Please sign in to comment.