changed: migrated inspect page to razor components

Components/MessageComponent.razor

@@ -0,0 +1,34 @@
+@if (Message is not null) {
+    <div class="alert @GetAlertTypeClass() rounded-sm">
+        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z" />
+        </svg>
+        <span>
+            @Message
+        </span>
+        <button class="btn btn-square btn-sm btn-ghost" onclick="this.parentElement.remove()">
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5">
+                <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z" clip-rule="evenodd"/>
+            </svg>
+        </button>
+    </div>
+}
+
+@code {
+    [Parameter]
+    public string? Message { get; set; }
+    [Parameter]
+    public AlertType Type { get; set; } = AlertType.Information;
+
+    private string GetAlertTypeClass() => Type switch{
+        AlertType.Information => "alert-info",
+        AlertType.Success => "alert-success",
+        AlertType.Warning => "alert-warning",
+        AlertType.Error => "alert-error",
+        _ => throw new ArgumentOutOfRangeException()
+        };
+
+    public enum AlertType {
+        Information, Success, Warning, Error
+    }
+}

Components/Pages/Inspect.razor

@@ -0,0 +1,77 @@
+@page "/inspect"
+@using Microsoft.AspNetCore.Authorization
+@using JustShortIt.Model
+@using Microsoft.Extensions.Caching.Distributed
+@attribute [Authorize]
+
+@inject IDistributedCache Db
+
+<PageTitle>Inspect - Just Short It</PageTitle>
+
+<div class="grid place-items-center h-full">
+    <section class="w-full md:max-w-lg flex flex-col gap-4">
+        @if (Model is null) {
+            <h1 class="text-3xl lg:text-5xl text-error text-center mb-6">
+                URL not found
+            </h1>
+            <h2 class="text-2xl lg:text-4xl text-secondary-content text-center mb-3">
+                The given ID does not exist, it may have expired or been deleted.
+            </h2>
+            <MessageComponent Message="@Message" Type="Type" />
+        } else {
+            <h1 class="text-3xl lg:text-5xl text-primary-content text-center mb-6">Inspect</h1>
+                
+            <dl class="grid grid-cols-2 gap-y-2 text-primary-content">
+                <dt>ID</dt>
+                <dd>@Model.Id</dd>
+                <dt>URL-Target</dt>
+                <dd>@Model.Target</dd>
+            </dl>
+
+            <form class="self-end" method="post" id="delete-form" 
+                  @formname="delete" @onsubmit="Submit_Delete">
+                <AntiforgeryToken />
+                <input type="hidden" asp-for="Id"/>
+                <button type="submit" class="btn btn-error min-h-0 h-8 text-base-content btn-wide">
+                    Delete
+                </button>
+            </form>
+        }
+
+        <a class="btn btn-primary btn-lg min-h-0 h-12 btn-wide self-center" href="/urls">
+            Back to URLs
+        </a>
+    </section>
+</div>
+
+@code {
+    [SupplyParameterFromQuery]
+    public string? Id { get; set; }
+
+    private string? Message { get; set; }
+    private MessageComponent.AlertType Type { get; set; }
+
+    private UrlRedirect? Model { get; set; }
+
+    protected override async Task OnInitializedAsync() {
+        if (Id is not null) {
+            string? url = await Db.GetStringAsync(Id);
+            if (url is not null)
+                Model = new UrlRedirect(Id, url, string.Empty);
+        }
+    }
+
+    private async Task Submit_Delete() {
+        if (Id is null) {
+            Message = $"Invalid Request: Deletion without Id";
+            return;
+        }
+
+        await Db.RemoveAsync(Id);
+
+        Type = MessageComponent.AlertType.Success;
+        Message = $"Id '{Id}' successfully deleted.";
+        return;
+    }
+
+}

Pages/Inspect.cshtml

