fix: salesforce commerce cloud when there is a untitled product listing from salesforce [INTEG-3036]

[ryunsong-contentful]

Purpose

JIRA Link: https://contentful.atlassian.net/browse/INTEG-3036
Zendesk link: https://contentful.atlassian.net/browse/ZEND-6790

User noted an issue in zendesk

With the fix it now does this

Root Cause

The error was caused by unsafe property access patterns where .default properties were accessed without proper null/undefined checks:

// PROBLEMATIC CODE
{product.name.default}                    // Crashes if product.name is undefined
{product.image.alt.default}               // Crashes if image or alt is missing
if (product.shortDescription.default)     // Crashes if shortDescription is undefined

Solution

1. Implemented Safe Property Access
Replaced unsafe property access with optional chaining (?.) and nullish coalescing (||) operators:

// FIXED CODE
{product.name?.default || 'Untitled Product'}
{product.image?.alt?.default || 'Product image'}  
if (product.shortDescription?.default) { ... }

2. Fixed Modal UI Structure

• Removed conflicting wrapper causing header overlap
• Fixed sticky positioning
• Improved spacing and alignment
• Added proper scrolling for search results

[netlify]

✅ Deploy Preview for ecommerce-app-base-components canceled.

Name	Link
🔨 Latest commit	2be80ca
🔍 Latest deploy log	https://app.netlify.com/projects/ecommerce-app-base-components/deploys/68a39785bf7b780008eea002

[Adrian Meyer (primeinteger)]

Approving so this doesn’t block the main fix.

One small note from the screenshots: the modal design could be tightened up a bit. There seems to be extra padding in the modal content area that slightly throws off the overall layout. Not a blocker, but maybe worth refining later.