diff --git a/src/AliasVault.Admin/Main/Components/Alerts/GlobalNotificationDisplay.razor b/src/AliasVault.Admin/Main/Components/Alerts/GlobalNotificationDisplay.razor index a2882da06..6727b4d62 100644 --- a/src/AliasVault.Admin/Main/Components/Alerts/GlobalNotificationDisplay.razor +++ b/src/AliasVault.Admin/Main/Components/Alerts/GlobalNotificationDisplay.razor @@ -1,23 +1,36 @@ @implements IDisposable +@inject NavigationManager NavigationManager -@foreach (var message in Messages) +@if (Messages.Count == 0) { - if (message.Key == "success") - { - - } + return; } -@foreach (var message in Messages) -{ - if (message.Key == "error") + +
+ @foreach (var message in Messages) { - + if (message.Key == "success") + { + + } } -} + @foreach (var message in Messages) + { + if (message.Key == "error") + { + + } + } +
+ + @code { private List> Messages { get; set; } = new(); - private bool _onChangeSubscribed = false; /// protected override async Task OnAfterRenderAsync(bool firstRender) @@ -26,22 +39,26 @@ if (firstRender) { - // We subscribe to the OnChange event of the GlobalNotificationService to update the UI when a new message is added RefreshAddMessages(); GlobalNotificationService.OnChange += RefreshAddMessages; - _onChangeSubscribed = true; + NavigationManager.LocationChanged += HandleLocationChanged; } } /// public void Dispose() { - // We unsubscribe from the OnChange event of the PortalMessageService when the component is disposed - if (_onChangeSubscribed) - { - GlobalNotificationService.OnChange -= RefreshAddMessages; - _onChangeSubscribed = false; - } + GlobalNotificationService.OnChange -= RefreshAddMessages; + NavigationManager.LocationChanged -= HandleLocationChanged; + } + + /// + /// Refreshes the messages on navigation to another page. + /// + private void HandleLocationChanged(object? sender, LocationChangedEventArgs e) + { + RefreshAddMessages(); + InvokeAsync(StateHasChanged); } /// diff --git a/src/AliasVault.Admin/Main/Components/Layout/Breadcrumb.razor b/src/AliasVault.Admin/Main/Components/Layout/Breadcrumb.razor index c435443bd..8221c3020 100644 --- a/src/AliasVault.Admin/Main/Components/Layout/Breadcrumb.razor +++ b/src/AliasVault.Admin/Main/Components/Layout/Breadcrumb.razor @@ -31,7 +31,6 @@ } - @code { /// diff --git a/src/AliasVault.Admin/Main/Layout/MainLayout.razor b/src/AliasVault.Admin/Main/Layout/MainLayout.razor index 01fb150c0..428d42623 100644 --- a/src/AliasVault.Admin/Main/Layout/MainLayout.razor +++ b/src/AliasVault.Admin/Main/Layout/MainLayout.razor @@ -8,6 +8,7 @@
+ @Body
diff --git a/src/AliasVault.Admin/Main/Pages/Account/Manage/ChangePassword.razor b/src/AliasVault.Admin/Main/Pages/Account/Manage/ChangePassword.razor index 1f5c115ee..746f1a4a3 100644 --- a/src/AliasVault.Admin/Main/Pages/Account/Manage/ChangePassword.razor +++ b/src/AliasVault.Admin/Main/Pages/Account/Manage/ChangePassword.razor @@ -61,7 +61,7 @@ Logger.LogInformation("User changed their password successfully."); - GlobalNotificationService.AddSuccessMessage("Your password has been changed.", true); + GlobalNotificationService.AddSuccessMessage("Your password has been changed."); NavigationService.RedirectToCurrentPage(); } diff --git a/src/AliasVault.Admin/Main/Pages/Account/Manage/ResetAuthenticator.razor b/src/AliasVault.Admin/Main/Pages/Account/Manage/ResetAuthenticator.razor index 48ed7d98c..1056f3d6a 100644 --- a/src/AliasVault.Admin/Main/Pages/Account/Manage/ResetAuthenticator.razor +++ b/src/AliasVault.Admin/Main/Pages/Account/Manage/ResetAuthenticator.razor @@ -35,7 +35,7 @@ var userId = await UserManager.GetUserIdAsync(UserService.User()); Logger.LogInformation("User with ID '{UserId}' has reset their authentication app key.", userId); - GlobalNotificationService.AddSuccessMessage("Your authenticator app key has been reset, you will need to re-configure your authenticator app using the new key.", true); + GlobalNotificationService.AddSuccessMessage("Your authenticator app key has been reset, you will need to re-configure your authenticator app using the new key."); NavigationService.RedirectTo( "account/manage/2fa"); diff --git a/src/AliasVault.Admin/Main/Pages/Account/ManageLayout.razor b/src/AliasVault.Admin/Main/Pages/Account/ManageLayout.razor index af9416a3e..f4e2ae308 100644 --- a/src/AliasVault.Admin/Main/Pages/Account/ManageLayout.razor +++ b/src/AliasVault.Admin/Main/Pages/Account/ManageLayout.razor @@ -4,8 +4,6 @@
- -

