b6ff9a3cb6
Major UX Improvements: - Replace all alert() dialogs with elegant toast notifications - Add comprehensive loading states for all async operations - Implement client-side form validation with visual feedback - Add React Error Boundary for graceful error recovery Components Added: - Toast notification system with success/error/warning/info types - useToast hook for easy notification management - ErrorBoundary component with development error details - Form validation with real-time feedback User Experience: - Professional toast notifications instead of browser alerts - Loading indicators prevent double-clicks and show progress - Immediate validation feedback prevents submission errors - Graceful error recovery with retry options - Enhanced accessibility with proper ARIA labels 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
25 lines
No EOL
652 B
TypeScript
25 lines
No EOL
652 B
TypeScript
import './globals.css';
|
|
import Header from '@/components/Header';
|
|
import Footer from '@/components/Footer';
|
|
import { ErrorBoundary } from '@/components/ErrorBoundary';
|
|
|
|
export const metadata = {
|
|
title: 'OBS Source Switcher',
|
|
description: 'A tool to manage OBS sources dynamically',
|
|
};
|
|
|
|
export default function RootLayout({ children }: { children: React.ReactNode }) {
|
|
return (
|
|
<html lang="en">
|
|
<body className="min-h-screen flex flex-col">
|
|
<Header />
|
|
<main className="flex-1">
|
|
<ErrorBoundary>
|
|
{children}
|
|
</ErrorBoundary>
|
|
</main>
|
|
<Footer />
|
|
</body>
|
|
</html>
|
|
);
|
|
} |