Fix: Handle undefined window.openai in local developmentFix: Handle undefined window.openai in local development

[deibyrayo]

Problem

Running the project locally (pnpm dev) results in a crash with:

Cannot read properties of undefined (reading 'setWidgetState')

This happens because the code assumes window.openai (part of the ChatGPT Apps SDK) is always available, but it's only present when running inside ChatGPT.

Solution

Added null checks and graceful fallbacks:

1. useWidgetState hook: Added optional chaining when accessing window.openai.setWidgetState
2. pizzaz-shop component: Show product details inline when modal API is unavailable

Behavior

Before

• ❌ Crashes immediately on local dev server
• ❌ Blank page, no way to view components

After

• ✅ Runs successfully in local development
• ✅ Shows product details inline (instead of modal) when clicking items
• ✅ Maintains original modal behavior in ChatGPT environment

Testing

Tested locally with pnpm dev:

1. Page loads without errors
2. Can click on products to view details
3. All components render correctly

The changes are backward compatible and don't affect the ChatGPT environment.- Add null checks for window.openai.setWidgetState in useWidgetState hook

• Enable local development by showing product details inline when window.openai is unavailable
• Fixes crash that prevented local development with 'Cannot read properties of undefined' error

Before this change, running the project locally would crash because the code assumed window.openai (part of the ChatGPT Apps SDK) would always be available. Now the code gracefully handles both environments:

• In ChatGPT: Uses window.openai.requestModal() to open modals
• In local dev: Shows product details inline in the main view

This allows developers to run and test the UI components locally without errors.