mirror of
https://github.com/chillpadclub/bedolaga-cabinet.git
synced 2026-07-28 17:43:47 +00:00
562ab7abf7
Phase 0: Remove ~920 lines of dead code (ThemeBentoPicker, PromoDiscountBadge, AdminLayout, SettingsSidebar, MovingGradient, EmptyState, miniapp API, unused types/functions/transitions/skeleton helpers). Fix API barrel file (add 20 missing exports). Phase 1: Add ErrorBoundary (app/page/widget levels), centralize constants, add axios timeout, fix staleTime:0 in React Query. Phase 2: Consolidate hexToHsl, extract email validation, fix duplicate code. Phase 3: Fix auth race condition (await checkAdminStatus), memoize useCurrency, add WebSocket message validation. Phase 4: Extract useBranding, useFeatureFlags, useScrollRestoration from AppShell. Phase 5: Remove all eslint-disable react-hooks/exhaustive-deps (14 total), simplify logger, remove deprecated hooks (useBackButton, useTelegramDnd, useTelegramWebApp). Dependencies: React 19, react-router 7, zustand 5, i18next 25, react-i18next 16, eslint-plugin-react-refresh 0.5. Remove unused @lottiefiles/dotlottie-react. Convert vite manualChunks to function-based approach for react-router v7 compat. Lint: Fix logger.ts no-unused-expressions, fix react-refresh/only-export-components in 6 Radix primitive files (const re-exports → direct re-exports), fix WebSocketProvider exhaustive-deps. Result: 0 errors, 0 warnings. Add CLAUDE.md to .gitignore.
94 lines
2.8 KiB
TypeScript
94 lines
2.8 KiB
TypeScript
import { Component, type ErrorInfo, type ReactNode } from 'react';
|
||
|
||
interface ErrorBoundaryProps {
|
||
children: ReactNode;
|
||
level?: 'app' | 'page' | 'widget';
|
||
onReset?: () => void;
|
||
}
|
||
|
||
interface ErrorBoundaryState {
|
||
hasError: boolean;
|
||
error: Error | null;
|
||
}
|
||
|
||
export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
|
||
constructor(props: ErrorBoundaryProps) {
|
||
super(props);
|
||
this.state = { hasError: false, error: null };
|
||
}
|
||
|
||
static getDerivedStateFromError(error: Error): ErrorBoundaryState {
|
||
return { hasError: true, error };
|
||
}
|
||
|
||
componentDidCatch(error: Error, errorInfo: ErrorInfo) {
|
||
console.error('[ErrorBoundary]', error, errorInfo);
|
||
}
|
||
|
||
handleReset = () => {
|
||
this.setState({ hasError: false, error: null });
|
||
this.props.onReset?.();
|
||
};
|
||
|
||
render() {
|
||
if (!this.state.hasError) {
|
||
return this.props.children;
|
||
}
|
||
|
||
const { level = 'page' } = this.props;
|
||
|
||
if (level === 'app') {
|
||
return (
|
||
<div className="flex min-h-screen items-center justify-center bg-dark-900 p-4">
|
||
<div className="max-w-md text-center">
|
||
<div className="mb-4 text-4xl">⚠️</div>
|
||
<h1 className="mb-2 text-xl font-bold text-dark-50">Something went wrong</h1>
|
||
<p className="mb-6 text-dark-400">
|
||
An unexpected error occurred. Please try reloading the page.
|
||
</p>
|
||
<button
|
||
onClick={() => window.location.reload()}
|
||
className="rounded-xl bg-accent-500 px-6 py-3 font-medium text-white transition-colors hover:bg-accent-600"
|
||
>
|
||
Reload page
|
||
</button>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
if (level === 'widget') {
|
||
return (
|
||
<div className="rounded-xl border border-error-500/30 bg-error-500/10 p-4 text-center">
|
||
<p className="text-sm text-error-400">Failed to load this section</p>
|
||
<button
|
||
onClick={this.handleReset}
|
||
className="mt-2 text-sm text-accent-400 hover:text-accent-300"
|
||
>
|
||
Try again
|
||
</button>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
// level === 'page' (default)
|
||
return (
|
||
<div className="flex min-h-[50vh] items-center justify-center p-4">
|
||
<div className="max-w-md text-center">
|
||
<div className="mb-4 text-4xl">⚠️</div>
|
||
<h1 className="mb-2 text-xl font-bold text-dark-50">Something went wrong</h1>
|
||
<p className="mb-6 text-sm text-dark-400">
|
||
{this.state.error?.message || 'An unexpected error occurred'}
|
||
</p>
|
||
<button
|
||
onClick={this.handleReset}
|
||
className="rounded-xl bg-accent-500 px-6 py-3 font-medium text-white transition-colors hover:bg-accent-600"
|
||
>
|
||
Try again
|
||
</button>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
}
|