Skip to content

Commit 02a2fc2

Browse files
committed
fix: formatting tweaks
1 parent e071a48 commit 02a2fc2

File tree

1 file changed

+36
-23
lines changed

1 file changed

+36
-23
lines changed

src/routes/content/helix-commerce.js

+36-23
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,13 @@ import StorageClient from '../catalog/StorageClient.js';
1414
import { errorResponse } from '../../utils/http.js';
1515
import { pruneUndefined } from '../../utils/product.js';
1616

17+
/**
18+
* @param {string} str
19+
* @param {number} spaces
20+
* @returns {string}
21+
*/
22+
const indent = (str, spaces) => str.split('\n').map((line) => `${' '.repeat(spaces)}${line}`).join('\n');
23+
1724
/**
1825
* @param {ProductBusVariant} variant
1926
*/
@@ -68,7 +75,7 @@ const jsonldTemplate = (product) => JSON.stringify({
6875
* @returns {string}
6976
*/
7077
const metaName = (name, value) => (value !== undefined ? `\
71-
<meta name="${name}" content="${Array.isArray(value) ? value.join(',') : value}">
78+
<meta name="${name}" content="${Array.isArray(value) ? value.join(',') : value}">
7279
` : '');
7380

7481
/**
@@ -78,21 +85,20 @@ const metaName = (name, value) => (value !== undefined ? `\
7885
* @returns {string}
7986
*/
8087
const metaProperty = (property, value) => (value !== undefined ? `\
81-
<meta property="${property}" content="${Array.isArray(value) ? value.join(',') : value}">
88+
<meta property="${property}" content="${Array.isArray(value) ? value.join(',') : value}">
8289
` : '');
8390

8491
/**
8592
* @param {ProductBusImage} image
8693
* @returns {string}
8794
*/
8895
const pictureTemplate = (image) => /* html */`\
89-
<picture>
90-
<source type="image/webp" srcset="${image.url}" alt="" media="(min-width: 600px)">
91-
<source type="image/webp" srcset="${image.url}">
92-
<source type="image/png" srcset="${image.url}" media="(min-width: 600px)">
93-
<img loading="lazy" alt="${image.label}" src="${image.url}">
94-
</picture>
95-
`;
96+
<picture>
97+
<source type="image/webp" srcset="${image.url}" alt="" media="(min-width: 600px)">
98+
<source type="image/webp" srcset="${image.url}">
99+
<source type="image/png" srcset="${image.url}" media="(min-width: 600px)">
100+
<img loading="lazy" alt="${image.label}" src="${image.url}">
101+
</picture>`;
96102

97103
/**
98104
* @param {ProductBusEntry} product
@@ -105,26 +111,33 @@ const htmlTemplate = (product) => /* html */`\
105111
<meta charset="UTF-8">
106112
<title>${product.metaTitle}</title>
107113
<meta name="viewport" content="width=device-width, initial-scale=1">
108-
${metaName('description', product.metaDescription)}
109-
${metaName('sku', product.sku)}
110-
${metaProperty('og:title', product.metaTitle)}
111-
${metaProperty('og:description', product.metaDescription)}
112-
${metaProperty('og:image', product.images?.[0]?.url)}
113-
${metaProperty('og:type', 'product')}
114-
${metaProperty('product:availability', product.availability)}
115-
${metaProperty('product:price.amount', product.price?.final)}
116-
${metaProperty('product:price.regular', product.price?.regular)}
117-
${metaProperty('product:price.currency', product.price?.currency)}
114+
${metaName('description', product.metaDescription)}\
115+
${metaName('sku', product.sku)}\
116+
${metaName('image', product.images?.[0]?.url)}\
117+
${metaProperty('og:image', product.images?.[0]?.url)}\
118+
${metaProperty('og:title', product.metaTitle)}\
119+
${metaProperty('og:description', product.metaDescription)}\
120+
${metaProperty('og:type', 'product')}\
121+
${metaProperty('product:availability', product.availability)}\
122+
${metaProperty('product:price', product.price?.final)}\
123+
${metaProperty('product:price.regular', product.price?.regular)}\
124+
${metaProperty('product:price.currency', product.price?.currency)}\
118125
<script type="application/ld+json">
119-
${product.jsonld ? product.jsonld : jsonldTemplate(product)}
126+
${product.jsonld ? product.jsonld : jsonldTemplate(product)}
120127
</script>
121128
</head>
122129
<body>
130+
<header></header>
123131
<main>
124-
<h1>${product.title}</h1>
125-
<p>${product.description}</p>
126-
${product.images?.map(pictureTemplate).join('\n')}
132+
<div>
133+
<h1>${product.title}</h1>
134+
<p>${product.description}</p>
135+
<p>
136+
${indent(product.images?.map(pictureTemplate).join('\n'), 10)}
137+
</p>
138+
</div>
127139
</main>
140+
<footer></footer>
128141
</body>
129142
</html>`;
130143

0 commit comments

Comments
 (0)