Add redirect page to login

Jerguero.sln

@@ -3,7 +3,7 @@ Microsoft Visual Studio Solution File, Format Version 12.00
 # Visual Studio Version 17
 VisualStudioVersion = 17.5.002.0
 MinimumVisualStudioVersion = 10.0.40219.1
-Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "csharp", "csharp.csproj", "{912903B0-B6A9-4584-AE22-28FA74D26277}"
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Jerguero", "Jerguero.csproj", "{912903B0-B6A9-4584-AE22-28FA74D26277}"
 EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution

Model/Person.cs

@@ -0,0 +1,14 @@
+using System.ComponentModel.DataAnnotations;
+
+namespace Jerguero.Model;
+
+public class Person
+{
+    public int Id { get; set; }
+
+    [Required]
+    public required string Email { get; set; }
+
+    [Required]
+    public required string Password { get; set; }
+}

Pages/Components/_Badge.cshtml

@@ -2,6 +2,6 @@
     var text = ViewData["text"];
 }
 
-<button class="inline-block mr-2 py-1 px-2 text-xs rounded-full hover:underline bg-[#082f49] cursor-pointer">
+<button class="inline-block mr-2 py-1 px-2 text-xs rounded-full hover:underline bg-[#082f49] text-white cursor-pointer">
     @text
 </button>

Pages/Index.cshtml

@@ -11,7 +11,7 @@
         Jerguero
     </div>
     <div class="text-center p-2">
-        <a href="/NewDefinition" class="py-1 px-2 rounded bg-c-primary text-c-on-primary hover:underline">
+        <a href="/New" class="py-1 px-2 rounded bg-c-primary text-c-on-primary hover:underline">
             Agregá una nueva definición
         </a>
     </div>

Pages/Login.cshtml

@@ -1,5 +1,56 @@
 @page
+@model Jerguero.Pages.LoginModel
 
-<p>
+<h1 class="text-3xl font-bold text-center my-4 fixed top-0 w-screen">
-    :D (login)
+    Jerguero
+</h1>
+<div class="flex items-center h-screen w-full">
+    <div class="container mx-auto" hx-ext="response-targets">
+        <p class="my-4 p-2 rounded bg-c-bg-2 text-c-on-bg shadow shadow-zinc-500">
+            ¡Iniciá sesión para comenzar a crear definiciones!
         </p>
+        <form
+            class="my-4 py-4 px-2 rounded bg-c-bg-2 text-c-on-bg shadow shadow-zinc-500"
+            method="post"
+        >
+            <div asp-validation-summary="ModelOnly" class="text-red-400"></div>
+            <input type="hidden" value="@Model.RedirectUrl">
+
+            <div class="py-2">
+                <label class="text-sm opacity-85" asp-for="LoginPerson.Email">Correo electronico:</label>
+                <br />
+                <input asp-for="LoginPerson.Email" 
+                    class="inline-block w-full rounded bg-c-bg text-c-on-bg py-2 px-1
+                            disabled:cursor-not-allowed disabled:opacity-50 transition-opacity"
+                    type="email" required />
+                <span asp-validation-for="LoginPerson.Email" class="text-red-400"></span>
+            </div>
+
+            <div class="py-2">
+                <label asp-for="LoginPerson.Password" class="text-sm opacity-85" for="login-password">Contraseña:</label>
+                <br />
+                <input asp-for="LoginPerson.Password" 
+                    class="inline-block w-full rounded bg-c-bg text-c-on-bg py-2 px-1
+                            disabled:cursor-not-allowed disabled:opacity-50 transition-opacity"
+                    type="password" pattern=".{8,}" required />
+                <span asp-validation-for="LoginPerson.Password" class="text-red-400"></span>
+            </div>
+
+            <div class="text-center pt-2">
+                <button type="submit" class="py-1 px-2 rounded bg-c-primary text-c-on-primary hover:underline
+                        disabled:cursor-not-allowed disabled:animate-pulse" data-loading-disable>
+                    Iniciar sesión
+                </button>
+            </div>
+
+            <div id="login-result" class="text-center pt-2"></div>
+            <div id="login-result-error" class="text-center pt-2 text-red-400"></div>
+        </form>
+
+    </div>
+</div>
+
+
+@section Scripts {
+    <partial name="_ValidationScriptsPartial" />
+}

Pages/Login.cshtml.cs

