BlockShield Copy this Tailwind VerificationComponentto Your Project

no, correct this code plis const UserCard = ({ user, isSelected, onAction, }: { user: User; isSelected: boolean; onAction: (user: User) => void; }) => ( <div className="w-64 p-4 m-2 bg-white rounded-xl shadow-md hover:shadow-lg transition duration-300 font-inter"> <div className="flex items-center space-x-4"> <img src={ fallback ? "/icons/user-default.svg" : `http://localhost:3001${ user.foto_perfil.startsWith("/") ? "" : "/" }${user.foto_perfil}` } alt={`Foto de ${user.nombre_completo}`} className="w-12 h-12 rounded-full object-cover" onError={(e) => (e.currentTarget.src = "/icons/user-default.svg")} /> <div className="flex-1"> <h3 className="text-lg font-semibold">{user.nombre_completo}</h3> <div className="text-sm text-gray-600 flex items-center"> <FiMail className="mr-2" /> {user.email} </div> <div className="text-sm text-gray-600 flex items-center"> <FiPhone className="mr-2" /> {user.telefono} </div> </div> </div> <button onClick={() => onAction(user)} className={`mt-4 w-full py-1.5 rounded-full text-sm font-semibold ${ isSelected ? "bg-gray-200 text-[#505050] hover:bg-gray-300" : "bg-[#FFA800] text-white hover:bg-[#e29400]" }`} > {isSelected ? ( <> <FiX className="inline mr-2" /> Quitar </> ) : ( <> <FiPlusCircle className="inline mr-2" /> Añadir </> )} </button> </div> );