fix(6): add missing Toast component and fix backend startup
- Create Toast component for success/error messages - Fix uvicorn invocation: use backend.main:app from project root - Ensures relative imports work correctly in backend modules
This commit is contained in:
34
frontend/components/Toast.tsx
Normal file
34
frontend/components/Toast.tsx
Normal file
@@ -0,0 +1,34 @@
|
||||
'use client';
|
||||
|
||||
import { useEffect } from 'react';
|
||||
|
||||
export interface ToastProps {
|
||||
type: 'success' | 'error' | 'warning' | 'info';
|
||||
message: string;
|
||||
onClose: () => void;
|
||||
duration?: number;
|
||||
}
|
||||
|
||||
export function Toast({ type, message, onClose, duration = 3000 }: ToastProps) {
|
||||
useEffect(() => {
|
||||
const timer = setTimeout(onClose, duration);
|
||||
return () => clearTimeout(timer);
|
||||
}, [onClose, duration]);
|
||||
|
||||
const bgColor = {
|
||||
success: 'bg-green-500',
|
||||
error: 'bg-red-500',
|
||||
warning: 'bg-yellow-500',
|
||||
info: 'bg-blue-500',
|
||||
}[type];
|
||||
|
||||
return (
|
||||
<div
|
||||
className={`fixed bottom-4 right-4 ${bgColor} text-white px-4 py-2 rounded shadow-lg z-50 animate-fade-in`}
|
||||
role="alert"
|
||||
aria-live="polite"
|
||||
>
|
||||
{message}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user