@@ -1,44 +0,0 @@
-@page
-@using JustShortIt.Model
-@model JustShortIt.Pages.InspectModel
-@{
-    ViewData["Title"] = "Inspect";
-}
-
-<div class="grid place-items-center h-full">
-    <div class="w-full md:max-w-lg flex flex-col gap-4">
-        @if (Model.UrlRedirect is null) {
-            @if (!string.IsNullOrEmpty(Model.Message)) {
-                <div class="alert alert-success rounded-sm">
-                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
-                        <path stroke-linecap="round" stroke-linejoin="round" d="M11.25 11.25l.041-.02a.75.75 0 011.063.852l-.708 2.836a.75.75 0 001.063.853l.041-.021M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-9-3.75h.008v.008H12V8.25z" />
-                    </svg>
-                    <span>
-                        @Html.Raw(Model.Message)
-                    </span>
-                    <button class="btn btn-square btn-sm btn-ghost" onclick="this.parentElement.remove()">
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5">
-                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z" clip-rule="evenodd"/>
-                        </svg>
-                    </button>
-                </div>
-            } else {
-                <h1 class="text-3xl lg:text-5xl text-error text-center">URL not found</h1>
-                <h2 class="text-2xl lg:text-4xl text-secondary-content text-center">The given ID does not exist, it may have expired or been deleted.</h2>
-            }
-        } else {
-            <dl class="grid grid-cols-2 gap-y-2 text-primary-content">
-                <dt>ID</dt>
-                <dd>@Model.UrlRedirect.Id</dd>
-                <dt>URL-Target</dt>
-                <dd>@Model.UrlRedirect.Target</dd>
-            </dl>
-        
-            <form class="" method="post">
-                <input type="hidden" asp-for="Id" />
-                <button type="submit" class="btn btn-error text-base-content">Delete</button>
-            </form>
-        }
-        <a class="btn btn-primary btn-lg min-h-0 h-12 btn-wide self-center" asp-page="Urls">Back to URLs</a>
-    </div>
-</div>

Pages/Inspect.cshtml.cs

@@ -1,46 +0,0 @@
-using JustShortIt.Model;
-using Microsoft.AspNetCore.Authorization;
-using Microsoft.AspNetCore.Mvc;
-using Microsoft.AspNetCore.Mvc.RazorPages;
-using Microsoft.Extensions.Caching.Distributed;
-
-namespace JustShortIt.Pages; 
-
-[Authorize]
-public class InspectModel : PageModel {
-    [BindProperty(Name = "id", SupportsGet = true)]
-    public string? Id { get; set; } = string.Empty;
-    [BindProperty(Name="message")]
-    public string? Message { get; set; }
-
-    public UrlRedirect? UrlRedirect { get; set; }
-    
-    private IDistributedCache Db { get; }
-
-    public InspectModel(IDistributedCache db) {
-        Db = db;
-    }
-
-    public async Task<IActionResult> OnPostAsync() {
-        if (Id == null) return await OnGet(null, $"Delete request without ID, aborted.");
-
-        await Db.RemoveAsync(Id);
-
-        return await OnGet(null, $"ID '{Id}' successfully deleted.");
-    }
-
-    public async Task<IActionResult> OnGet(string? id, string? message) {
-        if (id is null && message is null) return RedirectToPage("Urls");
-        
-        Id = id;
-        Message = message;
-
-        if (Id is not null) {
-            string? url = await Db.GetStringAsync(Id);
-            if (url is not null) 
-                UrlRedirect = new UrlRedirect(Id, url, string.Empty);
-        }
-
-        return Page();
-    }
-}

Pages/Urls.cshtml.cs

@@ -1,11 +1,10 @@
-using System.Text.Encodings.Web;
 using JustShortIt.Model;
 using Microsoft.AspNetCore.Authorization;
 using Microsoft.AspNetCore.Mvc;
 using Microsoft.AspNetCore.Mvc.RazorPages;
 using System.Text.RegularExpressions;
 using System.Web;
-using Microsoft.AspNetCore.Components;
+using Microsoft.AspNetCore.WebUtilities;
 using Microsoft.Extensions.Caching.Distributed;
 
 namespace JustShortIt.Pages; 
@@ -42,7 +41,7 @@ public class UrlsModel : PageModel {
             return Page();
         }
 
-        return RedirectToPage("Inspect", new { Id = id });
+        return LocalRedirect(QueryHelpers.AddQueryString("~/inspect", "Id", id));
     }
 
     public async Task<IActionResult> OnPostNewAsync() {