Files
resolutionflow/frontend/src/lib/lazyWithRetry.ts
chihlasm 48f2b3faaf fix: stale chunk auto-reload + image paste upload UX
- Add lazyWithRetry wrapper for all lazy-loaded routes to auto-reload
  on stale chunk errors after deploys (prevents ErrorBoundary flash)
- Show toast notification when image paste/upload fails due to storage
  not configured (503), instead of silent tiny error thumbnails
- Remove failed uploads from thumbnail strip on 503 (was showing
  confusing retry icon)
- Pass completed upload IDs in navigation state from dashboard input
- Suppress Sentry dialog for chunk load errors (deploy artifacts)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-24 04:21:41 +00:00

35 lines
1.1 KiB
TypeScript

import { lazy } from 'react'
/**
* Wraps React.lazy with retry logic for stale chunk errors after deployments.
* On first failure, reloads the page once to get fresh asset manifest.
*/
export function lazyWithRetry<T extends React.ComponentType<unknown>>(
importFn: () => Promise<{ default: T }>,
) {
return lazy(() =>
importFn().catch((error: Error) => {
const isChunkError =
error.message.includes('dynamically imported module') ||
error.message.includes('Loading chunk') ||
error.message.includes('importing a module script failed') ||
error.message.includes('loading css chunk')
if (!isChunkError) throw error
// Only auto-reload once per 10 seconds to prevent loops
const key = 'rf_lazy_chunk_reload'
const lastReload = sessionStorage.getItem(key)
const now = Date.now()
if (!lastReload || now - Number(lastReload) > 10_000) {
sessionStorage.setItem(key, String(now))
window.location.reload()
}
// If we already reloaded recently and it still fails, let it propagate
throw error
}),
)
}