MVC (layered variant)

2026-04-26 13:40:03 +02:00
parent 0ee1b22f61
commit 1415005b82
50 changed files with 2130 additions and 0 deletions
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Constants.cs
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Constants.cs
@@ -0,0 +1,33 @@
+namespace MVC_SimpleCRUD_Layered.Web;
+
+public static class Constants
+{
+    public static class TempDataKeys
+    {
+        public const string ToastMessage = "ToastMessage";
+        public const string ToastVariant = "ToastVariant";
+        public const string ToastTitle = "ToastTitle";
+    }
+
+    public static class ToastVariants
+    {
+        public const string Success = "success";
+        public const string Danger = "danger";
+    }
+
+    public static class ToastTitles
+    {
+        public const string Notification = "Notification";
+        public const string Error = "Error";
+    }
+
+    public static class ViewDataKeys
+    {
+        public const string PagingInfo = "PagingInfo";
+    }
+
+    public static class ValidationMessages
+    {
+        public const string EmailOrContactPhoneRequired = "Email or contact phone is required.";
+    }
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Controllers/HomeController.cs
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Controllers/HomeController.cs
@@ -0,0 +1,11 @@
+using Microsoft.AspNetCore.Mvc;
+
+namespace MVC_SimpleCRUD_Layered.Web.Controllers;
+
+public class HomeController : Controller
+{
+    public IActionResult Index()
+    {
+        return View();
+    }   
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Controllers/PeopleController.cs
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Controllers/PeopleController.cs
@@ -0,0 +1,168 @@
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.Rendering;
+using MVC_SimpleCRUD_Layered.Application.Models;
+using MVC_SimpleCRUD_Layered.Application.People;
+
+namespace MVC_SimpleCRUD_Layered.Web.Controllers;
+
+public class PeopleController : Controller
+{
+  private readonly IPeopleService peopleService;
+
+  public PeopleController(IPeopleService peopleService)
+  {
+    this.peopleService = peopleService;
+  }
+
+  public async Task<IActionResult> Index(int page = 1, int pageSize = 0, string? sorts = null, string? searchText = null)
+  {
+    PagedList<PersonInfo> model = await peopleService.GetPagedListAsync(new PeopleIndexRequest
+    {
+      Page = page,
+      PageSize = pageSize,
+      Sorts = sorts,
+      SearchText = searchText
+    });
+
+    return View(model);
+  }
+
+  [HttpGet]
+  public async Task<IActionResult> Create(int page = 1, int pageSize = 0, string? sorts = null, string? searchText = null)
+  {
+    var model = new PersonForm
+    {
+      Page = page,
+      PageSize = pageSize,
+      Sorts = sorts,
+      SearchText = searchText
+    };
+
+    await PrepareDropDownLists(model.CountryCode);
+    return View(model);
+  }
+
+  [HttpPost]
+  [ValidateAntiForgeryToken]
+  public async Task<IActionResult> Create(PersonForm model)
+  {
+    if (!ModelState.IsValid)
+    {
+      await PrepareDropDownLists(model.CountryCode);
+      return View(model);
+    }
+
+    var result = await peopleService.CreateAsync(model);
+    if (result.Success)
+    {
+      ShowToast($"Person {result.PersonName} added.");
+      return RedirectToIndex(model);
+    }
+
+    ModelState.AddModelError(string.Empty, result.ErrorMessage ?? "Person could not be saved.");
+    await PrepareDropDownLists(model.CountryCode);
+    return View(model);
+  }
+
+  [HttpGet]
+  public async Task<IActionResult> Edit(int id, int page = 1, int pageSize = 0, string? sorts = null, string? searchText = null)
+  {
+    var model = await peopleService.GetFormForEditAsync(id, new PeopleIndexRequest
+    {
+      Page = page,
+      PageSize = pageSize,
+      Sorts = sorts,
+      SearchText = searchText
+    });
+
+    if (model is null)
+    {
+      ShowToast($"Person with id {id} was not found.", Constants.ToastVariants.Danger, Constants.ToastTitles.Error);
+      return RedirectToAction(nameof(Index), new { page, pageSize, sorts, searchText });
+    }
+
+    await PrepareDropDownLists(model.CountryCode);
+    return View(model);
+  }
+
+  [HttpPost]
+  [ValidateAntiForgeryToken]
+  public async Task<IActionResult> Edit(int id, PersonForm model)
+  {
+    if (model.Id != id)
+    {
+      return BadRequest();
+    }
+
+    if (!ModelState.IsValid)
+    {
+      await PrepareDropDownLists(model.CountryCode);
+      return View(model);
+    }
+
+    var result = await peopleService.UpdateAsync(id, model);
+    if (result.Success)
+    {
+      ShowToast($"Person {result.PersonName} updated.");
+      return RedirectToIndex(model);
+    }
+
+    if (string.Equals(result.ErrorMessage, $"Person with id {id} was not found.", StringComparison.Ordinal))
+    {
+      ShowToast(result.ErrorMessage!, Constants.ToastVariants.Danger, Constants.ToastTitles.Error);
+      return RedirectToIndex(model);
+    }
+
+    ModelState.AddModelError(string.Empty, result.ErrorMessage ?? "Person could not be saved.");
+    await PrepareDropDownLists(model.CountryCode);
+    return View(model);
+  }
+
+  [HttpPost]
+  [ValidateAntiForgeryToken]
+  public async Task<IActionResult> Delete(int id, int page = 1, int pageSize = 0, string? sorts = null, string? searchText = null)
+  {
+    var result = await peopleService.DeleteAsync(id);
+
+    if (!result.Found)
+    {
+      ShowToast($"Person with id {id} was not found.", Constants.ToastVariants.Danger, Constants.ToastTitles.Error);
+      return RedirectToAction(nameof(Index), new { page, pageSize, sorts, searchText });
+    }
+
+    if (result.Success)
+    {
+      ShowToast($"Person {result.PersonName} deleted.");
+    }
+    else
+    {
+      ShowToast($"Person {result.PersonName} could not be deleted. {result.ErrorMessage}", Constants.ToastVariants.Danger, Constants.ToastTitles.Error);
+    }
+
+    return RedirectToAction(nameof(Index), new { page, pageSize, sorts, searchText });
+  }
+
+  private async Task PrepareDropDownLists(string? selectedCountryCode = null)
+  {
+    var countries = await peopleService.GetCountryOptionsAsync();
+    ViewBag.Countries = new SelectList(countries, nameof(CountryOption.Code), nameof(CountryOption.Name), selectedCountryCode);
+  }
+
+  private RedirectToActionResult RedirectToIndex(PersonForm model)
+  {
+    return RedirectToAction(nameof(Index), new
+    {
+      page = model.Page,
+      pageSize = model.PageSize,
+      sorts = model.Sorts,
+      searchText = model.SearchText
+    });
+  }
+
+  private void ShowToast(string message, string variant = Constants.ToastVariants.Success, string title = Constants.ToastTitles.Notification)
+  {
+    TempData[Constants.TempDataKeys.ToastMessage] = message;
+    TempData[Constants.TempDataKeys.ToastVariant] = variant;
+    TempData[Constants.TempDataKeys.ToastTitle] = title;
+  }
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Controllers/PeopleSimpleController.cs
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Controllers/PeopleSimpleController.cs
@@ -0,0 +1,20 @@
+using Microsoft.AspNetCore.Mvc;
+using MVC_SimpleCRUD_Layered.Application.People;
+
+namespace MVC_SimpleCRUD_Layered.Web.Controllers;
+
+public class PeopleSimpleController : Controller
+{
+  private readonly IPeopleService peopleService;
+
+  public PeopleSimpleController(IPeopleService peopleService)
+  {
+    this.peopleService = peopleService;
+  }
+
+  public async Task<IActionResult> Index()
+  {
+    var people = await peopleService.GetAllForSimpleListAsync();
+    return View(people);
+  }
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/MVC-SimpleCRUD-Layered.Web.csproj
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/MVC-SimpleCRUD-Layered.Web.csproj
@@ -0,0 +1,30 @@
+<Project Sdk="Microsoft.NET.Sdk.Web">
+
+  <PropertyGroup>
+    <TargetFramework>net10.0</TargetFramework>
+    <Nullable>enable</Nullable>
+    <ImplicitUsings>enable</ImplicitUsings>
+    <RootNamespace>MVC_SimpleCRUD_Layered.Web</RootNamespace>
+  </PropertyGroup>
+  
+  <PropertyGroup>
+    <UserSecretsId>PI</UserSecretsId>
+  </PropertyGroup>
+
+  <PropertyGroup Condition="'$(Configuration)|$(Platform)'=='Debug|AnyCPU'">
+    <DefineConstants>$(DefineConstants);MSSQL</DefineConstants>
+  </PropertyGroup>
+
+
+  <ItemGroup>
+    <PackageReference Include="Microsoft.Web.LibraryManager.Build" Version="3.0.71" />
+    <PackageReference Include="NLog.Web.AspNetCore" Version="6.1.2" />
+    <PackageReference Include="Sieve" Version="2.5.5" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <ProjectReference Include="..\MVC-SimpleCRUD-Layered.Application\MVC-SimpleCRUD-Layered.Application.csproj" />
+    <ProjectReference Include="..\MVC-SimpleCRUD-Layered.Data\MVC-SimpleCRUD-Layered.Data.csproj" />
+  </ItemGroup>
+
+</Project>
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Program.cs
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Program.cs
@@ -0,0 +1,62 @@
+#if POSTGRES
+using MVC_SimpleCRUD_Layered.Data.Data.Postgres;
+#else
+using MVC_SimpleCRUD_Layered.Data.Data.MSSQL;
+#endif
+using Microsoft.EntityFrameworkCore;
+using MVC_SimpleCRUD_Layered.Application.Models;
+using MVC_SimpleCRUD_Layered.Application.People;
+using MVC_SimpleCRUD_Layered.Web;
+using NLog;
+using NLog.Web;
+using Sieve.Services;
+
+var logger = NLog.LogManager.Setup().GetCurrentClassLogger();
+logger.Debug("init main");
+try
+{
+  var builder = WebApplication.CreateBuilder(args);
+  builder.Host.UseNLog(new NLogAspNetCoreOptions() { RemoveLoggerFactoryFilter = false });
+
+  #region Configure services
+  builder.Services.AddControllersWithViews();
+  builder.Services.Configure<PagingSettings>(builder.Configuration.GetSection(PagingSettings.SectionName));
+#if POSTGRES
+  builder.Services.AddDbContext<EventsContext>(options => options.UseNpgsql(builder.Configuration.GetConnectionString("EventsPostgres")));
+#else
+  builder.Services.AddDbContext<EventsContext>(options => options.UseSqlServer(builder.Configuration.GetConnectionString("EventsMssql")));
+#endif  
+  builder.Services.AddScoped<IPeopleService, PeopleService>();
+  builder.Services.AddScoped<ISieveProcessor, SieveProcessor>();
+  #endregion
+
+  var app = builder.Build();
+
+  #region configure middleware pipeline
+  //middleware order https://learn.microsoft.com/en-us/aspnet/core/fundamentals/middleware/#middleware-order
+
+  if (app.Environment.IsDevelopment())
+  {
+    app.UseDeveloperExceptionPage();
+  }
+
+  app.UseStaticFiles();
+
+  app.UseRouting();
+
+  app.MapDefaultControllerRoute();
+
+  #endregion
+  app.Run();
+}
+catch (Exception exception)
+{
+  // NLog: catch setup errors
+  logger.Error(exception, "Stopped program because of exception");
+  throw;
+}
+finally
+{
+  // Ensure to flush and stop internal timers/threads before application-exit (Avoid segmentation fault on Linux)
+  NLog.LogManager.Shutdown();
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Properties/launchSettings.json
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Properties/launchSettings.json
@@ -0,0 +1,14 @@
+{
+  "$schema": "http://json.schemastore.org/launchsettings.json",
+  "profiles": {
+    "MVC-SimpleCRUD-Layered.Web": {
+      "commandName": "Project",
+      "dotnetRunMessages": true,
+      "launchBrowser": true,
+      "applicationUrl": "https://localhost:7220",
+      "environmentVariables": {
+        "ASPNETCORE_ENVIRONMENT": "Development"
+      }
+    }
+  }
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Util/TagHelpers/PagerTagHelper.cs
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Util/TagHelpers/PagerTagHelper.cs
@@ -0,0 +1,128 @@
+
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.Rendering;
+using Microsoft.AspNetCore.Mvc.Routing;
+using Microsoft.AspNetCore.Mvc.ViewFeatures;
+using Microsoft.AspNetCore.Razor.TagHelpers;
+using Microsoft.Extensions.Options;
+using MVC_SimpleCRUD_Layered.Application.Models;
+
+namespace MVC_SimpleCRUD_Layered.Web.Util.TagHelpers;
+
+[HtmlTargetElement("pager", Attributes = "page-info,page-action")]
+public class PagerTagHelper : TagHelper
+{
+    private readonly IUrlHelperFactory urlHelperFactory;
+    private readonly PagingSettings pagingSettings;
+
+    public PagerTagHelper(IUrlHelperFactory urlHelperFactory, IOptions<PagingSettings> pagingSettings)
+    {
+        this.urlHelperFactory = urlHelperFactory;
+        this.pagingSettings = pagingSettings.Value;
+    }
+
+    [ViewContext]
+    [HtmlAttributeNotBound]
+    public ViewContext ViewContext { get; set; } = null!;
+
+    public PagingInfo PageInfo { get; set; } = new();
+
+    public string PageAction { get; set; } = string.Empty;
+
+    public string PageTitle { get; set; } = "Enter page number";
+
+    [HtmlAttributeName(DictionaryAttributePrefix = "page-route-")]
+    public Dictionary<string, string> PageRouteValues { get; set; } = [];
+
+    public override void Process(TagHelperContext context, TagHelperOutput output)
+    {
+        output.TagName = "nav";
+        output.Attributes.SetAttribute("aria-label", "Pager");
+
+        var paginationList = new TagBuilder("ul");
+        paginationList.AddCssClass("pagination");
+        paginationList.AddCssClass("mb-0");
+
+        var firstPageInRange = Math.Max(1, PageInfo.CurrentPage - pagingSettings.PageOffset);
+        var lastPageInRange = Math.Min(PageInfo.TotalPages, PageInfo.CurrentPage + pagingSettings.PageOffset);
+
+        if (firstPageInRange > 1)
+        {
+            paginationList.InnerHtml.AppendHtml(BuildListItemForPage(1, "1.."));
+        }
+
+        for (var page = firstPageInRange; page <= lastPageInRange; page++)
+        {
+            paginationList.InnerHtml.AppendHtml(
+                page == PageInfo.CurrentPage
+                    ? BuildListItemForCurrentPage(page)
+                    : BuildListItemForPage(page));
+        }
+
+        if (lastPageInRange < PageInfo.TotalPages)
+        {
+            paginationList.InnerHtml.AppendHtml(BuildListItemForPage(PageInfo.TotalPages, $"..{PageInfo.TotalPages}"));
+        }
+
+        output.Content.AppendHtml(paginationList);
+    }
+
+    private TagBuilder BuildListItemForPage(int page)
+    {
+        return BuildListItemForPage(page, page.ToString());
+    }
+
+    private TagBuilder BuildListItemForPage(int page, string text)
+    {
+        var urlHelper = urlHelperFactory.GetUrlHelper(ViewContext);
+        var url = urlHelper.Action(PageAction, BuildRouteValues(page)) ?? string.Empty;
+
+        var anchor = new TagBuilder("a");
+        anchor.InnerHtml.Append(text);
+        anchor.Attributes["href"] = url;
+        anchor.AddCssClass("page-link");
+
+        var listItem = new TagBuilder("li");
+        listItem.AddCssClass("page-item");
+        listItem.InnerHtml.AppendHtml(anchor);
+        return listItem;
+    }
+
+    private TagBuilder BuildListItemForCurrentPage(int page)
+    {
+        var urlHelper = urlHelperFactory.GetUrlHelper(ViewContext);
+        var urlTemplate = urlHelper.Action(PageAction, BuildRouteValues("__page__")) ?? string.Empty;
+
+        var input = new TagBuilder("input");
+        input.Attributes["type"] = "text";
+        input.Attributes["value"] = page.ToString();
+        input.Attributes["data-current"] = page.ToString();
+        input.Attributes["data-min"] = "1";
+        input.Attributes["data-max"] = PageInfo.TotalPages.ToString();
+        input.Attributes["data-url-template"] = urlTemplate;
+        input.Attributes["title"] = PageTitle;
+        input.AddCssClass("page-link");
+        input.AddCssClass("pagebox");
+
+        var listItem = new TagBuilder("li");
+        listItem.AddCssClass("page-item");
+        listItem.AddCssClass("active");
+        listItem.InnerHtml.AppendHtml(input);
+
+        return listItem;
+    }
+
+    private RouteValueDictionary BuildRouteValues(object pageValue)
+    {
+        var routeValues = new RouteValueDictionary(PageRouteValues.ToDictionary(kvp => kvp.Key, kvp => (object?)kvp.Value));
+        routeValues["page"] = pageValue;
+        routeValues["pageSize"] = PageInfo.ItemsPerPage;
+        routeValues["sorts"] = PageInfo.Sorts;
+        if (!string.IsNullOrWhiteSpace(PageInfo.SearchText))
+        {
+            routeValues["searchText"] = PageInfo.SearchText;
+        }
+
+        return routeValues;
+    }
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/Home/Index.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/Home/Index.cshtml
@@ -0,0 +1,10 @@
+@{
+    ViewData["Title"] = "Home";
+}
+
+<section class="card border-0 shadow-sm">
+    <div class="card-body p-4">
+        <h1 class="h3 mb-3">Events</h1>
+        <p class="mb-0">This sample demonstrates how to create a simple CRUD ASP.NET Core MVC application using data from Person table</p>
+    </div>
+</section>
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/People/Create.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/People/Create.cshtml
@@ -0,0 +1,15 @@
+@model PersonForm
+@{
+  ViewData["Title"] = "Add person";
+  ViewData["FormAction"] = "Create";
+}
+
+<div class="d-flex justify-content-between align-items-center mb-3">
+  <h2 class="h4 mb-0">Add person</h2>
+</div>
+
+<partial name="_PersonForm" model="Model" />
+
+@section Scripts {
+  <partial name="_ValidationScriptsPartial" />
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/People/Edit.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/People/Edit.cshtml
@@ -0,0 +1,15 @@
+@model PersonForm
+@{
+  ViewData["Title"] = "Edit person";
+  ViewData["FormAction"] = "Edit";
+}
+
+<div class="d-flex justify-content-between align-items-center mb-3">
+  <h2 class="h4 mb-0">Edit person</h2>
+</div>
+
+<partial name="_PersonForm" model="Model" />
+
+@section Scripts {
+  <partial name="_ValidationScriptsPartial" />
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/People/Index.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/People/Index.cshtml
@@ -0,0 +1,137 @@
+@using Microsoft.AspNetCore.Mvc.ViewFeatures
+@model PagedList<PersonInfo>
+@{
+  ViewData["Title"] = "People";
+}
+<h2>People list</h2>
+
+@{
+  (string PropertyName, string Title, bool Sortable)[] columns =
+  [
+    (nameof(PersonInfo.FirstNameTranscription), "First Name", true),
+    (nameof(PersonInfo.LastNameTranscription), "Last Name", true),
+    (nameof(PersonInfo.OriginalName), "Original Name", false),
+    (nameof(PersonInfo.BirthDate), "Birth Date", true),
+    (nameof(PersonInfo.CountryName), "Country Name", true)
+  ];
+
+  var personRowViewData = new ViewDataDictionary(ViewData)
+  {
+    { Constants.ViewDataKeys.PagingInfo, Model.PagingInfo }
+  };
+}
+
+
+<section class="card border-0 shadow-sm" id="people-list">
+  <div class="card-body">  
+    <form asp-action="Index" method="get"
+          class="d-flex justify-content-between align-items-start gap-3 flex-wrap flex-lg-nowrap mb-4">
+      <input type="hidden" name="page" value="1" />
+      <input type="hidden" name="pageSize" value="@Model.PagingInfo.ItemsPerPage" />
+      <input type="hidden" name="sorts" value="@Model.PagingInfo.Sorts" />
+
+      <div class="d-flex align-items-center gap-3 pt-2">
+        <h2 class="h5 mb-0">People list</h2>
+        <span class="badge text-bg-light">@(Model.PagingInfo.IsFiltered ? $"{Model.PagingInfo.FilteredItemsCount} / {Model.PagingInfo.TotalItemsCount}" : Model.PagingInfo.TotalItemsCount.ToString())</span>
+        <a asp-action="Create"
+           asp-route-page="@Model.PagingInfo.CurrentPage"
+           asp-route-pageSize="@Model.PagingInfo.ItemsPerPage"
+           asp-route-sorts="@Model.PagingInfo.Sorts"
+           asp-route-searchText="@Model.PagingInfo.SearchText"
+           class="btn btn-primary">
+          Add
+        </a>
+      </div>
+
+      <div class="d-flex align-items-center gap-2 flex-nowrap ms-auto">
+        <input id="searchText"
+               name="searchText"
+               value="@Model.PagingInfo.SearchText"
+               class="form-control"
+               placeholder="Search by country or full name"
+               aria-label="Filter by country or full name" />
+
+        <button type="submit" class="btn btn-outline-primary">Filter</button>
+        @if (Model.PagingInfo.IsFiltered)
+        {
+          <a asp-action="Index"
+             asp-route-page="1"
+             asp-route-pageSize="@Model.PagingInfo.ItemsPerPage"
+             asp-route-sorts="@Model.PagingInfo.Sorts"
+             class="btn btn-outline-secondary">
+            Clear
+          </a>
+        }
+      </div>
+    </form>
+
+    <div class="table-responsive">
+      <table class="table table-sm table-hover" id="table-people">
+        <thead>
+          <tr>
+            @foreach (var column in columns)
+            {
+              <th>
+                @if (column.Sortable)
+                {
+                  <a asp-action="Index"
+                     asp-route-page="@Model.PagingInfo.CurrentPage"
+                     asp-route-pageSize="@Model.PagingInfo.ItemsPerPage"
+                     asp-route-searchText="@Model.PagingInfo.SearchText"
+                     asp-route-sorts="@Model.PagingInfo.ToggleSort(column.PropertyName)"
+                     class="link-dark link-underline-opacity-0">
+                    @column.Title@(Model.PagingInfo.IsSortedBy(column.PropertyName) ? (Model.PagingInfo.IsDescending() ? " ?" : " ?") : "")
+                  </a>
+                }
+                else
+                {
+                  @column.Title
+                }
+              </th>
+            }
+            <th class="text-end"></th>
+          </tr>
+        </thead>
+        <tbody>
+          @if (Model.Data.Count == 0)
+          {
+            <tr>
+              <td colspan="6" class="text-body-secondary">No data to display.</td>
+            </tr>
+          }
+          else
+          {
+            @foreach (var person in Model.Data)
+            {
+              <partial name="_PersonRow" model="person" view-data="personRowViewData" />
+            }
+          }
+        </tbody>
+      </table>
+    </div>
+
+    <div class="d-flex justify-content-between align-items-center mt-4 gap-3 flex-wrap">
+      <div class="d-flex align-items-center gap-2 flex-wrap">
+        <small class="text-body-secondary">Page @Model.PagingInfo.CurrentPage of @Model.PagingInfo.TotalPages</small>
+        <form asp-action="Index" method="get" class="d-inline-flex align-items-center gap-2">
+          <input type="hidden" name="page" value="1" />
+          <input type="hidden" name="sorts" value="@Model.PagingInfo.Sorts" />
+          <input type="hidden" name="searchText" value="@Model.PagingInfo.SearchText" />
+          <select name="pageSize" class="form-select form-select-sm" style="width: auto;" aria-label="Items per page" onchange="this.form.requestSubmit()">
+            @{
+              int[] pageSizeOptions = [10, 20, 50, 100];
+            }
+            @foreach (var option in pageSizeOptions)
+            {
+              <option value="@option" selected="@(Model.PagingInfo.ItemsPerPage == option)">@option</option>
+            }
+          </select>
+        </form>
+      </div>
+      <pager page-info="@Model.PagingInfo"
+             page-action="Index"
+             page-title="Enter a page number and press Enter">
+      </pager>
+    </div>
+  </div>
+</section>
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/People/_PersonForm.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/People/_PersonForm.cshtml
@@ -0,0 +1,100 @@
+@using Microsoft.AspNetCore.Mvc.Rendering
+@model PersonForm
+
+@{
+  var formAction = ViewData["FormAction"]?.ToString() ?? "Create";
+  var countries = ViewBag.Countries as SelectList ?? new SelectList(Array.Empty<SelectListItem>());
+}
+
+<form asp-action="@formAction" asp-route-id="@Model.Id" method="post" class="card border-0 shadow-sm">
+  <div class="card-body">
+    <div asp-validation-summary="ModelOnly" class="text-danger mb-3"></div>
+
+    <input type="hidden" asp-for="Id" />
+    <input type="hidden" asp-for="Page" />
+    <input type="hidden" asp-for="PageSize" />
+    <input type="hidden" asp-for="Sorts" />
+    <input type="hidden" asp-for="SearchText" />
+
+    <div class="row g-3">
+      <div class="col-md-6">
+        <label asp-for="FirstNameTranscription" class="form-label"></label>
+        <input asp-for="FirstNameTranscription" class="form-control" />
+        <span asp-validation-for="FirstNameTranscription" class="text-danger"></span>
+      </div>
+      <div class="col-md-6">
+        <label asp-for="LastNameTranscription" class="form-label"></label>
+        <input asp-for="LastNameTranscription" class="form-control" />
+        <span asp-validation-for="LastNameTranscription" class="text-danger"></span>
+      </div>
+      <div class="col-md-6">
+        <label asp-for="FirstName" class="form-label"></label>
+        <input asp-for="FirstName" class="form-control" />
+        <span asp-validation-for="FirstName" class="text-danger"></span>
+      </div>
+      <div class="col-md-6">
+        <label asp-for="LastName" class="form-label"></label>
+        <input asp-for="LastName" class="form-control" />
+        <span asp-validation-for="LastName" class="text-danger"></span>
+      </div>
+      <div class="col-md-4">
+        <label asp-for="BirthDate" class="form-label"></label>
+        <input asp-for="BirthDate" type="date" class="form-control" />
+        <span asp-validation-for="BirthDate" class="text-danger"></span>
+      </div>
+      <div class="col-md-4">
+        <label asp-for="DocumentNumber" class="form-label"></label>
+        <input asp-for="DocumentNumber" class="form-control" />
+        <span asp-validation-for="DocumentNumber" class="text-danger"></span>
+      </div>
+      <div class="col-md-4">
+        <label asp-for="CountryCode" class="form-label"></label>
+        <select asp-for="CountryCode" asp-items="countries" class="form-select">
+          <option value="">Select country</option>
+        </select>
+        <span asp-validation-for="CountryCode" class="text-danger"></span>
+      </div>
+      <div class="col-md-6">
+        <label asp-for="Email" class="form-label"></label>
+        <input asp-for="Email" class="form-control" />
+        <span asp-validation-for="Email" class="text-danger"></span>
+      </div>
+      <div class="col-md-6">
+        <label asp-for="ContactPhone" class="form-label"></label>
+        <input asp-for="ContactPhone" class="form-control" />
+        <span asp-validation-for="ContactPhone" class="text-danger"></span>
+      </div>
+      <div class="col-md-6">
+        <label asp-for="AddressLine" class="form-label"></label>
+        <input asp-for="AddressLine" class="form-control" />
+        <span asp-validation-for="AddressLine" class="text-danger"></span>
+      </div>
+      <div class="col-md-3">
+        <label asp-for="PostalCode" class="form-label"></label>
+        <input asp-for="PostalCode" class="form-control" />
+        <span asp-validation-for="PostalCode" class="text-danger"></span>
+      </div>
+      <div class="col-md-3">
+        <label asp-for="City" class="form-label"></label>
+        <input asp-for="City" class="form-control" />
+        <span asp-validation-for="City" class="text-danger"></span>
+      </div>
+      <div class="col-md-6">
+        <label asp-for="AddressCountry" class="form-label"></label>
+        <input asp-for="AddressCountry" class="form-control" />
+        <span asp-validation-for="AddressCountry" class="text-danger"></span>
+      </div>
+    </div>
+  </div>
+  <div class="card-footer bg-white d-flex justify-content-end gap-2">
+    <a asp-action="Index"
+       asp-route-page="@Model.Page"
+       asp-route-pageSize="@Model.PageSize"
+       asp-route-sorts="@Model.Sorts"
+       asp-route-searchText="@Model.SearchText"
+       class="btn btn-outline-secondary">
+      Cancel
+    </a>
+    <button type="submit" class="btn btn-primary">Save</button>
+  </div>
+</form>
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/People/_PersonRow.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/People/_PersonRow.cshtml
@@ -0,0 +1,42 @@
+@model PersonInfo
+@{
+    var pagingInfo = ViewData[Constants.ViewDataKeys.PagingInfo] as PagingInfo ?? new PagingInfo();
+}
+
+<tr>    
+    <td>@Model.FirstNameTranscription</td>
+    <td>@Model.LastNameTranscription</td>            
+    <td>@Model.OriginalName</td>
+    <td>@Model.BirthDate.ToString("dd.MM.yyyy.")</td>
+    <td>@Model.CountryName</td>
+    <td class="text-end">
+        <div class="d-inline-flex gap-2">
+            <a
+                asp-action="Edit"
+                asp-route-id="@Model.Id"
+                asp-route-page="@pagingInfo.CurrentPage"
+                asp-route-pageSize="@pagingInfo.ItemsPerPage"
+                asp-route-sorts="@pagingInfo.Sorts"
+                asp-route-searchText="@pagingInfo.SearchText"
+                class="btn btn-sm btn-outline-primary"
+                >
+                Edit
+            </a>
+
+            <form
+                asp-action="Delete"
+                asp-route-id="@Model.Id"
+                method="post"
+                class="d-inline">
+                <input type="hidden" name="page" value="@pagingInfo.CurrentPage" />
+                <input type="hidden" name="pageSize" value="@pagingInfo.ItemsPerPage" />
+                <input type="hidden" name="sorts" value="@pagingInfo.Sorts" />
+                <input type="hidden" name="searchText" value="@pagingInfo.SearchText" />
+                <button type="submit"
+                        class="btn btn-sm btn-outline-danger delete">
+                    Delete
+                </button>
+            </form>
+        </div>
+    </td>
+</tr>
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/PeopleSimple/Index.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/PeopleSimple/Index.cshtml
@@ -0,0 +1,43 @@
+@model IEnumerable<PersonInfo>
+@{
+  ViewData["Title"] = "People";
+}
+<h2>People list</h2>
+
+<table class="table table-sm table-hover" id="table-people">
+  <thead>
+    <tr>
+      <th>First name</th>
+      <th>Last name</th>
+      <th>Original name</th>
+      <th>Birth date</th>
+      <th>Country</th>
+    </tr>
+  </thead>
+  <tbody>
+    @foreach (var person in Model)
+    {
+      <tr>
+        <td class="text-center">@person.FirstNameTranscription</td>
+        <td class="text-left">@person.LastNameTranscription</td>
+        <td class="text-center">@person.OriginalName</td>
+        <td class="text-center">@person.BirthDate.ToString("yyy-MM-dd")</td>
+        <td class="text-center">@person.CountryName</td>
+      </tr>
+    }
+  </tbody>
+</table>
+
+@section styles{
+  <link rel="stylesheet" href="https://cdn.datatables.net/2.3.7/css/dataTables.bootstrap5.min.css" />
+}
+
+@section scripts{
+  <script src="https://cdn.datatables.net/2.3.7/js/dataTables.min.js"></script>
+  <script src="https://cdn.datatables.net/2.3.7/js/dataTables.bootstrap5.min.js"></script>
+  <script>
+    $(function () {
+      new DataTable('#table-people');
+    });    
+  </script>
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/Shared/_Layout.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/Shared/_Layout.cshtml
@@ -0,0 +1,69 @@
+@using System.Text.Json
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>@ViewData["Title"] - Events</title>
+  <link rel="stylesheet" href="~/lib/bootstrap/css/bootstrap.min.css" />
+  <link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
+  @RenderSection("Styles", required: false)
+</head>
+<body class="bg-body-tertiary">
+  <header class="border-bottom bg-white shadow-sm">
+    <nav class="navbar navbar-expand-lg">
+      <div class="container">
+        <a class="navbar-brand fw-semibold" asp-controller="Home" asp-action="Index">Home</a>
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mainNav" aria-controls="mainNav" aria-expanded="false" aria-label="Toggle navigation">
+          <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="mainNav">
+          <ul class="navbar-nav ms-auto gap-lg-2">
+            <li class="nav-item">
+              <a class="nav-link" asp-controller="Home" asp-action="Index">Home</a>
+            </li>
+            <li class="nav-item">
+              <a class="nav-link" asp-controller="PeopleSimple" asp-action="Index">People (simple version)</a>
+            </li>
+            <li class="nav-item">
+              <a class="nav-link" asp-controller="People" asp-action="Index">People</a>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </nav>
+  </header>
+
+  <main class="container py-4">
+    @RenderBody()
+  </main>
+
+  <div class="toast-container position-fixed top-0 end-0 p-3">
+    <div id="app-toast" class="toast border-0 shadow-sm" role="status" aria-live="polite" aria-atomic="true">
+      <div id="app-toast-header" class="toast-header">
+        <strong id="app-toast-title" class="me-auto">Notification</strong>
+        <button type="button" class="btn-close btn-close-white" data-bs-dismiss="toast" aria-label="Close"></button>
+      </div>
+      <div id="app-toast-body" class="toast-body"></div>
+    </div>
+  </div>
+
+  <script src="~/lib/jquery/jquery.min.js"></script>
+  <script src="~/lib/bootstrap/js/bootstrap.bundle.min.js"></script>
+  <script src="~/js/site.js" asp-append-version="true"></script>
+  <script src="~/js/pager.js" asp-append-version="true"></script>
+  <script>             
+      @if (TempData[Constants.TempDataKeys.ToastMessage] is string toastMessage)
+      {
+            var initialToastJson = JsonSerializer.Serialize(new
+            {
+                  variant = TempData[Constants.TempDataKeys.ToastVariant] as string ?? Constants.ToastVariants.Success,
+                  title = TempData[Constants.TempDataKeys.ToastTitle] as string ?? Constants.ToastTitles.Notification,
+                  message = toastMessage
+            });
+            @:showAppToast(@Html.Raw(initialToastJson));
+      }
+  </script>
+  @RenderSection("Scripts", required: false)
+</body>
+</html>
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/Shared/_ValidationScriptsPartial.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/Shared/_ValidationScriptsPartial.cshtml
@@ -0,0 +1,2 @@
+<script src="~/lib/jquery-validate/jquery.validate.min.js"></script>
+<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/_ViewImports.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/_ViewImports.cshtml
@@ -0,0 +1,5 @@
+@using MVC_SimpleCRUD_Layered.Application.Models
+@using MVC_SimpleCRUD_Layered.Application.People
+@using MVC_SimpleCRUD_Layered.Web
+@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
+@addTagHelper *, MVC-SimpleCRUD-Layered.Web
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/_ViewStart.cshtml
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/Views/_ViewStart.cshtml
@@ -0,0 +1,3 @@
+@{
+    Layout = "_Layout";
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/appsettings.Development.json
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/appsettings.Development.json
@@ -0,0 +1,8 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  }
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/appsettings.json
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/appsettings.json
@@ -0,0 +1,17 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  },
+  "AllowedHosts": "*",
+  "Paging": {
+    "PageSize": 10,
+    "PageOffset": 5
+  },
+  "ConnectionStrings": {
+    "EventsMssql": "Data Source=.,3030;Initial Catalog=Events;User Id=************;Password=**********;TrustServerCertificate=True",
+    "EventsPostgres": "Host=localhost;Port=5432;Database=events;Username=***********;Password=**************;Persist Security Info=True"
+  }
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/libman.json
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/libman.json
@@ -0,0 +1,32 @@
+{
+  "version": "1.0",
+  "defaultProvider": "cdnjs",
+  "libraries": [
+    {
+      "library": "bootstrap@5.3.8",
+      "destination": "wwwroot/lib/bootstrap/",
+      "files": [
+        "css/bootstrap.min.css",
+        "js/bootstrap.bundle.min.js"
+      ]
+    },
+    {
+      "library": "jquery@3.7.1",
+      "destination": "wwwroot/lib/jquery/"
+    },
+    {
+      "library": "jquery-validate@1.21.0",
+      "destination": "wwwroot/lib/jquery-validate/",
+      "files": [
+        "jquery.validate.min.js"
+      ]
+    },
+    {
+      "library": "jquery-validation-unobtrusive@4.0.0",
+      "destination": "wwwroot/lib/jquery-validation-unobtrusive/",
+      "files": [
+        "jquery.validate.unobtrusive.min.js"
+      ]
+    }
+  ]
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/wwwroot/css/site.css
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/wwwroot/css/site.css
@@ -0,0 +1,16 @@
+main {
+  padding-left: 50px;
+  padding-right: 50px;
+}
+
+.validation-summary-errors { font-weight: bold; color:#a94442;}
+.validation-summary-valid { display: none;}
+.input-validation-error{
+    border-color:red;
+}
+.pagebox {
+    width: 45px;           
+}
+.pagebox::selection{
+    background-color:grey;
+}
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/wwwroot/js/pager.js
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/wwwroot/js/pager.js
@@ -0,0 +1,48 @@
+(function () {
+    function validRange(value, min, max) {
+        if (!/^\d+$/.test(value)) {
+            return false;
+        }
+
+        var page = parseInt(value, 10);
+        return page >= min && page <= max;
+    }
+
+    function goToPage(input) {
+        var value = input.value.trim();
+        var min = parseInt(input.dataset.min, 10);
+        var max = parseInt(input.dataset.max, 10);
+
+        if (!validRange(value, min, max)) {
+            input.value = input.dataset.current || "";
+            return;
+        }
+
+        var url = (input.dataset.urlTemplate || "").replace("__page__", value);
+        if (!url) {
+            return;
+        }
+
+        window.location.href = url;
+    }
+
+    document.addEventListener("focusin", function (event) {
+        if (event.target.matches(".pagebox")) {
+            event.target.select();
+        }
+    });
+
+    document.addEventListener("keydown", function (event) {
+        if (!event.target.matches(".pagebox")) {
+            return;
+        }
+
+        if (event.key === "Enter") {
+            event.preventDefault();
+            goToPage(event.target);
+        }
+        else if (event.key === "Escape") {
+            event.target.value = event.target.dataset.current || "";
+        }
+    });
+})();
--- a/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/wwwroot/js/site.js
+++ b/MVC-SimpleCRUD-Layered/MVC-SimpleCRUD-Layered.Web/wwwroot/js/site.js
@@ -0,0 +1,30 @@
+$(function () {
+  $(document).on('click', '.delete', function (event) {
+    if (!confirm("Delete entry?")) {
+      event.preventDefault();
+    }
+  });
+});
+
+function showAppToast(options) {
+  var toastOptions = options || {};
+  var variant = toastOptions.variant || "success";
+  var title = toastOptions.title || "Notification";
+  var message = toastOptions.message || "";
+  var toast = document.getElementById("app-toast");
+  var header = document.getElementById("app-toast-header");
+  var titleElement = document.getElementById("app-toast-title");
+  var body = document.getElementById("app-toast-body");
+
+  if (!toast || !header || !titleElement || !body) {
+    return;
+  }
+
+  toast.className = "toast border-0 shadow-sm";
+  header.className = "toast-header text-bg-" + variant;
+  titleElement.textContent = title;
+  body.textContent = message;
+
+  var bootstrapToast = new bootstrap.Toast(toast);
+  bootstrapToast.show();
+}