23 lines
1.1 KiB
React
23 lines
1.1 KiB
React
import React from 'react';
|
||
import { useApp } from '../context/AppContext';
|
||
import { AlertTriangle, X, ArrowRight } from 'lucide-react';
|
||
|
||
/** Plan kotası aşıldığında sunucudan gelen uyarıyı gösterir. */
|
||
export const KotaUyarisi = () => {
|
||
const { kotaUyarisi, setKotaUyarisi, setActiveTab } = useApp();
|
||
if (!kotaUyarisi) return null;
|
||
return (
|
||
<div role="alert" className="bg-amber-50 border border-amber-300 rounded-xl p-4 my-3 flex items-start gap-3">
|
||
<AlertTriangle className="w-4 h-4 text-amber-700 shrink-0 mt-0.5" />
|
||
<p className="text-xs text-amber-900 leading-relaxed flex-1">{kotaUyarisi}</p>
|
||
<button type="button" onClick={() => { setKotaUyarisi(null); setActiveTab('planlar'); }}
|
||
className="text-[11px] font-bold text-amber-900 hover:underline flex items-center gap-1 shrink-0">
|
||
Planlar <ArrowRight className="w-3 h-3" />
|
||
</button>
|
||
<button type="button" onClick={() => setKotaUyarisi(null)} aria-label="Kota uyarısını kapat" className="text-amber-600 hover:text-amber-900 shrink-0">
|
||
<X className="w-4 h-4" />
|
||
</button>
|
||
</div>
|
||
);
|
||
};
|