feat: mejorar área privada, invitaciones de registro y contraste de modales
- Se sincronizó el estado de autenticación en las páginas de publicación y mis avisos usando AuthContext. - Se actualizó el diseño de las invitaciones a registro en áreas privadas. - Se añadió soporte para abrir el modal de login directamente en la pestaña de registro. - Se mejoró la legibilidad de todos los modales aumentando el desenfoque de fondo y la opacidad.
This commit is contained in:
@@ -4,6 +4,7 @@ import { AdsV2Service, type AdListingDto } from "../services/ads.v2.service";
|
||||
import { useAuth } from "../context/AuthContext";
|
||||
import { ChatService, type ChatMessage } from "../services/chat.service";
|
||||
import ChatModal from "../components/ChatModal";
|
||||
import LoginModal from "../components/LoginModal";
|
||||
import { formatCurrency, getImageUrl, parseUTCDate } from "../utils/app.utils";
|
||||
import { AD_STATUSES, STATUS_CONFIG } from "../constants/adStatuses";
|
||||
import ConfirmationModal from "../components/ConfirmationModal";
|
||||
@@ -17,7 +18,8 @@ export default function MisAvisosPage() {
|
||||
const [mensajes, setMensajes] = useState<ChatMessage[]>([]);
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const { user, fetchUnreadCount } = useAuth();
|
||||
const { user, fetchUnreadCount, login } = useAuth();
|
||||
const [showLoginModal, setShowLoginModal] = useState(false);
|
||||
|
||||
const [selectedChat, setSelectedChat] = useState<{
|
||||
adId: number;
|
||||
@@ -234,21 +236,38 @@ export default function MisAvisosPage() {
|
||||
if (!user) {
|
||||
return (
|
||||
<div className="container mx-auto px-6 py-24 text-center animate-fade-in-up">
|
||||
<div className="glass p-12 rounded-[3rem] max-w-2xl mx-auto border border-white/5 shadow-2xl">
|
||||
<div className="bg-[#111318]/90 backdrop-blur-3xl p-12 rounded-[3rem] max-w-2xl mx-auto border border-white/5 shadow-2xl">
|
||||
<span className="text-7xl mb-8 block">🔒</span>
|
||||
<h2 className="text-5xl font-black mb-4 uppercase tracking-tighter">
|
||||
Área Privada
|
||||
Registrate o Inicia Sesión
|
||||
</h2>
|
||||
<p className="text-gray-400 mb-10 text-lg italic">
|
||||
Para gestionar tus publicaciones, primero debes iniciar sesión.
|
||||
Para ver y gestionar tus avisos, primero debes registrarte o iniciar sesión.
|
||||
</p>
|
||||
<Link
|
||||
to="/publicar"
|
||||
className="bg-blue-600 hover:bg-blue-500 text-white px-12 py-5 rounded-[2rem] font-bold uppercase tracking-widest transition-all inline-block shadow-lg shadow-blue-600/20"
|
||||
>
|
||||
Identificarse
|
||||
</Link>
|
||||
<div className="flex flex-col md:flex-row gap-4 justify-center">
|
||||
<button
|
||||
onClick={() => setShowLoginModal(true)}
|
||||
className="bg-blue-600 hover:bg-blue-500 text-white px-12 py-5 rounded-[2rem] font-bold uppercase tracking-widest transition-all inline-block shadow-lg shadow-blue-600/20"
|
||||
>
|
||||
Registrarse
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{showLoginModal && (
|
||||
<div className="fixed inset-0 z-[200] flex items-center justify-center bg-black/80 backdrop-blur-xl animate-fade-in p-4">
|
||||
<div className="relative w-full max-w-md text-left">
|
||||
<LoginModal
|
||||
initialMode="REGISTER"
|
||||
onSuccess={(u) => {
|
||||
login(u);
|
||||
setShowLoginModal(false);
|
||||
}}
|
||||
onClose={() => setShowLoginModal(false)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user