diff --git a/src/components/ErrorBoundary/index.tsx b/src/components/ErrorBoundary/index.tsx index 11c47b87..0254589f 100644 --- a/src/components/ErrorBoundary/index.tsx +++ b/src/components/ErrorBoundary/index.tsx @@ -17,40 +17,11 @@ function getSubTitleId(isChunkError: boolean, isOffline: boolean): string { : 'app.error.chunk.description.online'; } -/** - * Remove failed chunk script/link tags so the bundler runtime can retry loading. - * Utoopack caches failed chunks as rejected promises; removing the DOM elements - * and clearing its internal cache isn't possible via public API, but removing - * the script tags gives us a clean slate on the next retry. - */ -function removeFailedChunkScripts() { - const scripts = document.querySelectorAll( - 'script[src][data-failed], link[href][data-failed]', - ); - for (const el of scripts) el.remove(); -} - -function renderErrorFallback( - error: Error, - isOnline: boolean, - onReload: () => void, - onRetry: () => void, -) { +function renderErrorFallback(error: Error, onReload: () => void) { const intl = getIntl(); - const isOffline = !isOnline; + const isOffline = !navigator.onLine; const isChunkError = isChunkLoadError(error); - const subTitleId = getSubTitleId(isChunkError, isOffline); - - const retryButton = isChunkError ? ( - - ) : null; - return (
@@ -65,7 +36,7 @@ function renderErrorFallback( : 'Something went wrong', })} subTitle={intl.formatMessage({ - id: subTitleId, + id: getSubTitleId(isChunkError, isOffline), defaultMessage: isChunkError && isOffline ? 'Your network connection has been lost. Please check your connection and reload.' @@ -74,12 +45,7 @@ function renderErrorFallback( : 'Sorry, an error occurred on this page. Please reload or go back to the home page.', })} extra={[ - retryButton, - , - ].filter(Boolean)} + ]} />
@@ -112,7 +78,6 @@ export default class ErrorBoundary extends React.Component< ErrorBoundaryState > { state: ErrorBoundaryState = { hasError: false, error: null }; - private isOnline = typeof navigator !== 'undefined' ? navigator.onLine : true; static getDerivedStateFromError(error: Error): Partial { return { hasError: true, error }; @@ -120,45 +85,33 @@ export default class ErrorBoundary extends React.Component< componentDidMount() { window.addEventListener('online', this.handleOnline); - window.addEventListener('offline', this.handleOffline); } componentWillUnmount() { window.removeEventListener('online', this.handleOnline); - window.removeEventListener('offline', this.handleOffline); } + /** Auto-reload when coming back online, but only for chunk load errors. */ handleOnline = () => { - this.isOnline = true; - if (this.state.hasError) window.location.reload(); - }; - - handleOffline = () => { - this.isOnline = false; + if ( + this.state.hasError && + this.state.error && + isChunkLoadError(this.state.error) + ) { + window.location.reload(); + } }; componentDidCatch(error: Error, info: React.ErrorInfo) { console.error('[ErrorBoundary]', error, info.componentStack); } - /** Soft retry: clear failed scripts, reset state, let React re-render. */ - handleRetry = () => { - removeFailedChunkScripts(); - this.setState({ hasError: false, error: null }); - }; - - /** Hard reload: full page refresh. */ handleReload = () => { window.location.reload(); }; render() { if (!this.state.hasError || !this.state.error) return this.props.children; - return renderErrorFallback( - this.state.error, - this.isOnline, - this.handleReload, - this.handleRetry, - ); + return renderErrorFallback(this.state.error, this.handleReload); } } diff --git a/src/locales/bn-BD/pwa.ts b/src/locales/bn-BD/pwa.ts index b98f7c37..a8f2c8d5 100644 --- a/src/locales/bn-BD/pwa.ts +++ b/src/locales/bn-BD/pwa.ts @@ -8,7 +8,6 @@ export default { 'app.error.render.title': 'কিছু ভুল হয়েছে', 'app.error.render.description': 'দুঃখিত, এই পৃষ্ঠায় একটি ত্রুটি ঘটেছে। দয়া করে রিফ্রেশ করুন বা হোম পৃষ্ঠায় ফিরে যান।', - 'app.error.retry': 'আবার চেষ্টা করুন', 'app.error.reload': 'পৃষ্ঠা রিফ্রেশ করুন', 'app.error.home': 'হোমে ফিরে যান', 'app.request.offline': diff --git a/src/locales/en-US/pwa.ts b/src/locales/en-US/pwa.ts index 9a0fd432..68f36946 100644 --- a/src/locales/en-US/pwa.ts +++ b/src/locales/en-US/pwa.ts @@ -9,7 +9,6 @@ export default { 'app.error.render.title': 'Something went wrong', 'app.error.render.description': 'Sorry, an error occurred on this page. Please reload or go back to the home page.', - 'app.error.retry': 'Retry', 'app.error.reload': 'Reload Page', 'app.error.home': 'Back Home', 'app.request.offline': diff --git a/src/locales/fa-IR/pwa.ts b/src/locales/fa-IR/pwa.ts index 4f9a8baa..fd5c7d4b 100644 --- a/src/locales/fa-IR/pwa.ts +++ b/src/locales/fa-IR/pwa.ts @@ -9,7 +9,6 @@ export default { 'app.error.render.title': 'خطایی رخ داد', 'app.error.render.description': 'متأسفانه، در این صفحه خطایی رخ داد. لطفاً صفحه را بارگذاری مجدد کنید یا به صفحه اصلی بازگردید.', - 'app.error.retry': 'تلاش مجدد', 'app.error.reload': 'بارگذاری مجدد صفحه', 'app.error.home': 'بازگشت به صفحه اصلی', 'app.request.offline': diff --git a/src/locales/id-ID/pwa.ts b/src/locales/id-ID/pwa.ts index 4dbf0bf3..04bb4aa2 100644 --- a/src/locales/id-ID/pwa.ts +++ b/src/locales/id-ID/pwa.ts @@ -9,7 +9,6 @@ export default { 'app.error.render.title': 'Terjadi kesalahan', 'app.error.render.description': 'Maaf, terjadi kesalahan pada halaman ini. Muat ulang halaman atau kembali ke beranda.', - 'app.error.retry': 'Coba Lagi', 'app.error.reload': 'Muat Ulang Halaman', 'app.error.home': 'Kembali ke Beranda', 'app.request.offline': diff --git a/src/locales/ja-JP/pwa.ts b/src/locales/ja-JP/pwa.ts index b683b0ac..c0afbff3 100644 --- a/src/locales/ja-JP/pwa.ts +++ b/src/locales/ja-JP/pwa.ts @@ -9,7 +9,6 @@ export default { 'app.error.render.title': 'エラーが発生しました', 'app.error.render.description': '申し訳ありません、ページでエラーが発生しました。ページを再読み込みするか、ホームに戻ってください。', - 'app.error.retry': '再試行', 'app.error.reload': 'ページを再読み込み', 'app.error.home': 'ホームに戻る', 'app.request.offline': diff --git a/src/locales/pt-BR/pwa.ts b/src/locales/pt-BR/pwa.ts index b93c100c..af2bb2ca 100644 --- a/src/locales/pt-BR/pwa.ts +++ b/src/locales/pt-BR/pwa.ts @@ -9,7 +9,6 @@ export default { 'app.error.render.title': 'Algo deu errado', 'app.error.render.description': 'Desculpe, ocorreu um erro nesta página. Atualize a página ou volte para a página inicial.', - 'app.error.retry': 'Tentar novamente', 'app.error.reload': 'Atualizar página', 'app.error.home': 'Voltar ao Início', 'app.request.offline': diff --git a/src/locales/zh-CN/pwa.ts b/src/locales/zh-CN/pwa.ts index 1ba7a323..7da21ffb 100644 --- a/src/locales/zh-CN/pwa.ts +++ b/src/locales/zh-CN/pwa.ts @@ -7,7 +7,6 @@ export default { 'app.error.render.title': '页面出现错误', 'app.error.render.description': '抱歉,页面遇到了一些问题,请刷新页面或返回首页。', - 'app.error.retry': '重新加载', 'app.error.reload': '刷新页面', 'app.error.home': '返回首页', 'app.request.offline': '网络不可用,请检查网络连接后重试。', diff --git a/src/locales/zh-TW/pwa.ts b/src/locales/zh-TW/pwa.ts index ce1296d0..6428ff38 100644 --- a/src/locales/zh-TW/pwa.ts +++ b/src/locales/zh-TW/pwa.ts @@ -8,7 +8,6 @@ export default { 'app.error.render.title': '頁面出現錯誤', 'app.error.render.description': '抱歉,頁面遇到了一些問題,請重新整理頁面或返回首頁。', - 'app.error.retry': '重試', 'app.error.reload': '重新整理頁面', 'app.error.home': '返回首頁', 'app.request.offline': '網路不可用,請檢查網路連線後重試。',