ui tweaks/improvements including recent players and ip info lookup

2022-04-21 12:39:09 -05:00 · 2022-04-21 12:39:09 -05:00 · 284c2e9726
commit 284c2e9726
parent fd049edb3f
21 changed files with 422 additions and 325 deletions
--- a/SharedLibraryCore/Dtos/ClientInfo.cs
+++ b/SharedLibraryCore/Dtos/ClientInfo.cs
@ -10,5 +10,6 @@ namespace SharedLibraryCore.Dtos
        public int LinkId { get; set; }
        public EFClient.Permission Level { get; set; }
        public DateTime LastConnection { get; set; }
+        public bool IsMasked { get; set; }
    }
 }
--- a/SharedLibraryCore/Dtos/ServerInfo.cs
+++ b/SharedLibraryCore/Dtos/ServerInfo.cs
@ -15,6 +15,7 @@ namespace SharedLibraryCore.Dtos
        public int MaxClients { get; set; }
        public List<ChatInfo> ChatHistory { get; set; }
        public List<PlayerInfo> Players { get; set; }
+        public List<Report> Reports { get; set; }
        public ClientHistoryInfo ClientHistory { get; set; }
        public long ID { get; set; }
        public bool Online { get; set; }
--- a/SharedLibraryCore/Services/ClientService.cs
+++ b/SharedLibraryCore/Services/ClientService.cs
@ -47,13 +47,15 @@ namespace SharedLibraryCore.Services
        private readonly ApplicationConfiguration _appConfig;
        private readonly IDatabaseContextFactory _contextFactory;
        private readonly ILogger _logger;
+        private readonly IGeoLocationService _geoLocationService;

        public ClientService(ILogger<ClientService> logger, IDatabaseContextFactory databaseContextFactory,
-            ApplicationConfiguration appConfig)
+            ApplicationConfiguration appConfig, IGeoLocationService geoLocationService)
        {
            _contextFactory = databaseContextFactory;
            _logger = logger;
            _appConfig = appConfig;
+            _geoLocationService = geoLocationService;
        }

        public async Task<EFClient> Create(EFClient entity)
@ -782,7 +784,8 @@ namespace SharedLibraryCore.Services
                    Password = client.Password,
                    PasswordSalt = client.PasswordSalt,
                    NetworkId = client.NetworkId,
-                    LastConnection = client.LastConnection
+                    LastConnection = client.LastConnection,
+                    Masked = client.Masked
                };

            return await iqClients.ToListAsync();
@ -901,18 +904,24 @@ namespace SharedLibraryCore.Services

            await using var context = _contextFactory.CreateContext(false);
            var iqClients = context.Clients
-                .Where(_client => _client.CurrentAlias.IPAddress != null)
-                .Where(_client => _client.FirstConnection >= startOfPeriod)
-                .OrderByDescending(_client => _client.FirstConnection)
-                .Select(_client => new PlayerInfo
+                .Where(client => client.CurrentAlias.IPAddress != null)
+                .Where(client => client.FirstConnection >= startOfPeriod)
+                .OrderByDescending(client => client.FirstConnection)
+                .Select(client => new PlayerInfo
                {
-                    ClientId = _client.ClientId,
-                    Name = _client.CurrentAlias.Name,
-                    IPAddress = _client.CurrentAlias.IPAddress.ConvertIPtoString(),
-                    LastConnection = _client.FirstConnection
+                    ClientId = client.ClientId,
+                    Name = client.CurrentAlias.Name,
+                    IPAddress = client.CurrentAlias.IPAddress.ConvertIPtoString(),
+                    LastConnection = client.FirstConnection
                });

-            return await iqClients.ToListAsync();
+            var clientList = await iqClients.ToListAsync();
+            foreach (var client in clientList)
+            {
+                client.GeoLocationInfo = await _geoLocationService.Locate(client.IPAddress);
+            }
+
+            return clientList;
        }

        #endregion
--- a/WebfrontCore/Controllers/ActionController.cs
+++ b/WebfrontCore/Controllers/ActionController.cs
@ -9,6 +9,7 @@ using Microsoft.AspNetCore.Mvc;
 using SharedLibraryCore;
 using SharedLibraryCore.Commands;
 using SharedLibraryCore.Configuration;
+using SharedLibraryCore.Dtos;
 using SharedLibraryCore.Interfaces;
 using WebfrontCore.Permissions;
 using WebfrontCore.ViewModels;
@ -317,15 +318,19 @@ namespace WebfrontCore.Controllers
        public async Task<IActionResult> RecentClientsForm()
        {
            var clients = await Manager.GetClientService().GetRecentClients();
-            foreach (var client in clients)
-            {
-                client.IPAddress =
-                    _appConfig.HasPermission(Client.Level, WebfrontEntity.ClientIPAddress, WebfrontPermission.Read)
-                        ? client.IPAddress
-                        : null;
+            return View("~/Views/Shared/Components/Client/_RecentClients.cshtml", clients);
        }

-            return View("~/Views/Shared/Components/Client/_RecentClients.cshtml", clients);
+        public IActionResult RecentReportsForm()
+        {
+            var serverInfo = Manager.GetServers().Select(server =>
+                new ServerInfo
+                {
+                    Name = server.Hostname,
+                    Reports = server.Reports
+                });
+
+            return View("Partials/_Reports", serverInfo);
        }

        public IActionResult FlagForm()
--- a/WebfrontCore/Controllers/Client/ClientController.cs
+++ b/WebfrontCore/Controllers/Client/ClientController.cs
@ -176,11 +176,12 @@ namespace WebfrontCore.Controllers
                    adminsDict.Add(admin.Level, new List<ClientInfo>());
                }

