feat: Añadir soporte para autenticación de Discord y gestión de sesiones, incluyendo rutas de OAuth y almacenamiento de estado

This commit is contained in:
Shni
2025-10-14 22:39:14 -05:00
parent f68d7ec0b0
commit 69653b38ad
7 changed files with 547 additions and 4 deletions

View File

@@ -0,0 +1,43 @@
<div class="max-w-6xl mx-auto p-4">
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<!-- Card principal -->
<div class="col-span-2">
<div class="backdrop-blur-md bg-white/10 border border-white/10 rounded-xl p-6 shadow-lg glass-card">
<h1 class="text-3xl font-bold mb-2"><%= appName %></h1>
<p class="text-sm text-slate-200/80 mb-4">Panel de administración</p>
<div class="mt-4">
<label class="block text-xs text-slate-300 mb-2">Selecciona servidor</label>
<select id="guildSelector" class="w-full rounded-md p-3 bg-white/6 text-white focus:outline-none">
<% if (guilds && guilds.length) { %>
<% guilds.forEach(g => { %>
<option value="<%= g.id %>"><%= g.name %> (<%= g.id %>)</option>
<% }) %>
<% } else { %>
<option disabled>No tienes servidores gestionados</option>
<% } %>
</select>
</div>
</div>
</div>
<!-- Sidebar navegación móvil estilo app -->
<aside class="col-span-1 md:col-span-1">
<nav class="bg-white/6 backdrop-blur rounded-xl p-4 glass-card">
<ul class="flex md:flex-col gap-2">
<li><a href="/dashboard/overview" class="block p-2 rounded-md hover:bg-white/5">Overview</a></li>
<li><a href="/dashboard/members" class="block p-2 rounded-md hover:bg-white/5">Miembros</a></li>
<li><a href="/dashboard/settings" class="block p-2 rounded-md hover:bg-white/5">Ajustes</a></li>
<li><a href="/dashboard/areas" class="block p-2 rounded-md hover:bg-white/5">Game Areas</a></li>
<li><a href="/dashboard/mobs" class="block p-2 rounded-md hover:bg-white/5">Mobs</a></li>
</ul>
</nav>
</aside>
</div>
</div>
<script>
document.getElementById('guildSelector')?.addEventListener('change', (e) => {
const v = e.target.value;
if (v) window.location.href = `/dashboard/${v}/overview`;
});
</script>

View File

@@ -0,0 +1,7 @@
<div class="min-h-screen flex items-center justify-center">
<div class="w-full max-w-md p-6 glass-card backdrop-blur-md rounded-xl">
<h2 class="text-2xl font-bold mb-4">Inicia sesión con Discord</h2>
<p class="text-sm mb-6">Para administrar servidores y usar el dashboard debes autenticarte con Discord.</p>
<a class="inline-block px-4 py-3 rounded-md bg-indigo-600 hover:bg-indigo-700 text-white" href="/auth/discord">Continuar con Discord</a>
</div>
</div>

View File

@@ -0,0 +1,22 @@
<header class="w-full bg-transparent p-3 md:p-4 fixed top-0 left-0 right-0 z-20">
<div class="max-w-6xl mx-auto flex items-center justify-between">
<div class="flex items-center gap-3">
<a href="/" class="text-white font-bold">← Volver</a>
<span class="text-white/80">|</span>
<h3 class="text-white font-semibold"><%= appName %></h3>
</div>
<div class="flex items-center gap-3">
<% if (user) { %>
<div class="flex items-center gap-2">
<img src="<%= user.avatar || '/assets/images/snap1.svg' %>" class="w-8 h-8 rounded-full" alt="avatar">
<span class="text-white"><%= user.username %></span>
</div>
<a href="/auth/logout" class="text-sm text-white/70 px-3 py-2 rounded-md hover:bg-white/5">Salir</a>
<% } else { %>
<a href="/auth/discord" class="text-sm text-white/70 px-3 py-2 rounded-md hover:bg-white/5">Entrar</a>
<% } %>
</div>
</div>
</header>
<div style="height:56px"></div>