Skip to content

Commit

Permalink
[Release] Stage to Main (#2472)
Browse files Browse the repository at this point in the history
  • Loading branch information
milo-pr-merge[bot] authored Jun 17, 2024
2 parents 931fa67 + 0cdd84a commit ead382f
Show file tree
Hide file tree
Showing 15 changed files with 193 additions and 56 deletions.
19 changes: 18 additions & 1 deletion libs/blocks/library-config/library-config.css
Original file line number Diff line number Diff line change
Expand Up @@ -277,7 +277,8 @@ input.sk-library-search-input:focus {
padding: 0 24px;
}

.sk-library li.placeholder {
.sk-library li.placeholder,
.sk-library li.template {
padding: 0 12px;
}

Expand All @@ -287,6 +288,22 @@ input.sk-library-search-input:focus {
padding: 0 12px;
}

.sk-library li.template {
display: flex;
align-items: stretch;
justify-content: end;
}

.sk-library li.template .item-title {
flex: 1 1 100%;
}

.sk-library li.template button {
position: static;
height: unset;
width: 44px;
}

.in-page {
display: flex;
justify-content: center;
Expand Down
13 changes: 13 additions & 0 deletions libs/blocks/library-config/library-config.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,11 @@ async function loadBlocks(content, list, query) {
blocks(content, list, query);
}

async function loadTemplates(content, list) {
const { default: templates } = await import('./lists/templates.js');
templates(content, list);
}

async function loadPlaceholders(content, list) {
const { default: placeholders } = await import('./lists/placeholders.js');
placeholders(content, list);
Expand Down Expand Up @@ -65,6 +70,9 @@ async function loadList(type, content, list) {
addSearch(content, list);
loadBlocks(content, list, query);
break;
case 'templates':
loadTemplates(content, list);
break;
case 'placeholders':
loadPlaceholders(content, list);
break;
Expand Down Expand Up @@ -122,6 +130,7 @@ async function combineLibraries(base, supplied) {
const library = {
assets: await fetchAssetsData(assetsPath),
blocks: base.blocks.data,
templates: base.templates?.data,
icons: base.icons?.data,
personalization_tags: base.personalization?.data,
placeholders: base.placeholders?.data,
Expand All @@ -135,6 +144,10 @@ async function combineLibraries(base, supplied) {
if (supplied.placeholders.data.length > 0) {
library.placeholders = supplied.placeholders.data;
}

if (supplied.templates?.data.length > 0) {
library.templates.push(...supplied.templates.data);
}
}

return library;
Expand Down
9 changes: 6 additions & 3 deletions libs/blocks/library-config/lists/blocks.js
Original file line number Diff line number Diff line change
Expand Up @@ -43,20 +43,22 @@ function getContainerName(container) {
return getAuthorName(container) || getBlockName(firstBlock);
}

function getTable(block) {
export function getTable(block, returnDom = false) {
const name = getBlockName(block);
const rows = [...block.children];
const maxCols = rows.reduce((cols, row) => (
row.children.length > cols ? row.children.length : cols), 0);
const table = document.createElement('table');
table.setAttribute('border', 1);
table.setAttribute('style', 'width: 100%');
const headerRow = document.createElement('tr');
headerRow.append(createTag('th', { colspan: maxCols }, name));
table.append(headerRow);
rows.forEach((row) => {
const tr = document.createElement('tr');
[...row.children].forEach((col) => {
const td = document.createElement('td');
td.setAttribute('style', `width: ${100 / row.children.length}%`);
if (row.children.length < maxCols) {
td.setAttribute('colspan', maxCols);
}
Expand All @@ -65,10 +67,11 @@ function getTable(block) {
});
table.append(tr);
});
if (returnDom) return table;
return table.outerHTML;
}

function handleLinks(element, path) {
export function handleLinks(element, path) {
if (!element || !path) return;
try {
const url = new URL(path);
Expand All @@ -83,7 +86,7 @@ function handleLinks(element, path) {
}
}

function decorateImages(element, path) {
export function decorateImages(element, path) {
if (!element || !path) return;
try {
const url = new URL(path);
Expand Down
76 changes: 76 additions & 0 deletions libs/blocks/library-config/lists/templates.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
import { createTag } from '../../../utils/utils.js';
import createCopy from '../library-utils.js';
import { getTable, decorateImages, handleLinks } from './blocks.js';

function createSpace() {
const br = createTag('br');
return createTag('p', null, br);
}

function formatDom(aemDom, path) {
// Decorate Links
handleLinks(aemDom, path);

// Decorate Images
decorateImages(aemDom, path);

// Decorate Blocks
const divs = aemDom.querySelectorAll('main > div > div');
divs.forEach((div) => {
// Give table some space
div.insertAdjacentElement('afterend', createSpace());

const table = getTable(div, true);
div.parentElement.replaceChild(table, div);
});

// Decorate Sections
const sections = aemDom.body.querySelectorAll('main > div');
const formattedSections = [...sections].map((section, idx) => {
const fragment = new DocumentFragment();
if (idx > 0) {
const divider = createTag('p', null, '---');
fragment.append(divider, createSpace());
}
fragment.append(...section.querySelectorAll(':scope > *'));

return fragment;
});
const flattedDom = createTag('div');
flattedDom.append(...formattedSections);
return flattedDom;
}

async function formatTemplate(path) {
const resp = await fetch(path);
if (!resp.ok) window.lana.log('Could not fetch template path', { tags: 'errorType=info,module=sidekick-templates' });

const html = await resp.text();
const dom = new DOMParser().parseFromString(html, 'text/html');
return formatDom(dom, path);
}

export default async function loadTemplates(templates, list) {
templates.forEach(async (template) => {
const titleText = createTag('p', { class: 'item-title' }, template.name);
const title = createTag('li', { class: 'template' }, titleText);
const previewButton = createTag('button', { class: 'preview-group' }, 'Preview');
const copy = createTag('button', { class: 'copy' });
const formatted = await formatTemplate(template.path);

list.append(title);
title.append(previewButton, copy);

previewButton.addEventListener('click', (e) => {
e.stopPropagation();
window.open(template.path, '_templatepreview');
});

copy.addEventListener('click', (e) => {
e.target.classList.add('copied');
setTimeout(() => { e.target.classList.remove('copied'); }, 3000);
const blob = new Blob([formatted.outerHTML], { type: 'text/html' });
createCopy(blob);
});
});
}
8 changes: 8 additions & 0 deletions libs/blocks/locui/locui.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
.locui.container {
margin: 0 auto;
margin-top: 10vh;
max-width: 700px;
border-radius: 10px;
border: 10px solid #eee;
padding: 10px 30px 30px;
}
16 changes: 16 additions & 0 deletions libs/blocks/locui/locui.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { createTag } from '../../utils/utils.js';

export default function init(el) {
el.classList.add('container');
const heading = createTag('h2', null, 'Missing project details');
const paragraph = createTag('p', null, 'The project details were removed after you logged in. To resolve this:');
const steps = createTag('ol', null);
const stepList = ['Close this window or tab.', 'Open your project Excel file.', 'Click "Localize..." in Sidekick again.'];
stepList.forEach((step) => steps.append(createTag('li', null, step)));
const learnmore = createTag('a', {
class: 'con-button',
href: 'https://milo.adobe.com/docs/authoring/localization#:~:text=at%20render%20time.-,Troubleshooting,-Error%20matrix',
target: '_blank',
}, 'Learn More');
el.append(heading, paragraph, steps, learnmore);
}
68 changes: 34 additions & 34 deletions libs/features/personalization/personalization.js
Original file line number Diff line number Diff line change
Expand Up @@ -495,10 +495,10 @@ const getVariantInfo = (line, variantNames, variants, manifestId) => {
});
};

export function parseConfig(data, manifestId) {
export function parseManifestVariants(data, manifestId) {
if (!data?.length) return null;

const config = {};
const manifestConfig = {};
const experiences = data.map((d) => normalizeKeys(d));

try {
Expand All @@ -512,12 +512,12 @@ export function parseConfig(data, manifestId) {

experiences.forEach((line) => getVariantInfo(line, variantNames, variants, manifestId));

config.variants = variants;
config.variantNames = variantNames;
return config;
manifestConfig.variants = variants;
manifestConfig.variantNames = variantNames;
return manifestConfig;
} catch (e) {
/* c8 ignore next 3 */
console.log('error parsing personalization config:', e, experiences);
console.log('error parsing personalization manifestConfig:', e, experiences);
}
return null;
}
Expand Down Expand Up @@ -612,7 +612,7 @@ const createDefaultExperiment = (manifest) => ({
variants: {},
});

export async function getPersConfig(info, variantOverride = false) {
export async function getManifestConfig(info, variantOverride = false) {
const {
name,
manifestData,
Expand All @@ -637,17 +637,17 @@ export async function getPersConfig(info, variantOverride = false) {
if (!persData) return null;

let manifestId = getFileName(manifestPath);
const globalConfig = getConfig();
if (!globalConfig.mep?.preview) {
const config = getConfig();
if (!config.mep?.preview) {
manifestId = false;
} else if (name) {
manifestId = `${name}: ${manifestId}`;
}
const config = parseConfig(persData, manifestId);
const manifestConfig = parseManifestVariants(persData, manifestId);

if (!config) {
if (!manifestConfig) {
/* c8 ignore next 3 */
console.log('Error loading personalization config: ', name || manifestPath);
console.log('Error loading personalization manifestConfig: ', name || manifestPath);
return null;
}

Expand All @@ -661,8 +661,8 @@ export async function getPersConfig(info, variantOverride = false) {
acc[item.key] = item.value;
return acc;
}, {});
config.manifestOverrideName = infoObj?.['manifest-override-name']?.toLowerCase();
config.manifestType = infoObj?.['manifest-type']?.toLowerCase();
manifestConfig.manifestOverrideName = infoObj?.['manifest-override-name']?.toLowerCase();
manifestConfig.manifestType = infoObj?.['manifest-type']?.toLowerCase();
const executionOrder = {
'manifest-type': 1,
'manifest-execution-order': 1,
Expand All @@ -672,43 +672,43 @@ export async function getPersConfig(info, variantOverride = false) {
const index = infoKeyMap[key].indexOf(infoObj[key]);
executionOrder[key] = index > -1 ? index : 1;
});
config.executionOrder = `${executionOrder['manifest-execution-order']}-${executionOrder['manifest-type']}`;
manifestConfig.executionOrder = `${executionOrder['manifest-execution-order']}-${executionOrder['manifest-type']}`;
} else {
// eslint-disable-next-line prefer-destructuring
config.manifestType = infoKeyMap['manifest-type'][1];
config.executionOrder = '1-1';
manifestConfig.manifestType = infoKeyMap['manifest-type'][1];
manifestConfig.executionOrder = '1-1';
}

config.manifestPath = normalizePath(manifestPath);
manifestConfig.manifestPath = normalizePath(manifestPath);
const selectedVariantName = await getPersonalizationVariant(
config.manifestPath,
config.variantNames,
manifestConfig.manifestPath,
manifestConfig.variantNames,
variantLabel,
);

if (selectedVariantName && config.variantNames.includes(selectedVariantName)) {
config.run = true;
config.selectedVariantName = selectedVariantName;
config.selectedVariant = config.variants[selectedVariantName];
if (selectedVariantName && manifestConfig.variantNames.includes(selectedVariantName)) {
manifestConfig.run = true;
manifestConfig.selectedVariantName = selectedVariantName;
manifestConfig.selectedVariant = manifestConfig.variants[selectedVariantName];
} else {
/* c8 ignore next 2 */
config.selectedVariantName = 'default';
config.selectedVariant = 'default';
manifestConfig.selectedVariantName = 'default';
manifestConfig.selectedVariant = 'default';
}

const placeholders = manifestPlaceholders || data?.placeholders?.data;
if (placeholders) {
updateConfig(
parsePlaceholders(placeholders, getConfig(), config.selectedVariantName),
parsePlaceholders(placeholders, getConfig(), manifestConfig.selectedVariantName),
);
}

config.name = name;
config.manifest = manifestPath;
config.manifestUrl = manifestUrl;
config.disabled = disabled;
config.event = event;
return config;
manifestConfig.name = name;
manifestConfig.manifest = manifestPath;
manifestConfig.manifestUrl = manifestUrl;
manifestConfig.disabled = disabled;
manifestConfig.event = event;
return manifestConfig;
}

export const deleteMarkedEls = (rootEl = document) => {
Expand Down Expand Up @@ -838,7 +838,7 @@ export async function applyPers(manifests, postLCP = false) {
if (!manifests?.length) return;
let experiments = manifests;
for (let i = 0; i < experiments.length; i += 1) {
experiments[i] = await getPersConfig(experiments[i], config.mep?.variantOverride);
experiments[i] = await getManifestConfig(experiments[i], config.mep?.variantOverride);
}

experiments = cleanAndSortManifestList(experiments);
Expand Down
2 changes: 2 additions & 0 deletions libs/scripts/scripts.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import {
loadArea,
loadLana,
setConfig,
getMetadata,
} from '../utils/utils.js';

// Production Domain
Expand Down Expand Up @@ -161,6 +162,7 @@ const eagerLoad = (img) => {
}());

(async function loadPage() {
if (getMetadata('template') === '404') window.SAMPLE_PAGEVIEWS_AT_RATE = 'high';
performance.mark('loadpage');
setConfig(config);
loadLana({ clientId: 'milo' });
Expand Down
Loading

0 comments on commit ead382f

Please sign in to comment.