CMS-47490 Refactor getPreviewUtils to improve URL handling

Author: TRomesh

packages/optimizely-cms-sdk/src/react/server.tsx

@@ -343,13 +343,17 @@ export function getPreviewUtils(opti: OptimizelyComponentProps['opti']) {
     src(input: InferredContentReference | string | null | undefined): string {
       const previewToken = opti.__context?.preview_token;
 
-      // if input is a ContentReference
-      if (typeof input === 'object' && previewToken && input?.item?.Url) {
-        return appendToken(input?.item?.Url, previewToken);
+      // if input is an object with a URL
+      if (typeof input === 'object' && input) {
+        // if dam asset is selected the default URL is in input.url.default will be null
+        const url = input.url?.default ?? input.item?.Url;
+        if (url) {
+          return appendToken(url, previewToken);
+        }
       }
 
       // if input is a string URL
-      if (typeof input === 'string' && previewToken) {
+      if (typeof input === 'string') {
         return appendToken(input, previewToken);
       }
 

packages/optimizely-cms-sdk/src/util/preview.ts

@@ -7,7 +7,7 @@
  * @returns The URL with the preview token appended as a query parameter.
  */
 export const appendToken = (url: string, previewToken?: string): string => {
-  if (!previewToken) return url;
+  if (!previewToken || previewToken.trim() === '') return url;
   const separator = url.includes('?') ? '&' : '?';
   return `${url}${separator}preview_token=${previewToken}`;
 };

samples/nextjs-template/src/app/globals.css

@@ -414,7 +414,6 @@ a:hover span.animate {
 .about-us .about-us-image {
   position: relative;
   width: 100%;
-  padding-top: 56.25%;
 }
 
 .about-us .about-us-image img {