Manage account

diff --git a/src/AliasVault.Admin/wwwroot/css/tailwind.css b/src/AliasVault.Admin/wwwroot/css/tailwind.css index 944c2eeea..908302721 100644 --- a/src/AliasVault.Admin/wwwroot/css/tailwind.css +++ b/src/AliasVault.Admin/wwwroot/css/tailwind.css @@ -644,14 +644,6 @@ video { grid-column: 1 / -1; } -.col-span-2 { - grid-column: span 2 / span 2; -} - -.col-span-6 { - grid-column: span 6 / span 6; -} - .mx-3 { margin-left: 0.75rem; margin-right: 0.75rem; @@ -667,6 +659,10 @@ video { margin-bottom: 1rem; } +.mb-1 { + margin-bottom: 0.25rem; +} + .mb-2 { margin-bottom: 0.5rem; } @@ -743,10 +739,6 @@ video { margin-top: 2rem; } -.mb-1 { - margin-bottom: 0.25rem; -} - .line-clamp-1 { overflow: hidden; display: -webkit-box; @@ -822,10 +814,18 @@ video { width: 50%; } +.w-1\/3 { + width: 33.333333%; +} + .w-10 { width: 2.5rem; } +.w-2\/3 { + width: 66.666667%; +} + .w-4 { width: 1rem; } @@ -858,14 +858,6 @@ video { width: 100%; } -.w-1\/3 { - width: 33.333333%; -} - -.w-2\/3 { - width: 66.666667%; -} - .max-w-2xl { max-width: 42rem; } @@ -882,10 +874,6 @@ video { max-width: 36rem; } -.flex-1 { - flex: 1 1 0%; -} - .flex-shrink-0 { flex-shrink: 0; } @@ -924,6 +912,10 @@ video { grid-template-columns: repeat(1, minmax(0, 1fr)); } +.grid-cols-2 { + grid-template-columns: repeat(2, minmax(0, 1fr)); +} + .grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } @@ -932,14 +924,6 @@ video { grid-template-columns: repeat(7, minmax(0, 1fr)); } -.grid-cols-2 { - grid-template-columns: repeat(2, minmax(0, 1fr)); -} - -.grid-cols-6 { - grid-template-columns: repeat(6, minmax(0, 1fr)); -} - .flex-col { flex-direction: column; } @@ -972,10 +956,6 @@ video { justify-content: space-between; } -.gap-6 { - gap: 1.5rem; -} - .space-x-1 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0.25rem * var(--tw-space-x-reverse)); @@ -1140,11 +1120,6 @@ video { background-color: rgb(59 130 246 / var(--tw-bg-opacity)); } -.bg-blue-600 { - --tw-bg-opacity: 1; - background-color: rgb(37 99 235 / var(--tw-bg-opacity)); -} - .bg-gray-100 { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity)); @@ -1344,6 +1319,14 @@ video { padding-bottom: 2rem; } +.pl-2 { + padding-left: 0.5rem; +} + +.pr-2 { + padding-right: 0.5rem; +} + .ps-2 { padding-inline-start: 0.5rem; } @@ -1360,14 +1343,6 @@ video { padding-top: 2rem; } -.pl-2 { - padding-left: 0.5rem; -} - -.pr-2 { - padding-right: 0.5rem; -} - .text-left { text-align: left; } @@ -1518,11 +1493,6 @@ video { color: rgb(133 77 14 / var(--tw-text-opacity)); } -.text-blue-500 { - --tw-text-opacity: 1; - color: rgb(59 130 246 / var(--tw-text-opacity)); -} - .underline { text-decoration-line: underline; } @@ -1595,11 +1565,6 @@ video { transition-duration: 300ms; } -.hover\:bg-blue-700:hover { - --tw-bg-opacity: 1; - background-color: rgb(29 78 216 / var(--tw-bg-opacity)); -} - .hover\:bg-gray-100:hover { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity)); @@ -1625,16 +1590,16 @@ video { background-color: rgb(154 93 38 / var(--tw-bg-opacity)); } -.hover\:bg-red-800:hover { - --tw-bg-opacity: 1; - background-color: rgb(153 27 27 / var(--tw-bg-opacity)); -} - .hover\:bg-red-700:hover { --tw-bg-opacity: 1; background-color: rgb(185 28 28 / var(--tw-bg-opacity)); } +.hover\:bg-red-800:hover { + --tw-bg-opacity: 1; + background-color: rgb(153 27 27 / var(--tw-bg-opacity)); +} + .hover\:text-gray-900:hover { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity)); @@ -1750,11 +1715,6 @@ video { border-color: rgb(55 65 81 / var(--tw-border-opacity)); } -.dark\:bg-blue-500:is(.dark *) { - --tw-bg-opacity: 1; - background-color: rgb(59 130 246 / var(--tw-bg-opacity)); -} - .dark\:bg-gray-600:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity)); @@ -1785,6 +1745,11 @@ video { background-color: rgb(214 131 56 / var(--tw-bg-opacity)); } +.dark\:bg-red-500:is(.dark *) { + --tw-bg-opacity: 1; + background-color: rgb(239 68 68 / var(--tw-bg-opacity)); +} + .dark\:bg-red-900:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(127 29 29 / var(--tw-bg-opacity)); @@ -1795,11 +1760,6 @@ video { background-color: rgb(113 63 18 / var(--tw-bg-opacity)); } -.dark\:bg-red-500:is(.dark *) { - --tw-bg-opacity: 1; - background-color: rgb(239 68 68 / var(--tw-bg-opacity)); -} - .dark\:bg-opacity-80:is(.dark *) { --tw-bg-opacity: 0.8; } @@ -1893,11 +1853,6 @@ video { --tw-ring-offset-color: #1f2937; } -.dark\:hover\:bg-blue-600:hover:is(.dark *) { - --tw-bg-opacity: 1; - background-color: rgb(37 99 235 / var(--tw-bg-opacity)); -} - .dark\:hover\:bg-gray-600:hover:is(.dark *) { --tw-bg-opacity: 1; background-color: rgb(75 85 99 / var(--tw-bg-opacity)); @@ -1948,11 +1903,6 @@ video { --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity)); } -.dark\:focus\:ring-blue-800:focus:is(.dark *) { - --tw-ring-opacity: 1; - --tw-ring-color: rgb(30 64 175 / var(--tw-ring-opacity)); -} - .dark\:focus\:ring-gray-600:focus:is(.dark *) { --tw-ring-opacity: 1; --tw-ring-color: rgb(75 85 99 / var(--tw-ring-opacity)); @@ -1978,21 +1928,17 @@ video { --tw-ring-color: rgb(154 93 38 / var(--tw-ring-opacity)); } -.dark\:focus\:ring-red-900:focus:is(.dark *) { - --tw-ring-opacity: 1; - --tw-ring-color: rgb(127 29 29 / var(--tw-ring-opacity)); -} - .dark\:focus\:ring-red-800:focus:is(.dark *) { --tw-ring-opacity: 1; --tw-ring-color: rgb(153 27 27 / var(--tw-ring-opacity)); } -@media (min-width: 640px) { - .sm\:col-span-3 { - grid-column: span 3 / span 3; - } +.dark\:focus\:ring-red-900:focus:is(.dark *) { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(127 29 29 / var(--tw-ring-opacity)); +} +@media (min-width: 640px) { .sm\:flex { display: flex; } @@ -2011,18 +1957,18 @@ video { margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))); } - .sm\:space-y-0 > :not([hidden]) ~ :not([hidden]) { - --tw-space-y-reverse: 0; - margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))); - margin-bottom: calc(0px * var(--tw-space-y-reverse)); - } - .sm\:space-x-4 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(1rem * var(--tw-space-x-reverse)); margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse))); } + .sm\:space-y-0 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0px * var(--tw-space-y-reverse)); + } + .sm\:p-6 { padding: 1.5rem; } @@ -2116,10 +2062,6 @@ video { order: 2; } - .lg\:col-auto { - grid-column: auto; - } - .lg\:mb-10 { margin-bottom: 2.5rem; } @@ -2180,17 +2122,17 @@ video { gap: 1rem; } - .xl\:space-x-8 > :not([hidden]) ~ :not([hidden]) { - --tw-space-x-reverse: 0; - margin-right: calc(2rem * var(--tw-space-x-reverse)); - margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse))); - } - .xl\:space-x-0 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0px * var(--tw-space-x-reverse)); margin-left: calc(0px * calc(1 - var(--tw-space-x-reverse))); } + + .xl\:space-x-8 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(2rem * var(--tw-space-x-reverse)); + margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse))); + } } @media (min-width: 1536px) { @@ -2198,10 +2140,6 @@ video { grid-column: span 2 / span 2; } - .\32xl\:flex { - display: flex; - } - .\32xl\:space-x-4 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(1rem * var(--tw-space-x-reverse)); diff --git a/src/AliasVault.Client/Main/Components/Alerts/GlobalNotificationDisplay.razor b/src/AliasVault.Client/Main/Components/Alerts/GlobalNotificationDisplay.razor index b8606ada2..05a687c65 100644 --- a/src/AliasVault.Client/Main/Components/Alerts/GlobalNotificationDisplay.razor +++ b/src/AliasVault.Client/Main/Components/Alerts/GlobalNotificationDisplay.razor @@ -1,24 +1,37 @@ @inject GlobalNotificationService GlobalNotificationService +@inject NavigationManager NavigationManager @implements IDisposable -@foreach (var message in Messages) +@if (Messages.Count == 0) { - if (message.Key == "success") - { - - } + return; } -@foreach (var message in Messages) -{ - if (message.Key == "error") + +
+ @foreach (var message in Messages) { - + if (message.Key == "success") + { + + } } -} + @foreach (var message in Messages) + { + if (message.Key == "error") + { + + } + } +
+ + @code { private List> Messages { get; set; } = new(); - private bool _onChangeSubscribed = false; /// protected override async Task OnAfterRenderAsync(bool firstRender) @@ -27,22 +40,26 @@ if (firstRender) { - // We subscribe to the OnChange event of the PortalMessageService to update the UI when a new message is added RefreshAddMessages(); GlobalNotificationService.OnChange += RefreshAddMessages; - _onChangeSubscribed = true; + NavigationManager.LocationChanged += HandleLocationChanged; } } /// public void Dispose() { - // We unsubscribe from the OnChange event of the PortalMessageService when the component is disposed - if (_onChangeSubscribed) - { - GlobalNotificationService.OnChange -= RefreshAddMessages; - _onChangeSubscribed = false; - } + GlobalNotificationService.OnChange -= RefreshAddMessages; + NavigationManager.LocationChanged -= HandleLocationChanged; + } + + /// + /// Refreshes the messages on navigation to another page. + /// + private void HandleLocationChanged(object? sender, LocationChangedEventArgs e) + { + RefreshAddMessages(); + InvokeAsync(StateHasChanged); } /// diff --git a/src/AliasVault.Client/Main/Components/Layout/Breadcrumb.razor b/src/AliasVault.Client/Main/Components/Layout/Breadcrumb.razor index c435443bd..e40d4516d 100644 --- a/src/AliasVault.Client/Main/Components/Layout/Breadcrumb.razor +++ b/src/AliasVault.Client/Main/Components/Layout/Breadcrumb.razor @@ -15,7 +15,7 @@
  • - @item.DisplayName + @item.DisplayName
    • } @@ -31,7 +31,6 @@ } - @code { /// diff --git a/src/AliasVault.Client/Main/Layout/MainLayout.razor b/src/AliasVault.Client/Main/Layout/MainLayout.razor index e8c698c68..52ea04b2e 100644 --- a/src/AliasVault.Client/Main/Layout/MainLayout.razor +++ b/src/AliasVault.Client/Main/Layout/MainLayout.razor @@ -10,6 +10,7 @@
    + @Body