-                adminsDict[admin.Level].Add(new ClientInfo()
+                adminsDict[admin.Level].Add(new ClientInfo
                {
                    Name = admin.Name,
                    ClientId = admin.ClientId,
-                    LastConnection = admin.LastConnection
+                    LastConnection = admin.LastConnection,
+                    IsMasked = admin.Masked
                });
            }

--- a/WebfrontCore/Views/Client/Find/Index.cshtml
+++ b/WebfrontCore/Views/Client/Find/Index.cshtml
@ -5,7 +5,8 @@

 <!-- desktop -->
 <div class="content mt-0">
-    <h2 class="content-title mt-20">@ViewBag.ResultCount result(s) for <span class="badge badge-primary font-size-18">@ViewBag.SearchTerm</span></h2>
+    <h2 class="content-title mt-20 mb-0">Search Results</h2>
+    <div class="text-muted mb-15"><span class="badge">@ViewBag.SearchTerm</span> returned <span class="text-primary">@ViewBag.ResultCount</span> matche(s)</div>

    <table class="table d-none d-md-table">
        <thead>
--- a/WebfrontCore/Views/Client/Message/Find.cshtml
+++ b/WebfrontCore/Views/Client/Message/Find.cshtml
@ -9,7 +9,8 @@

 else
 {
-    <h2 class="content-title mt-20">@Html.Raw(Utilities.FormatExt(ViewBag.Localization["WEBFRONT_STATS_MESSAGES_FOUND"], $"<span class=\"badge badge-primary font-size-18\">{Model.TotalResultCount.ToString("N0")}</span>"))</h2>
+    <h2 class="content-title mt-20 mb-0">Search Results</h2>
+    <div class="text-muted mb-15">@Html.Raw(Utilities.FormatExt(ViewBag.Localization["WEBFRONT_STATS_MESSAGES_FOUND"], $"<span class=\"badge\">{Model.TotalResultCount.ToString("N0")}</span>"))</div>

    <table class="table bg-dark-dm bg-light-lm rounded" style="table-layout: fixed">
        <thead class="d-none d-lg-table-header-group">
--- a/WebfrontCore/Views/Client/Privileged/Index.cshtml
+++ b/WebfrontCore/Views/Client/Privileged/Index.cshtml
@ -1,7 +1,8 @@
-@model Dictionary<SharedLibraryCore.Database.Models.EFClient.Permission, IList<SharedLibraryCore.Dtos.ClientInfo>>
+@model Dictionary<Data.Models.Client.EFClient.Permission, IList<SharedLibraryCore.Dtos.ClientInfo>>
 <div class="content mt-0">
    <h4 class="content-title mt-20">@ViewBag.Title</h4>

+
    @foreach (var key in Model.Keys)
    {
        <table class="table mb-20">
@ -12,10 +13,22 @@
            </tr>
            </thead>
            <tbody>
+            <has-permission entity="ClientLevel" required-permission="Read">
                @foreach (var client in Model[key].OrderByDescending(client => client.LastConnection))
                {
+                    if (!ViewBag.Authorized && client.IsMasked)
+                    {
+                        continue;
+                    }
                    <tr class="bg-dark-dm bg-light-lm">
                        <td>
+                            @if (client.IsMasked)
+                            {
+                                <span data-toggle="tooltip" data-title="Client is masked">
+                                    <span class="oi oi-shield mr-5 font-size-12"></span>
+                                </span>
+                            }
+                            
                            <a asp-controller="Client" asp-action="Profile" asp-route-id="@client.ClientId">
                                <color-code value="@client.Name"></color-code>
                            </a>
@ -25,7 +38,9 @@
                        </td>
                    </tr>
                }
+            </has-permission>
            </tbody>
        </table>
    }
+
 </div>
--- a/WebfrontCore/Views/Client/Profile/Index.cshtml
+++ b/WebfrontCore/Views/Client/Profile/Index.cshtml
@ -70,9 +70,9 @@
    }

    <!-- main profile row -->
