diff --git a/blocks/extra-large-manual-promo-block/features/extra-large-manual-promo/default.jsx b/blocks/extra-large-manual-promo-block/features/extra-large-manual-promo/default.jsx index 93cd49abd1..f668997989 100644 --- a/blocks/extra-large-manual-promo-block/features/extra-large-manual-promo/default.jsx +++ b/blocks/extra-large-manual-promo-block/features/extra-large-manual-promo/default.jsx @@ -5,9 +5,10 @@ import { useComponentContext, useFusionContext } from "fusion:context"; import { useContent, useEditableContent } from "fusion:content"; import getProperties from "fusion:properties"; import { - getFocalFromANS, Conditional, formatURL, + getFocalFromANS, + getManualImageID, Heading, HeadingSection, Image, @@ -48,13 +49,14 @@ const ExtraLargeManualPromo = ({ customFields }) => { const shouldLazyLoad = lazyLoad && !isAdmin; const resizedImage = imageId && imageAuth && imageAuth !== "{}" && imageURL?.includes(imageId); + const manualImageId = getManualImageID(imageURL, resizedImage); let resizedAuth = useContent( resizedImage || !imageURL ? {} : { source: "signing-service", - query: { id: imageURL }, + query: { id: manualImageId || imageURL }, } ); if (imageAuth && !resizedAuth) { @@ -69,7 +71,7 @@ const ExtraLargeManualPromo = ({ customFields }) => { } const ansImage = { - _id: resizedImage ? imageId : "", + _id: resizedImage ? imageId : manualImageId, url: imageURL, auth: resizedAuth, focal_point: imageFocalPoint ? JSON.parse(imageFocalPoint) : undefined diff --git a/blocks/extra-large-promo-block/features/extra-large-promo/default.jsx b/blocks/extra-large-promo-block/features/extra-large-promo/default.jsx index 6d115cc0a0..6a73997dfc 100644 --- a/blocks/extra-large-promo-block/features/extra-large-promo/default.jsx +++ b/blocks/extra-large-promo-block/features/extra-large-promo/default.jsx @@ -13,6 +13,7 @@ import { formatAuthors, getFocalFromANS, getImageFromANS, + getManualImageID, getVideoFromANS, Heading, HeadingSection, @@ -256,10 +257,11 @@ const ExtraLargePromo = ({ customFields }) => { imageOverrideAuth && imageOverrideAuth !== "{}" && imageOverrideURL?.includes(imageOverrideId); + const manualImageId = getManualImageID(imageOverrideURL, resizedImage); let resizedAuth = useContent( resizedImage || !imageOverrideURL ? {} - : { source: "signing-service", query: { id: imageOverrideURL } }, + : { source: "signing-service", query: { id: manualImageId || imageOverrideURL } }, ); if (imageOverrideAuth && !resizedAuth) { resizedAuth = JSON.parse(imageOverrideAuth); @@ -312,7 +314,7 @@ const ExtraLargePromo = ({ customFields }) => { ? { ansImage: imageOverrideURL ? { - _id: resizedImage ? imageOverrideId : "", + _id: resizedImage ? imageOverrideId : manualImageId, url: imageOverrideURL, auth: resizedAuth || {}, } diff --git a/blocks/hero-block/features/hero/default.jsx b/blocks/hero-block/features/hero/default.jsx index d8d89fcb8e..77646ff04a 100644 --- a/blocks/hero-block/features/hero/default.jsx +++ b/blocks/hero-block/features/hero/default.jsx @@ -9,6 +9,7 @@ import getProperties from "fusion:properties"; // https://github.com/WPMedia/arc-themes-components/ import { Button, + getManualImageID, Heading, HeadingSection, imageANSToImageSrc, @@ -45,11 +46,11 @@ function Hero({ customFields }) { const { searchableField } = useEditableContent(); const { fallbackImage, resizerURL } = getProperties(arcSite); const imageId = imageDesktopURL - ? imageDesktopURL.split("/").pop().split(".").shift() + ? getManualImageID(imageDesktopURL) : desktopImgId; const imageMobileId = imageMobileURL - ? imageMobileURL.split("/").pop().split(".").shift() + ? getManualImageID(imageMobileURL) : imgMobileId; let desktopAuth = useContent( !imageDesktopAuth && imageId diff --git a/blocks/large-manual-promo-block/features/large-manual-promo/default.jsx b/blocks/large-manual-promo-block/features/large-manual-promo/default.jsx index 7df721dc2d..3cd8ccd07b 100644 --- a/blocks/large-manual-promo-block/features/large-manual-promo/default.jsx +++ b/blocks/large-manual-promo-block/features/large-manual-promo/default.jsx @@ -5,14 +5,15 @@ import { useComponentContext, useFusionContext } from "fusion:context"; import { useContent, useEditableContent } from "fusion:content"; import getProperties from "fusion:properties"; import { - getFocalFromANS, Conditional, - Image, - isServerSide, formatURL, + getFocalFromANS, + getManualImageID, Grid, Heading, HeadingSection, + Image, + isServerSide, LazyLoad, Link, MediaItem, @@ -59,13 +60,13 @@ const LargeManualPromo = ({ customFields }) => { const shouldLazyLoad = lazyLoad && !isAdmin; const resizedImage = imageId && imageAuth && imageAuth !== "{}" && imageURL?.includes(imageId); - + const manualImageId = getManualImageID(imageURL, resizedImage); let resizedAuth = useContent( resizedImage || !imageURL ? {} : { source: "signing-service", - query: { id: imageURL }, + query: { id: manualImageId || imageURL }, } ); if (imageAuth && !resizedAuth) { @@ -79,7 +80,7 @@ const LargeManualPromo = ({ customFields }) => { return null; } const ansImage = { - _id: resizedImage ? imageId : "", + _id: resizedImage ? imageId : manualImageId, url: imageURL, auth: resizedAuth, focal_point: imageFocalPoint ? JSON.parse(imageFocalPoint) : undefined diff --git a/blocks/large-promo-block/features/large-promo/default.jsx b/blocks/large-promo-block/features/large-promo/default.jsx index 80f557a635..fd9add3df9 100644 --- a/blocks/large-promo-block/features/large-promo/default.jsx +++ b/blocks/large-promo-block/features/large-promo/default.jsx @@ -20,6 +20,7 @@ import { formatURL, getFocalFromANS, getImageFromANS, + getManualImageID, getVideoFromANS, isServerSide, Overline, @@ -266,11 +267,12 @@ const LargePromoItem = ({ customFields, arcSite }) => { imageOverrideAuth && imageOverrideAuth !== "{}" && imageOverrideURL?.includes(imageOverrideId); + const manualImageId = getManualImageID(imageOverrideURL, resizedImage); let resizedAuth = useContent( resizedImage || !imageOverrideURL ? {} - : { source: "signing-service", query: { id: imageOverrideURL } } + : { source: "signing-service", query: { id: manualImageId || imageOverrideURL } } ); if (imageOverrideAuth && !resizedAuth) { resizedAuth = JSON.parse(imageOverrideAuth); @@ -353,7 +355,7 @@ const LargePromoItem = ({ customFields, arcSite }) => { ? { ansImage: imageOverrideURL ? { - _id: resizedImage ? imageOverrideId : "", + _id: resizedImage ? imageOverrideId : manualImageId, url: imageOverrideURL, auth: resizedAuth || {}, } diff --git a/blocks/medium-manual-promo-block/features/medium-manual-promo/default.jsx b/blocks/medium-manual-promo-block/features/medium-manual-promo/default.jsx index 5f4150bada..f4c6d36e8a 100644 --- a/blocks/medium-manual-promo-block/features/medium-manual-promo/default.jsx +++ b/blocks/medium-manual-promo-block/features/medium-manual-promo/default.jsx @@ -5,9 +5,10 @@ import { useContent, useEditableContent } from "fusion:content"; import { useComponentContext, useFusionContext } from "fusion:context"; import getProperties from "fusion:properties"; import { - getFocalFromANS, Conditional, formatURL, + getFocalFromANS, + getManualImageID, Heading, HeadingSection, Image, @@ -43,13 +44,14 @@ const MediumManualPromo = ({ customFields }) => { const shouldLazyLoad = lazyLoad && !isAdmin; const resizedImage = imageId && imageAuth && imageAuth !== "{}" && imageURL?.includes(imageId); + const manualImageId = getManualImageID(imageURL, resizedImage); let resizedAuth = useContent( resizedImage || !imageURL ? {} : { source: "signing-service", - query: { id: imageURL }, + query: { id: manualImageId || imageURL }, } ); if (imageAuth && !resizedAuth) { @@ -64,7 +66,7 @@ const MediumManualPromo = ({ customFields }) => { } const ansImage = { - _id: resizedImage ? imageId : "", + _id: resizedImage ? imageId : manualImageId, url: imageURL, auth: resizedAuth, focal_point: imageFocalPoint ? JSON.parse(imageFocalPoint) : undefined diff --git a/blocks/medium-promo-block/features/medium-promo/default.jsx b/blocks/medium-promo-block/features/medium-promo/default.jsx index aef61ddd16..3b5b1d9537 100644 --- a/blocks/medium-promo-block/features/medium-promo/default.jsx +++ b/blocks/medium-promo-block/features/medium-promo/default.jsx @@ -13,6 +13,7 @@ import { formatURL, getFocalFromANS, getImageFromANS, + getManualImageID, getPromoType, Heading, HeadingSection, @@ -142,10 +143,11 @@ const MediumPromo = ({ customFields }) => { imageOverrideAuth && imageOverrideAuth !== "{}" && imageOverrideURL?.includes(imageOverrideId); + const manualImageId = getManualImageID(imageOverrideURL, resizedImage); let resizedAuth = useContent( resizedImage || !imageOverrideURL ? {} - : { source: "signing-service", query: { id: imageOverrideURL } } + : { source: "signing-service", query: { id: manualImageId || imageOverrideURL } } ); if (imageOverrideAuth && !resizedAuth) { resizedAuth = JSON.parse(imageOverrideAuth); @@ -185,7 +187,7 @@ const MediumPromo = ({ customFields }) => { ? { ansImage: imageOverrideURL ? { - _id: resizedImage ? imageOverrideId : "", + _id: resizedImage ? imageOverrideId : manualImageId, url: imageOverrideURL, auth: resizedAuth || {}, } diff --git a/blocks/results-list-block/features/results-list/results/result-item.jsx b/blocks/results-list-block/features/results-list/results/result-item.jsx index c6f5969184..f31d6ac608 100644 --- a/blocks/results-list-block/features/results-list/results/result-item.jsx +++ b/blocks/results-list-block/features/results-list/results/result-item.jsx @@ -1,5 +1,4 @@ import React from "react"; -import { useEditableContent } from "fusion:content"; import { useComponentContext } from "fusion:context"; import getProperties from "fusion:properties"; @@ -79,7 +78,6 @@ const ResultItem = React.memo( /* Author Formatting */ const ansImage = getImageFromANS(element) - const { searchableField } = useEditableContent(); const hasAuthors = showByline ? credits?.by?.some((author) => author?.name !== "") : null; const contentHeading = showHeadline ? headlineText : null; const formattedDate = Date.parse(displayDate) @@ -122,7 +120,7 @@ const ResultItem = React.memo( className={`${BLOCK_CLASS_NAME}${showImage ? ` ${BLOCK_CLASS_NAME}--show-image` : ""}`} > {showImage ? ( - + { const shouldLazyLoad = lazyLoad && !isAdmin; const resizedImage = imageId && imageAuth && imageAuth !== "{}" && imageURL?.includes(imageId); + const manualImageId = getManualImageID(imageURL, resizedImage); let resizedAuth = useContent( resizedImage || !imageURL ? {} : { source: "signing-service", - query: { id: imageURL }, + query: { id: manualImageId || imageURL }, } ); if (imageAuth && !resizedAuth) { @@ -118,7 +120,7 @@ const SmallManualPromo = ({ customFields }) => { } const ansImage = { - _id: resizedImage ? imageId : "", + _id: resizedImage ? imageId : manualImageId, url: imageURL, auth: resizedAuth, focal_point: imageFocalPoint ? JSON.parse(imageFocalPoint) : undefined diff --git a/blocks/small-promo-block/features/small-promo/default.jsx b/blocks/small-promo-block/features/small-promo/default.jsx index 92454c2277..d5b4ac3693 100644 --- a/blocks/small-promo-block/features/small-promo/default.jsx +++ b/blocks/small-promo-block/features/small-promo/default.jsx @@ -9,6 +9,7 @@ import { formatURL, getFocalFromANS, getImageFromANS, + getManualImageID, Grid, Heading, HeadingSection, @@ -106,10 +107,11 @@ const SmallPromo = ({ customFields }) => { imageOverrideAuth && imageOverrideAuth !== "{}" && imageOverrideURL?.includes(imageOverrideId); + const manualImageId = getManualImageID(imageOverrideURL, resizedImage); let resizedAuth = useContent( resizedImage || !imageOverrideURL ? {} - : { source: "signing-service", query: { id: imageOverrideURL } } + : { source: "signing-service", query: { id: manualImageId || imageOverrideURL } } ); if (imageOverrideAuth && !resizedAuth) { resizedAuth = JSON.parse(imageOverrideAuth); @@ -133,7 +135,7 @@ const SmallPromo = ({ customFields }) => { ? { ansImage: imageOverrideURL ? { - _id: resizedImage ? imageOverrideId : "", + _id: resizedImage ? imageOverrideId : manualImageId, url: imageOverrideURL, auth: resizedAuth || {}, } diff --git a/package-lock.json b/package-lock.json index f23f8020cf..ba98225b88 100644 --- a/package-lock.json +++ b/package-lock.json @@ -108,7 +108,7 @@ "@stripe/stripe-js": "^2.1.9", "@testing-library/jest-dom": "^6.1.4", "@testing-library/react": "^14.0.0", - "@wpmedia/arc-themes-components": "arc-themes-release-version-2.4.0", + "@wpmedia/arc-themes-components": "arc-themes-release-version-2.5.0", "algoliasearch": "^4.20.0", "babel-jest": "^29.7.0", "babel-loader": "^9.1.3", @@ -9124,19 +9124,60 @@ "link": true }, "node_modules/@wpmedia/arc-themes-components": { - "version": "0.0.4-arc-themes-release-version-2-2-0.1", - "resolved": "https://npm.pkg.github.com/download/@WPMedia/arc-themes-components/0.0.4-arc-themes-release-version-2-2-0.1/60e2bba0f78527c5d536707a15f2cb02effc0d10", - "integrity": "sha512-LKznamo1Tq67lW9SICkZdsKFlHFr9I3gPa+6o2TS3R77xDrTdhO/X2BKz+D9ujXc1gQUU4iHRL9+ta6Tw/Mdrg==", - "license": "CC-BY-NC-ND-4.0", + "version": "0.0.4-arc-themes-release-version-2-5-0.2", + "resolved": "https://npm.pkg.github.com/download/@WPMedia/arc-themes-components/0.0.4-arc-themes-release-version-2-5-0.2/cb3eba54f3de14381a35cc71085fb691caadce3b", + "integrity": "sha512-FCf9H1LX1d3v0rZtFErU3dgRHzdgc3gVyI4lEN7ZNms8C/gPxWX5xyl6Wu9Nk9d3plpLOQKo35f59IYkGFlgWg==", "dependencies": { "@arc-publishing/sdk-identity": "^1.79.0", + "@arc-publishing/sdk-sales": "^1.79.0", "dom-parser": "^0.1.6", "lazy-child": "^0.3.1", "lodash.get": "^4.4.2", + "node-fetch": "^2.7.0", + "react-google-recaptcha": "^3.1.0", + "react-google-recaptcha-v3": "^1.10.1", "react-oembed-container": "^1.0.1", "react-swipeable": "^7.0.1" } }, + "node_modules/@wpmedia/arc-themes-components/node_modules/node-fetch": { + "version": "2.7.0", + "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.7.0.tgz", + "integrity": "sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==", + "dependencies": { + "whatwg-url": "^5.0.0" + }, + "engines": { + "node": "4.x || >=6.0.0" + }, + "peerDependencies": { + "encoding": "^0.1.0" + }, + "peerDependenciesMeta": { + "encoding": { + "optional": true + } + } + }, + "node_modules/@wpmedia/arc-themes-components/node_modules/tr46": { + "version": "0.0.3", + "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz", + "integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==" + }, + "node_modules/@wpmedia/arc-themes-components/node_modules/webidl-conversions": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz", + "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==" + }, + "node_modules/@wpmedia/arc-themes-components/node_modules/whatwg-url": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz", + "integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==", + "dependencies": { + "tr46": "~0.0.3", + "webidl-conversions": "^3.0.0" + } + }, "node_modules/@wpmedia/article-body-block": { "resolved": "blocks/article-body-block", "link": true @@ -13068,7 +13109,6 @@ "version": "0.1.13", "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.13.tgz", "integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==", - "dev": true, "optional": true, "dependencies": { "iconv-lite": "^0.6.2" @@ -13078,7 +13118,6 @@ "version": "0.6.3", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", - "dev": true, "optional": true, "dependencies": { "safer-buffer": ">= 2.1.2 < 3.0.0" @@ -25931,7 +25970,7 @@ "version": "2.1.2", "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", - "dev": true + "devOptional": true }, "node_modules/sanitize-html": { "version": "2.12.0", @@ -29565,4 +29604,4 @@ } } } -} \ No newline at end of file +}