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>
This commit is contained in:
chihlasm
2026-03-24 04:21:41 +00:00
parent 65eb630254
commit 48f2b3faaf
7 changed files with 137 additions and 76 deletions

View File

@@ -0,0 +1,34 @@
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
}),
)
}