-        <div class="card p-20 ml-0 mr-0 mt-0 mb-10 d-flex flex-fill flex-wrap flex-column flex-md-row justify-content-center">
-            <div class="d-flex flex-column flex-md-row">
-                <div id="profile_avatar" class="w-150 w-md-100 h-150 h-md-100 mt-10 mb-10 d-flex justify-content-center align-self-center rounded @ClassForProfileBackground() @(isTempBanned ? "penalties-bgcolor-tempban" : "")" style="background-image:url('@($"https://gravatar.com/avatar/{gravatarUrl}?size=168&default=blank&rating=pg")">
+    <div class="card p-15 ml-0 mr-0 mt-0 mb-10 d-flex flex-fill flex-wrap flex-column flex-md-row justify-content-center">
+        <div class="pl-5 pr-5 d-flex flex-column flex-md-row">
+            <div id="profile_avatar" class="w-150 w-md-100 h-150 h-md-100 mt-5 mb-5 d-flex justify-content-center align-self-center rounded @ClassForProfileBackground() @(isTempBanned ? "penalties-bgcolor-tempban" : "")" style="background-image:url('@($"https://gravatar.com/avatar/{gravatarUrl}?size=168&default=blank&rating=pg")">
                @if (string.IsNullOrEmpty(gravatarUrl))
                {
                    <div class="profile-shortcode align-self-center text-dark-lm">@shortCode</div>
@ -85,7 +85,7 @@
                        <color-code value="@Model.Name"></color-code>
                    </span>
                    <has-permission entity="MetaAliasUpdate" required-permission="Read">
-                            <div class="dropdown dropright with-arrow">
+                        <div class="dropdown with-arrow">
                            <div data-toggle="dropdown" id="profileAliasHistory" aria-haspopup="true" aria-expanded="false">
                                @if (Model.Aliases.Any())
                                {
@ -93,10 +93,10 @@
                                }
                            </div>

-                                <div class="dropdown-menu @(Model.Aliases.Where(alias => !alias.Item1.Contains(" ")).Max(alias => (int?)alias.Item1.Length) >= 15 ? "w-250" : "") " aria-labelledby="profileAliasHistory">
+                            <div class="dropdown-menu dropdown-menu-center @(Model.Aliases.Where(alias => !alias.Item1.Contains(" ")).Max(alias => (int?)alias.Item1.Length) >= 15 ? "w-250" : "")" aria-labelledby="profileAliasHistory">
                                @foreach (var (alias, dateAdded) in Model.Aliases.OrderByDescending(alias => alias.Item2).Take(15))
                                {
-                                        <a asp-controller="Client" asp-action="Find" asp-route-clientName="@alias" class="dropdown-item" data-toggle="tooltip" data-title="@dateAdded.HumanizeForCurrentCulture()">
+                                    <a asp-controller="Client" asp-action="Find" asp-route-clientName="@alias.StripColors()" class="dropdown-item" data-toggle="tooltip" data-title="@dateAdded.HumanizeForCurrentCulture()">
                                        <i class="oi oi-magnifying-glass text-muted mr-5"></i>
                                        <color-code value="@alias"></color-code>
                                    </a>
@ -137,20 +137,28 @@
                <div class="align-self-center align-self-md-start d-flex flex-row">
                    <span class="text-muted mr-5">@Model.IPAddress</span>
                    <has-permission entity="MetaAliasUpdate" required-permission="Read">
-                            <div class="dropdown dropright with-arrow">
+                        <div class="dropdown with-arrow">
                            <div data-toggle="dropdown" id="profileIPAddressHistory" aria-haspopup="true" aria-expanded="false">
                                @if (Model.IPs.Any(ip => !string.IsNullOrEmpty(ip.Item1)))
                                {
-                                        <i class="oi oi-caret-bottom font-size-12" aria-hidden="true"></i>
+                                    <i class="oi oi-caret-bottom font-size-12 text-muted" aria-hidden="true"></i>
                                }
                            </div>
-                                <div class="dropdown-menu" aria-labelledby="profileAliasHistory">
+                            <div class="dropdown-menu dropdown-menu-center" aria-labelledby="profileAliasHistory">
                                @foreach (var (ip, dateAdded) in Model.IPs.OrderByDescending(ip => ip.Item2).Take(15))
                                {
-                                        <a asp-controller="Client" asp-action="Find" asp-route-clientName="@ip" class="dropdown-item" data-toggle="tooltip" data-title="@dateAdded.HumanizeForCurrentCulture()">
+                                    if (string.IsNullOrEmpty(ip))
+                                    {
+                                        continue;
+                                    }
+                                    <div class="d-flex dropdown-item" data-toggle="tooltip" data-title="@dateAdded.HumanizeForCurrentCulture()">
+                                        <a asp-controller="Client" asp-action="Find" asp-route-clientName="@ip">
                                            <i class="oi oi-magnifying-glass text-muted mr-5"></i>
+                                        </a>
+                                        <a href="#contextModal" class="profile-ip-lookup dropdown-item p-0 m-0" data-ip="@ip">
                                            <color-code value="@ip"></color-code>
                                        </a>
+                                    </div>
                                }
                                @if (Model.IPs.Count > 15)
                                {
@ -166,11 +174,11 @@

        <div class="flex-fill d-flex justify-content-center justify-content-md-end mt-10 mt-md-0">
            <!-- country flag -->
-                <div id="ipGeoDropdown" class="dropdown dropleft with-arrow align-self-center">
+            <div id="ipGeoDropdown" class="dropdown with-arrow align-self-center">
                <a href="#" data-toggle="dropdown" id="avatar-popover-toggle" aria-haspopup="true" aria-expanded="false">
                    @if (!string.IsNullOrEmpty(Model.GeoLocationInfo.CountryCode))
                    {
-                            <div class="ip-lookup-profile w-100 rounded align-self-center" style="height:5rem;background-image: url('https://flagcdn.com/w80/@(Model.GeoLocationInfo.CountryCode.ToLower()).png')" data-ip="@Model.IPAddress"></div>
+                        <div class="profile-country-flag w-100 rounded align-self-center" style="background-image: url('https://flagcdn.com/w160/@(Model.GeoLocationInfo.CountryCode.ToLower()).png')" data-ip="@Model.IPAddress"></div>
                    }
                </a>
                <div class="dropdown-menu dropdown-menu-center z-30" aria-labelledby="avatar-popover-toggle">
@ -192,18 +200,22 @@
                </div>
            </div>
        </div>
-        </div>
-    </div>
        
+        <div>
+            <hr class="mr-5 ml-5"/>
            <!-- meta info block -->
            <div class="d-flex flex-column flex-md-row text-center text-md-left flex-wrap">
                <partial name="Meta/_Information.cshtml" model="@Model.Meta"/>
            </div>
+        </div>
+    </div>
+</div>
+

 <hr class="mt-10 mb-10"/>

 <!-- meta filter list -->
-    <div class="mb-10 mt-10">
+<div class="mb-10 mt-15">
    @foreach (var type in Enum.GetValues(typeof(MetaType)).Cast<MetaType>().Where(meta => !ignoredMetaTypes.Contains(meta)).OrderByDescending(meta => meta == MetaType.All))
    {
        var buttonClass = !Model.MetaFilterType.HasValue && type == MetaType.All || Model.MetaFilterType.HasValue && Model.MetaFilterType.Value.ToString() == type.ToString() ? "btn-primary text-light" : "text-muted";
--- a/WebfrontCore/Views/Client/Profile/Meta/_Information.cshtml
+++ b/WebfrontCore/Views/Client/Profile/Meta/_Information.cshtml
@ -1,4 +1,5 @@
-@model IEnumerable<SharedLibraryCore.Dtos.Meta.Responses.InformationResponse>
+@using Humanizer
+@model IEnumerable<SharedLibraryCore.Dtos.Meta.Responses.InformationResponse>
@{
    var informationMeta = Model
        .Where(meta => meta.Type == SharedLibraryCore.Interfaces.MetaType.Information)
@ -7,12 +8,13 @@
        .GroupBy(meta => meta.index / 5);
 }

+<div class="d-flex flex-wrap">
@foreach (var metaColumn in informationMeta)
 {
-    <div class="mr-20">
+  <!--  <div class="mr-20"> -->
        @foreach (var meta in metaColumn)
        {
-            <div class="profile-meta-entry font-size-12" data-toggle="@(!string.IsNullOrEmpty(meta.meta.ToolTipText) ? "tooltip" : "")" data-title="@meta.meta.ToolTipText" data-placement="bottom">
+            <div class="m-md-5 p-15 w-half rounded bg-very-dark-dm bg-light-ex-lm profile-meta-entry font-size-12  w-md-100 w-lg-150" data-toggle="@(!string.IsNullOrEmpty(meta.meta.ToolTipText) ? "tooltip" : "")" data-title="@meta.meta.ToolTipText" data-placement="bottom">

                @{var results = Utilities.SplitTranslationTokens(meta.meta.Key);}

@ -22,22 +24,23 @@
                    {
                        if (result.IsInterpolation)
                        {
-                            <span class="profile-meta-value text-primary"><color-code value="@meta.meta.Value"></color-code></span>
+                            <div class="profile-meta-value text-primary font-size-14"><color-code value="@meta.meta.Value"></color-code></div>
                        }

                        else
                        {
-                            <span class="profile-meta-title text-muted">@result.MatchValue</span>
+                            <span class="profile-meta-title text-muted font-size-12">@result.MatchValue.Titleize()</span>
                        }
                    }
                }

                else
                {
-                    <span class="profile-meta-value text-primary"><color-code value="@meta.meta.Value"></color-code></span>
-                    <span class="profile-meta-title text-muted">@meta.meta.Key</span>
+                    <div class="profile-meta-value text-primary font-size-14"><color-code value="@meta.meta.Value"></color-code></div>
+                    <div class="profile-meta-title text-muted font-size-12">@meta.meta.Key.Titleize()</div>
                }
            </div>
        }
-    </div>
+  <!--  </div> -->
 }
+</div>
--- a/WebfrontCore/Views/Client/Profile/Meta/_ReceivedPenaltyResponse.cshtml
+++ b/WebfrontCore/Views/Client/Profile/Meta/_ReceivedPenaltyResponse.cshtml
@ -32,7 +32,7 @@

                else if (match.MatchValue == "reason")
                {
-                    <span class="text-light-dm text-dark-lm">
+                    <span class="text-white-dm text-black-lm">
                        @if (ViewBag.Authorized && !string.IsNullOrEmpty(Model.AutomatedOffense) && Model.PenaltyType != Data.Models.EFPenalty.PenaltyType.Warning && Model.PenaltyType != Data.Models.EFPenalty.PenaltyType.Kick)
                        {
                            <span>@Utilities.FormatExt(ViewBag.Localization["WEBFRONT_PROFILE_ANTICHEAT_DETECTION"], Model.AutomatedOffense)</span>
--- a/WebfrontCore/Views/Penalty/PenaltyInfoList.cshtml
+++ b/WebfrontCore/Views/Penalty/PenaltyInfoList.cshtml
@ -1,10 +1,15 @@
@{ 
    Layout = null;
+    
+    bool CanSeeLevel(PenaltyInfo penalty) => (ViewBag.PermissionsSet as IEnumerable<string>).HasPermission(WebfrontEntity.ClientLevel, WebfrontPermission.Read) && penalty.PenaltyType == EFPenalty.PenaltyType.Report;
 }
+@using WebfrontCore.Permissions
+@using SharedLibraryCore.Dtos
+@using Data.Models
@model IList<SharedLibraryCore.Dtos.PenaltyInfo>

@{
-    foreach (var penalty in Model)
+    foreach (var penalty in Model.Where(CanSeeLevel))
    {
        await Html.RenderPartialAsync("_Penalty", penalty);
    }
--- a/WebfrontCore/Views/Shared/Components/Client/_RecentClients.cshtml
+++ b/WebfrontCore/Views/Shared/Components/Client/_RecentClients.cshtml
@ -1,52 +1,33 @@
@model IEnumerable<SharedLibraryCore.Dtos.PlayerInfo>
@{
    Layout = null;
-    var loc = SharedLibraryCore.Utilities.CurrentLocalization.LocalizationIndex;
 }

-
-@*<table class="table table-striped">
-        <thead>
-            <tr class="bg-primary pt-2 pb-2">
-                <th scope="col">@loc["WEBFRONT_PENALTY_TEMPLATE_NAME"]</th>
-                <th scope="col">@loc["WEBFRONT_CONFIGURATION_SERVER_IP"]</th>
-                <th scope="col">@loc["WEBFRONT_PROFILE_LOOKUP_LOCATION"]</th>
-                <th scope="col" class="text-right">@loc["WEBFRONT_SEARCH_LAST_CONNECTED"]</th>
-            </tr>
-        </thead>
+<div class="mb-15 text-center font-weight-lighter">New clients connected in the last <span class="text-primary">24</span> hours</div>

@foreach (var client in Model)
 {
-            <tr>
-                <td class="w-25">
-                    <a asp-controller="Client" asp-action="Profile" asp-route-id="@client.ClientId" class="link-inverse">@client.Name</a>
-                </td>
-                <td class="w-25">
-                    @client.IPAddress
-                </td>
-                <td>
-                    <div class="client-location-flag" data-ip="@client.IPAddress" />
-                </td>
-                <td class="text-right">
-                    @client.LastConnectionText
-                </td>
-            </tr>
-
-        }
-    </table>*@
-
-@foreach (var client in Model)
-{
-    <div class="p-2 mb-3 border-bottom" style="background-color: #222;">
+    <div class="bg-very-dark-dm bg-light-ex-lm p-15 rounded mb-10">
        <div class="d-flex flex-row">
            <a asp-controller="Client" asp-action="Profile" asp-route-id="@client.ClientId" class="h4 mr-auto">
                <color-code value="@client.Name"></color-code>
            </a>
-            <div class="client-location-flag align-self-center" data-ip="@client.IPAddress"></div>
-        </div>
-        <div class="d-flex flex-row">
-            <div class="align-self-center  mr-auto">@client.IPAddress</div>
-            <div class="align-self-center">@client.LastConnectionText</div>
-        </div>
+            @if (client.GeoLocationInfo is not null)
+            {
+                @if (!string.IsNullOrEmpty(client.GeoLocationInfo.CountryCode))
+                {
+                    <div data-toggle="tooltip" data-title="@client.GeoLocationInfo.Country">
+                        <div class="rounded" style="width: 40px; height: 25.66px; background-repeat: no-repeat; background-position: center center; background-image: url('https://flagcdn.com/w40/@(client.GeoLocationInfo.CountryCode.ToLower()).png')"></div>
+                    </div>
+                }
+            }
+        </div>
+        <div class="d-flex flex-row">
+            <has-permission entity="ClientIPAddress" required-permission="Read">
+                <div class="align-self-center mr-auto">@client.IPAddress</div>
+            </has-permission>
+            <div class="align-self-center text-muted font-size-12">@client.LastConnection.HumanizeForCurrentCulture()</div>
+        </div>
+
    </div>
 }
--- a/WebfrontCore/Views/Shared/Partials/_Reports.cshtml
+++ b/WebfrontCore/Views/Shared/Partials/_Reports.cshtml
@ -0,0 +1,39 @@
+@using Data.Models
+@using SharedLibraryCore.Dtos.Meta.Responses
+@model IEnumerable<SharedLibraryCore.Dtos.ServerInfo>
+@{
+    Layout = null;
+}
+<div class="content-title">Recent Reports</div>
+<div class="text-muted">Last 24 hours</div>
+
+@foreach (var server in Model)
+{
+    <div class="rounded bg-very-dark-dm bg-light-ex-lm mt-10 mb-10 p-10">
+        <h5 class="mt-0 text-truncate">
+            <color-code value="@server.Name"></color-code>
+        </h5>
+        @foreach (var report in server.Reports.OrderByDescending(report => report.ReportedOn))
+        {
+            var penalty = new ReceivedPenaltyResponse
+            {
+                OffenderName = report.Target.Name,
+                OffenderClientId = report.Target.ClientId,
+                PunisherName = report.Origin.Name,
+                PunisherClientId = report.Origin.ClientId,
+                Offense = report.Reason,
+                PenaltyType = EFPenalty.PenaltyType.Report,
+                ClientId = report.Target.ClientId
+            };
+            <div class="font-weight-bold">@report.ReportedOn.HumanizeForCurrentCulture()</div>
+            <div class="font-size-12">
+            <a asp-action="Profile" asp-controller="Client" asp-route-id="@report.Target.ClientId">
+                <color-code value="@report.Target.Name"></color-code>
+            </a>
+                <partial name="~/Views/Client/Profile/Meta/_ReceivedPenaltyResponse.cshtml" for="@penalty"/>
+                </div>
+            <hr/>
+   
+        }
+    </div>
+}
--- a/WebfrontCore/Views/Shared/_Layout.cshtml
+++ b/WebfrontCore/Views/Shared/_Layout.cshtml
@ -40,13 +40,13 @@
 </head>
 <body class="dark-mode with-custom-webkit-scrollbars with-custom-css-scrollbars" data-set-preferred-mode-onload="true">

-<!-- Action Modal -->
+<!-- action modal -->
 <div class="modal" id="actionModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
-        <div id="modalLoadingBar" class="progress-bar position-absolute flex-fill position-fixed z-30" style="display:none">
+        <div id="modalLoadingBar" class="modal-loading-bar progress-bar position-absolute flex-fill position-fixed z-30" style="display:none">
            <div class="progress-bar-value"></div>
        </div>
-        <div class="modal-content">
+        <div class="modal-content p-10">
            <div class="modal-content">
                <a href="#" class="btn close" role="button" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
@ -59,6 +59,27 @@
    </div>
 </div>

+<!-- context modal -->
+<div class="modal" id="contextModal" tabindex="-1" role="dialog">
+    <div class="modal-dialog" role="document">
+        <div class="modal-loading-bar progress-bar position-absolute flex-fill position-fixed z-30" style="display:none">
+            <div class="progress-bar-value"></div>
+        </div>
+        <div class="modal-content">
+            <div class="modal-content p-10">
+                <a href="#" class="btn close" role="button" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </a>
+                <div id="contextModalContent">
+                    <div class="modal-title"></div>
+                    <hr/>
+                    <div class="modal-body font-size-12"></div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
 <div class="page-wrapper with-navbar with-sidebar" data-sidebar-type="overlayed-sm-and-down">
    <!-- toast notifications -->
    <div class="sticky-alerts"></div>
@ -88,47 +109,36 @@
            </has-permission>

            <has-permission entity="AdminMenu" required-permission="Read">
+                <a href="#actionModal" class="profile-action no-decoration" data-action="RecentReports" data-toggle="tooltip" data-title="View recent reports" data-placement="bottom">
                    <div class="badge-group ml-10" role="group">
                        <span class="badge badge-danger">@(ViewBag.ReportCount ?? "-")</span>
                        <span class="badge bg-dark-dm bg-light-lm">Reports</span>
                    </div>
+                </a>
            </has-permission>
        </div>

-        <div class="d-flex d-lg-none ml-auto">
+        <div class="d-flex ml-auto">
+            <div class="btn btn-action mr-10 ml-10" onclick="halfmoon.toggleDarkMode()" data-toggle="tooltip" data-title="Toggle display mode" data-placement="bottom">
+                <i class="oi oi-moon"></i>
+            </div>
+            <div class="d-none d-md-block ">
+
+                <partial name="_SearchResourceForm"/>
+            </div>
+            <div class="d-flex d-lg-none">
                <a href="#contextMenuModal">
                    <button class="btn" type="button">
                        <i class="oi oi-ellipses"></i>
                    </button>
                </a>
            </div>
-
-        @*<div class="d-none d-md-flex ml-auto">
-            <div class="btn oi btn-square btn-action mr-10" data-glyph="moon" onclick="halfmoon.toggleDarkMode()" title="Toggle display mode"></div>
-        </div>*@
-
-        <div class="d-none d-lg-block ml-auto">
-            <partial name="_SearchResourceForm"/>
        </div>
+
    </nav>

    <partial name="_LeftNavBar"/>

-    <!-- Main Modal -->
-    <!--<div class="modal fade" id="mainModal" tabindex="-1" role="dialog" aria-labelledby="mainModalLabel" aria-hidden="true">
-        <div class="modal-dialog" role="document">
-            <div class="modal-content bg-dark">
-                <div class="modal-header">
-                    <h5 class="modal-title" id="mainModalLabel"></h5>
-                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                        <span aria-hidden="true" class="text-danger">&times;</span>
-                    </button>
-                </div>
-                <div class="modal-body">
-                </div>
-            </div>
-        </div>
-    </div>-->
    <!-- End Main Modal -->
    <div id="target_id">
        @await RenderSectionAsync("targetid", required: false)
--- a/WebfrontCore/Views/Shared/_LeftNavBar.cshtml
+++ b/WebfrontCore/Views/Shared/_LeftNavBar.cshtml
@ -23,10 +23,12 @@
                <span class="name">@ViewBag.Localization["WEBFRONT_NAV_ABOUT"]</span>
            </a>
            <!-- penalties -->
+            <has-permission entity="Penalty" required-permission="Read">
                <a asp-controller="Penalty" asp-action="List" class="sidebar-link">
                    <i class="oi oi-lock-locked mr-5"></i>
                    <span class="name">@ViewBag.Localization["WEBFRONT_NAV_PENALTIES"]</span>
                </a>
+            </has-permission>
            <!-- privileged -->
            <has-permission entity="PrivilegedClientsPage" required-permission="Read">
                <a asp-controller="Client" asp-action="Privileged" class="sidebar-link">
@ -126,12 +128,12 @@
                        <span class="name">@ViewBag.Localization["WEBFRONT_NAV_AUDIT_LOG"]</span>
                    </a>
                </has-permission>
-                @*<has-permission entity="RecentPlayersPage" required-permission="Read">
+                <has-permission entity="RecentPlayersPage" required-permission="Read">
                    <a class="sidebar-link profile-action" href="#actionModal" data-action="RecentClients" title="@ViewBag.Localization["WEBFRONT_ACTION_RECENT_CLIENTS"]">
                        <i class="oi oi-timer mr-5"></i>
                        <span class="name">@ViewBag.Localization["WEBFRONT_ACTION_RECENT_CLIENTS"]</span>
                    </a>
-                </has-permission>*@
+                </has-permission>
                <a class="sidebar-link profile-action" href="#actionModal" data-action="GenerateLoginToken" title="@ViewBag.Localization["WEBFRONT_ACTION_TOKEN"]">
                    <i class="oi oi-key mr-5"></i>
                    <span class="name">@ViewBag.Localization["WEBFRONT_ACTION_TOKEN"]</span>
--- a/WebfrontCore/WebfrontCore.csproj
+++ b/WebfrontCore/WebfrontCore.csproj
@ -78,6 +78,6 @@
  </ProjectExtensions>

  <Target Name="PreBuild" BeforeTargets="PreBuildEvent">
-    <Exec Command="if $(ConfigurationName) == Debug ( &#xA;powershell -Command wget https://raw.githubusercontent.com/iconic/open-iconic/master/font/css/open-iconic-bootstrap.scss -o $(ProjectDir)wwwroot\lib\open-iconic\font\css\open-iconic-bootstrap-override.scss&#xA;echo d | xcopy /f /y $(ProjectDir)wwwroot\lib\open-iconic\font\fonts $(ProjectDir)wwwroot\font\&#xA;powershell -Command &quot;((Get-Content -path  $(ProjectDir)wwwroot\lib\open-iconic\font\css\open-iconic-bootstrap-override.scss -Raw) -replace '../fonts/','/fonts/') | Set-Content -Path $(ProjectDir)wwwroot\lib\open-iconic\font\css\open-iconic-bootstrap-override.scss&quot;&#xA;)" />
+    <Exec Command="if $(ConfigurationName) == Debug ( &#xA;powershell -Command wget https://raw.githubusercontent.com/iconic/open-iconic/master/font/css/open-iconic-bootstrap.scss -o $(ProjectDir)wwwroot\lib\open-iconic\font\css\open-iconic-bootstrap-override.scss&#xA;echo d | xcopy /f /y $(ProjectDir)wwwroot\lib\open-iconic\font\fonts $(ProjectDir)wwwroot\font\&#xA;powershell -Command &quot;((Get-Content -path  $(ProjectDir)wwwroot\lib\open-iconic\font\css\open-iconic-bootstrap-override.scss -Raw) -replace '../fonts/','/font/') | Set-Content -Path $(ProjectDir)wwwroot\lib\open-iconic\font\css\open-iconic-bootstrap-override.scss&quot;&#xA;)" />
  </Target>
 </Project>
--- a/WebfrontCore/wwwroot/css/src/main.scss
+++ b/WebfrontCore/wwwroot/css/src/main.scss
@ -1,7 +1,7 @@
@import 'profile.scss';

 :root {
-    --blue-color: #007ACC;
+    --blue-color: #117ac0;
    
    --yellow-color: #fe7e4c;
    --yellow-color-dark: #fe7e4c88;
@ -20,6 +20,8 @@
    --lm-card-bg-color: var(--gray-color-light);
    --gray-color-light: white;
    --card-border-width: 0;
+
+    --dm-modal-overlay-bg-color: rgba(0, 0, 0, 0.8);
 }

 .server-history-row {
--- a/WebfrontCore/wwwroot/css/src/profile.scss
+++ b/WebfrontCore/wwwroot/css/src/profile.scss
@ -5,11 +5,15 @@
 .level-color-user, .level-color-guest, .level-color-0 {
 }

-.level-bgcolor-user, .level-bgcolor-guest, .level-bgcolor-0 {
+.dark-mode .level-bgcolor-user, .dark-mode .level-bgcolor-guest, .dark-mode .level-bgcolor-0 {
    background-color: #6c757d !important;
    background-color: rgba(255, 255, 255, 0.68) !important;
 }

+.level-bgcolor-user, .level-bgcolor-guest, .level-bgcolor-0 {
+    background-color: var(--lm-base-body-bg-color) !important;
+}
+
 .level-color-trusted, .level-color-2 {
    color: #749363 !important;
    color: rgba(116,147,99,1) !important;
@ -188,10 +192,11 @@
    word-break: break-all;
 }

-.ip-lookup-profile {
+.profile-country-flag {
    background-size: contain; 
    background-repeat: no-repeat; 
    background-position: center;
+    height:5rem;
 }

 .status-indicator {
--- a/WebfrontCore/wwwroot/js/action.js
+++ b/WebfrontCore/wwwroot/js/action.js
@ -1,11 +1,11 @@
 function hideLoader() {
    $('#mainLoadingBar').fadeOut();
-    $('#modalLoadingBar').fadeOut();
+    $('.modal-loading-bar').fadeOut();
 }

 function showLoader() {
    $('#mainLoadingBar').fadeIn();
-    $('#modalLoadingBar').fadeIn();
+    $('.modal-loading-bar').fadeIn();
 }

 function errorLoader() {
@ -151,8 +151,13 @@ $(document).ready(function () {
                
                catch{}
                
+                if (message instanceof Array)
+                {
+                    message = message.join("<br/>");
+                }
+                
                halfmoon.initStickyAlert({
-                    content: message.join("<br/>"),
+                    content: message,
                    title: 'Error',
                    alertType: 'alert-danger',
                    fillType: 'filled'
--- a/WebfrontCore/wwwroot/js/profile.js
+++ b/WebfrontCore/wwwroot/js/profile.js
@ -55,36 +55,35 @@
    /*
     get ip geolocation info into modal
     */
-    $('.ip-locate-link').click(function (e) {
-        e.preventDefault();
+    $('.profile-ip-lookup').click(function (e) {
        const ip = $(this).data("ip");
        $.getJSON(`https://ipwhois.app/json/${ip}`)
            .done(function (response) {
-                $('#mainModal .modal-title').text(ip);
-                $('#mainModal .modal-body').text('');
+                $('#contextModal .modal-title').text(ip);
+                const modalBody = $('#contextModal .modal-body');
+                modalBody.text('');
                if (response.isp.length > 0) {
-                    $('#mainModal .modal-body').append(`${_localization['WEBFRONT_PROFILE_LOOKUP_ISP']} &mdash; ${response.isp}<br/>`);
+                    modalBody.append(`${_localization['WEBFRONT_PROFILE_LOOKUP_ISP']} &mdash; <span class="text-muted">${response.isp}</span><br/>`);
                }
                if (response.org.length > 0) {
-                    $('#mainModal .modal-body').append(`${_localization['WEBFRONT_PROFILE_LOOKUP_ORG']} &mdash; ${response.org}<br/>`);
+                    modalBody.append(`${_localization['WEBFRONT_PROFILE_LOOKUP_ORG']} &mdash; <span class="text-muted">${response.org}</span><br/>`);
                }
                if (response.region.length > 0 || response.city.length > 0 || response.country.length > 0 || response.timezone_gmt.length > 0) {
-                    $('#mainModal .modal-body').append(`${_localization['WEBFRONT_PROFILE_LOOKUP_LOCATION']} &mdash; `);
+                    modalBody.append(`${_localization['WEBFRONT_PROFILE_LOOKUP_LOCATION']} &mdash;`);
                }
                if (response.city.length > 0) {
-                    $('#mainModal .modal-body').append(response.city);
+                    modalBody.append(`<span class="text-muted">${response.city}</span>`);
                }
                if (response.region.length > 0) {
-                    $('#mainModal .modal-body').append((response.region.length > 0 ? ', ' : '') + response.region);
+                    modalBody.append(`<span class="text-muted">${(response.region.length > 0 ? ', ' : '') + response.region}</span>`);
                }
                if (response.country.length > 0) {
-                    $('#mainModal .modal-body').append((response.country.length > 0 ? ', ' : '') + response.country);
+                    modalBody.append(`<span class="text-muted">${(response.country.length > 0 ? ', ' : '') + response.country}</span>`);
                }
                if (response.timezone_gmt.length > 0) {
-                    $('#mainModal .modal-body').append((response.timezone_gmt.length > 0 ? ', ' : '') + response.timezone_gmt);
+                    modalBody.append(`<br/>Timezone &mdash; <span class="text-muted">UTC${response.timezone_gmt}</span>`);
                }
-
-                $('#mainModal').modal();
+                modalBody.append('</span>');
            })
            .fail(function (jqxhr, textStatus, error) {
                $('#mainModal .modal-title').text("Error");