A React hook that wraps `getProxiedImageUrl` by reading proxy configuration (`proxyPrefix` and `skipDomains`) from the ambient `ChatRuntimeContext`, eliminating the need to manually pass proxy config at each call site. ## Key Components ### `useProxiedImageUrl(url)` - **Input:** `string | null | undefined` — the image URL to potentially proxy - **Output:** `string` — the proxied URL, or `''` for null/undefined input - **Behavior:** Always passes `directHttps: true`, meaning HTTPS URLs are returned as-is. For cases requiring proxied HTTPS URLs, use `getProxiedImageUrl` from `@flamingo-stack/openframe-frontend-core/utils` directly with hardcoded config. ## Usage Example ```typescript // ✅ Standard usage — inside a component rendered within ChatRuntimeContext.Provider function AvatarImage({ imageUrl }: { imageUrl: string }) { const proxiedUrl = useProxiedImageUrl(imageUrl) return } // ✅ Handles null/undefined gracefully function OptionalImage({ imageUrl }: { imageUrl?: string | null }) { const proxiedUrl = useProxiedImageUrl(imageUrl) // returns '' if nullish return proxiedUrl ? : null } // ❌ Never call inside a loop — violates Rules of Hooks items.map(item => useProxiedImageUrl(item.url)) // WRONG // ✅ For map/loop patterns, use the pure utility instead import { getProxiedImageUrl } from '@flamingo-stack/openframe-frontend-core/utils' items.map(item => getProxiedImageUrl(item.url, { proxyPrefix, skipDomains })) ``` ## Constraints | Constraint | Detail | |---|---| | Must be inside `ChatRuntimeContext.Provider` | Uses `useRequiredChatRuntime()` — throws if context is missing | | `directHttps: true` always set | HTTPS URLs bypass the proxy; use pure util to override | | Top-level call only | Standard Rules of Hooks apply — no loops or conditionals |