Back button error page

Author: BenjaminMichaelis

EssentialCSharp.Web/Controllers/HomeController.cs

@@ -121,8 +121,13 @@ private string FlipPage(int currentChapter, int currentPage, bool next)
     [ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
     public IActionResult Error(string? errorMessage = null, int statusCode = 404)
     {
+        if (statusCode is < 400 or > 599)
+        {
+            statusCode = 500;
+        }
         Response.StatusCode = statusCode;
-        ViewBag.ErrorMessage = $"{statusCode}: {errorMessage}";
+        ViewBag.StatusCode = statusCode;
+        ViewBag.ErrorMessage = string.IsNullOrWhiteSpace(errorMessage) ? null : $"{statusCode}: {errorMessage}";
         ViewBag.PageTitle = $"Error-{statusCode}";
         return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
     }

EssentialCSharp.Web/Views/Home/Error.cshtml

@@ -1,6 +1,24 @@
-<div class="py-2 px-2"> 
-    <h1>Error</h1>
-    <div>
-        @ViewBag.ErrorMessage
+@{
+    int statusCode = ViewBag.StatusCode ?? 400;
+    string heading = statusCode switch
+    {
+        404 => "Page Not Found",
+        500 => "Something Went Wrong",
+        _   => "Error"
+    };
+}
+
+<div class="py-2 px-2">
+    <h1>@heading</h1>
+    @if (ViewBag.ErrorMessage is string msg)
+    {
+        <div class="mb-3">@msg</div>
+    }
+    <div class="d-flex gap-2">
+        <a href="/home" class="btn btn-primary">Go Home</a>
+        <button type="button" class="btn btn-secondary"
+                onclick="if(history.length > 1){ history.back(); } else { window.location='/home'; }">
+            Go Back
+        </button>
     </div>
 </div>

EssentialCSharp.Web/wwwroot/js/site.js

@@ -294,10 +294,7 @@ const app = createApp({
             return tocData.filter(item => filterItem(item, query));
         });
 
-        const isContentPage = computed(() => {
-            let path = window.location.pathname;
-            return path !== '/home' && path !== '/guidelines' && path !== '/about' && path !== '/announcements';
-        });
+        const isContentPage = computed(() => percentComplete.value !== null);
 
         function filterItem(item, query) {
             let matches = normalizeString(item.title).includes(query);