24 lines
941 B
JavaScript
24 lines
941 B
JavaScript
import React, {useState} from "react";
|
|
import { TriangleAlert,X } from "lucide-react";
|
|
import { useAuth } from "../AuthContext";
|
|
|
|
function AlertInactive({affAlert,setAffAlert}) {
|
|
const { user } = useAuth();
|
|
return (
|
|
(affAlert&&(user?.role!=="user")&&(
|
|
<div className="flex flex-col md:flex-row bg-slate-600 w-full md:w-1/2 lg:w-1/3 fixed top-20 right-1 sm:right-4 rounded-lg p-4 md:p-5 items-center gap-4 md:gap-6 shadow-lg opacity-90">
|
|
<button onClick={()=>setAffAlert(false)}className="absolute top-2 right-2 text-white hover:text-gray-300">
|
|
<X/>
|
|
</button>
|
|
|
|
<TriangleAlert className="text-red-700 w-12 h-12 md:w-16 md:h-16" />
|
|
|
|
<p className="text-sm md:text-base text-white text-center md:text-left">
|
|
Cet objet peut être inactif dû à son manque de données. Vous pouvez le
|
|
rendre inactif en changeant son status.
|
|
</p>
|
|
</div>
|
|
)));
|
|
}
|
|
|
|
export default AlertInactive; |