diff --git a/aemedge/blocks/category/category.js b/aemedge/blocks/category/category.js index e6274e38..3fdb6a88 100644 --- a/aemedge/blocks/category/category.js +++ b/aemedge/blocks/category/category.js @@ -9,8 +9,6 @@ import { pathToTag, } from '../../scripts/utils.js'; -const LIMIT_100 = '100'; - // Create cardLarge images for 2 breakpoints export async function addCardImageLarge(row, style, eagerImage = true) { const cardImageDiv = createTag('div', { class: 'card-image' }); @@ -103,25 +101,23 @@ export default async function decorate(block) { lastSegmentOfURL = currentCategory; } - let limit = ''; - // check if whatson homepage and add limit what we pull from query index for better performance - if (window.location.pathname === '/whatson' || window.location.pathname === '/whatson/') { - limit = LIMIT_100; - } let blogsbypaths; - if (paths.length >= 1) blogsbypaths = await getBlogsByPaths(paths, limit); + if (paths.length >= 1) blogsbypaths = await getBlogsByPaths(paths); let blogs; let mergedBlogs; if (blogsbypaths && (blogsbypaths.length > 0 && blogsbypaths.length < 8)) { numberofblogs -= blogsbypaths.length; // Get blogs if (numberofblogs > 0) { - blogs = await getBlogs(categories.map((cat) => pathToTag(cat)), numberofblogs, limit); + blogs = await getBlogs(categories.map((cat) => pathToTag(cat)), numberofblogs); mergedBlogs = [...blogs, ...blogsbypaths]; + } else { + mergedBlogs = blogsbypaths; } } else { - mergedBlogs = await getBlogs(categories.map((cat) => pathToTag(cat)), numberofblogs, limit); + mergedBlogs = await getBlogs(categories.map((cat) => pathToTag(cat)), numberofblogs); } + mergedBlogs.forEach(async (blog, i) => { if (blog.image === '') return; let card; diff --git a/aemedge/scripts/utils.js b/aemedge/scripts/utils.js index 23d4c7d8..371a5b1c 100644 --- a/aemedge/scripts/utils.js +++ b/aemedge/scripts/utils.js @@ -200,7 +200,8 @@ export async function fetchData(path) { const json = await response.json(); return json.data.map((row) => { - if (row.image.startsWith('/default-meta-image.png')) { + const img = row.image; + if (typeof img === 'string' && img.startsWith('/default-meta-image.png')) { row.image = `/${window.hlx.codeBasePath}${row.image}`; } return row; @@ -223,29 +224,38 @@ function compareArrays(arr, arr2) { return arr.every((i) => arr2.includes(i)); } +/** + * Returns true if the entry has a renderable blog image. + * Excludes missing, empty, '0', and default-meta-image to avoid underfill or runtime errors. + * @param {Object} entry - Query-index row + * @returns {boolean} + */ +function hasValidBlogImage(entry) { + return typeof entry.image === 'string' + && entry.image !== '' + && entry.image !== '0' + && !entry.image.includes('default-meta-image.png'); +} + +const QUERY_INDEX_PATH = '/whatson/query-index.json'; + /** * Retrieves blogs matching specific tags * @param {Array} categories - An array of categories to filter by * @param {number} num - The number of blogs to retrieve - * @param {string} limit - The limit of blogs to retrieve from the query-index * @returns {Promise} - A promise resolving to the filtered blogs array */ -export async function getBlogs(categories, num, limit = '') { +export async function getBlogs(categories, num) { + const isBlogsHome = (window.location.pathname === '/whatson' || window.location.pathname === '/whatson/'); if (!window.allBlogs) { - window.allBlogs = await fetchData(`/whatson/query-index.json${limit ? `?limit=${limit}` : ''}`); + window.allBlogs = await fetchData(QUERY_INDEX_PATH); } - const isBlogsHome = (window.location.pathname === '/whatson' || window.location.pathname === '/whatson/'); const blogArticles = isBlogsHome ? window.allBlogs.filter( - (e) => (e.template === 'blog-article' - && e.image !== '' - && !e.image.startsWith('//aemedge/default-meta-image.png') - && (e.hideFromHome !== 'yes')), + (e) => (e.template === 'blog-article' && hasValidBlogImage(e) && (e.hideFromHome !== 'yes')), ) : window.allBlogs.filter( - (e) => (e.template === 'blog-article' - && e.image !== '' - && !e.image.startsWith('//aemedge/default-meta-image.png')), + (e) => (e.template === 'blog-article' && hasValidBlogImage(e)), ); if ((categories && categories.length > 0)) { @@ -265,12 +275,12 @@ export async function getBlogs(categories, num, limit = '') { return blogArticles; } -export async function getBlogsByPaths(paths, limit = '') { +export async function getBlogsByPaths(paths) { if (!window.allBlogs) { - window.allBlogs = await fetchData(`/whatson/query-index.json${limit ? `?limit=${limit}` : ''}`); + window.allBlogs = await fetchData(QUERY_INDEX_PATH); } const blogArticles = window.allBlogs.filter( - (e) => (e.template !== 'blog-category' && e.image !== '' && !e.image.startsWith('//aemedge/default-meta-image.png')), + (e) => (e.template !== 'blog-category' && hasValidBlogImage(e)), ); let filterArticles = []; if (paths && paths.length > 0) {