@@ -0,0 +1,79 @@
+using System.Security.Claims;
+using Jerguero.Model;
+using Microsoft.AspNetCore.Authentication;
+using Microsoft.AspNetCore.Authentication.Cookies;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+
+namespace Jerguero.Pages;
+
+public class LoginModel(ILogger<LoginModel> logger) : PageModel
+{
+    private readonly ILogger<LoginModel> _logger = logger;
+
+    [BindProperty]
+    public Person LoginPerson { get; set; } = default!;
+
+    public string RedirectUrl = "/";
+
+    public IActionResult OnGet(string? redirect)
+    {
+        RedirectUrl = redirect ?? "/";
+        if (User.Identity?.IsAuthenticated == true)
+        {
+            return LocalRedirect(redirect ?? "/");
+        }
+
+        return Page();
+    }
+
+    public async Task<IActionResult> OnPostAsync(string? redirect)
+    {
+        _logger.LogInformation($"Got `{redirect}` as redirect param");
+        if (!ModelState.IsValid || LoginPerson == null)
+        {
+            return Page();
+        }
+
+        // login
+        var loginCorrect = await AuthenticateUser(LoginPerson.Email, LoginPerson.Password);
+        if (!loginCorrect)
+        {
+            ModelState.AddModelError(string.Empty, "Credenciales inválidos");
+            return Page();
+        }
+
+        var claims = new List<Claim>
+        {
+            new(ClaimTypes.Name, LoginPerson.Email),
+            new(ClaimTypes.Role, "User"),
+        };
+
+        var claimsIdentity = new ClaimsIdentity(claims, CookieAuthenticationDefaults.AuthenticationScheme);
+
+        await HttpContext.SignInAsync(
+            CookieAuthenticationDefaults.AuthenticationScheme,
+            new ClaimsPrincipal(claimsIdentity),
+            new AuthenticationProperties { }
+        );
+
+        return LocalRedirect(redirect ?? "/");
+    }
+
+    private async Task<bool> AuthenticateUser(string email, string password)
+    {
+        _logger.LogInformation("Authenticating: {}", new { Email = email, Password = password });
+
+        await Task.Delay(1000);
+
+        if (email == "a@b.c")
+        {
+            return true;
+        }
+        else
+        {
+            return false;
+        }
+    }
+}
+

Pages/New.cshtml

@@ -0,0 +1,6 @@
+@page
+@model Jerguero.Pages.NewDefinitionModel
+@{
+}
+
+<p>New definition :D</p>

Pages/New.cshtml.cs

@@ -1,7 +1,7 @@
 using Microsoft.AspNetCore.Mvc;
 using Microsoft.AspNetCore.Mvc.RazorPages;
 
-namespace JergueroCS.Pages
+namespace Jerguero.Pages
 {
     public class NewDefinitionModel : PageModel
     {
@@ -9,10 +9,9 @@ namespace JergueroCS.Pages
         {
             if (User.Identity?.IsAuthenticated != true)
             {
-                return RedirectToPage("/Login");
+                return RedirectToPage($"/Login", new {redirect = "/New"});
             }
 
-            System.Console.WriteLine(":D");
             return Page();
         }
     }

Pages/NewDefinition.cshtml

@@ -1,51 +0,0 @@
-@page
-@model JergueroCS.Pages.NewDefinitionModel
-@{
-}
-
-<h1 class="text-3xl font-bold text-center my-4 fixed top-0 w-screen">
-    Jerguero
-</h1>
-<div class="flex items-center h-screen w-full">
-    <div class="container mx-auto" "hx-ext"="response-targets">
-        <p class="my-4 p-2 rounded bg-c-bg-2 text-c-on-bg">
-            ¡Iniciá sesión para comenzar a crear definiciones!
-        </p>
-        <form
-            class="my-4 py-4 px-2 rounded bg-c-bg-2 text-c-on-bg"
-            hx-post="/login"
-            hx-swap="innerHTML"
-            hx-target="#login-result"
-            hx-target-error="#login-result-error"
-        >
-            <input hidden name="login_redirect" value=(redirect_url) />
-
-            <div class="py-2">
-                <label class="text-sm opacity-85" for="login-email">Correo electronico:</label>
-                <br />
-                <input class="inline-block w-full rounded bg-c-bg text-c-on-bg py-2 px-1
-                                disabled:cursor-not-allowed disabled:opacity-50 transition-opacity" id="login-email"
-                    name="login_email" type="email" required data-loading-disable="true" />
-            </div>
-
-            <div class="py-2">
-                <label class="text-sm opacity-85" for="login-password">Contraseña:</label>
-                <br />
-                <input class="inline-block w-full rounded bg-c-bg text-c-on-bg py-2 px-1
-                                disabled:cursor-not-allowed disabled:opacity-50 transition-opacity" id="login-password"
-                    name="login_password" type="password" min="8" max="64" required data-loading-disable="true" />
-            </div>
-
-            <div class="text-center pt-2">
-                <button type="submit" class="py-1 px-2 rounded bg-c-primary text-c-on-primary hover:underline
-                                disabled:cursor-not-allowed disabled:animate-pulse" data-loading-disable>
-                    Iniciar sesión
-                </button>
-            </div>
-
-            <div id="login-result" class="text-center pt-2"></div>
-            <div id="login-result-error" class="text-center pt-2 text-red-400"></div>
-        </form>
-
-    </div>
-</div>

Pages/Shared/_Layout.cshtml

@@ -6,8 +6,6 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>@ViewData["Title"] - Jerguero</title>
     <link rel="stylesheet" href="~/css/tailwind-output.css" asp-append-version="true" />
-    <link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
-    <link rel="stylesheet" href="~/csharp.styles.css" asp-append-version="true" />
 
 
     <link rel="preconnect" href="https://fonts.googleapis.com" />

wwwroot/css/site.css

@@ -1,22 +0,0 @@
-html {
-  font-size: 14px;
-}
-
-@media (min-width: 768px) {
-  html {
-    font-size: 16px;
-  }
-}
-
-.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
-  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
-}
-
-html {
-  position: relative;
-  min-height: 100%;
-}
-
-body {
-  margin-bottom: 60px;
-}

wwwroot/css/tailwind-input.css

@@ -5,8 +5,6 @@
 :root {
     --c-primary: #0ea5e9;
     --c-on-primary: white;
-
-
 }
 
 :root {