Merge pull request #425 from Moonlight-Panel/v2_AddCookieConsentBanner

V2 add cookie consent banner
This commit is contained in:
Masu Baumgartner
2024-06-13 21:24:06 +02:00
committed by GitHub
5 changed files with 134 additions and 4 deletions

View File

@@ -116,6 +116,7 @@ public class CoreConfiguration
public FileManagerData FileManager { get; set; } = new();
[JsonProperty("Footer")] public FooterData Footer { get; set; } = new();
[JsonProperty("CookieConsentBanner")] public CookieData CookieConsentBanner{ get; set; } = new();
}
public class FooterData
@@ -147,4 +148,27 @@ public class CoreConfiguration
[Description("This specifies the general timeout for file manager operations. This can but has not to be used by file accesses")]
public int OperationTimeout { get; set; } = 5;
}
public class CookieData
{
[JsonProperty("Enabled")]
[Description("This specifies if the cookie consent banner is shown to users.")]
public bool Enabled { get; set; } = false;
[JsonProperty("BannerTitle")]
[Description("The title for the cookie consent banner.")]
public string BannerTitle { get; set; } = "\ud83c\udf6a Cookies";
[JsonProperty("BannerText")]
[Description("The description for the cookie consent banner.")]
public string BannerText { get; set; } = "Moonlight is using cookies \ud83c\udf6a, to personalize your experience.";
[JsonProperty("ConsentText")]
[Description("The text for the consent option.")]
public string ConsentText { get; set; } = "Consent";
[JsonProperty("DeclineText")]
[Description("The text for the decline option.")]
public string DeclineText { get; set; } = "Decline";
}
}

View File

@@ -0,0 +1,9 @@
using System.ComponentModel;
namespace Moonlight.Core.Models.Forms;
public class ChangeCookiesForm
{
[Description("This specifies if you would like to personalize your experience with optional cookies.")]
public bool UseOptionalCookies { get; set; } = false;
}

View File

@@ -0,0 +1,71 @@
@using ApexCharts
@using MoonCore.Services
@using Moonlight.Core.Configuration
@using Moonlight.Core.Services
@inject ConfigService<CoreConfiguration> ConfigService
@inject IdentityService IdentityService
@if (ShowBanner)
{
<div class="mb-12 mx-8 d-flex justify-content-end fixed-bottom no-pointer-events" style="pointer-events: none;">
<div style="pointer-events: all; max-width: var(--bs-breakpoint-sm)" class="w-100">
<div class="card shadow-lg">
<div class="card-body">
<h3 class="mb-4">@ConfigService.Get().Customisation.CookieConsentBanner.BannerTitle</h3>
<p class="text-muted fs-6">
@ConfigService.Get().Customisation.CookieConsentBanner.BannerText
</p>
<span class="d-flex gap-5">
<a @onclick:preventDefault @onclick="Consent" class="btn btn-primary btn-sm cursor-pointer">
<i class="bx bx-check"></i> @ConfigService.Get().Customisation.CookieConsentBanner.ConsentText
</a>
<a @onclick:preventDefault @onclick="Decline" class="btn btn-secondary btn-sm cursor-pointer">
<i class="bx bx-x"></i> @ConfigService.Get().Customisation.CookieConsentBanner.DeclineText
</a>
</span>
</div>
</div>
</div>
</div>
}
@code {
private bool ShowBanner;
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
var userWasAsked = await IdentityService.HasFlag("CookieAsked");
if (ConfigService.Get().Customisation.CookieConsentBanner.Enabled && !userWasAsked)
ShowBanner = true;
await InvokeAsync(StateHasChanged);
}
}
private async Task Consent()
{
if (!IdentityService.IsLoggedIn)
return;
await IdentityService.SetFlag("CookieAsked", true);
await IdentityService.SetFlag("CookieConsent", true);
await InvokeAsync(StateHasChanged);
}
private async Task Decline()
{
if (!IdentityService.IsLoggedIn)
return;
await IdentityService.SetFlag("CookieAsked", true);
await InvokeAsync(StateHasChanged);
}
}

View File

@@ -56,6 +56,7 @@
{
<PermissionChecker>
@Body
<CookieConsentBanner/>
</PermissionChecker>
}
else

View File

@@ -28,7 +28,7 @@
<div class="row g-5">
<div class="col-md-6 col-12">
<div class="card">
<SmartForm Model="PasswordForm" OnValidSubmit="OnValidSubmit">
<SmartForm Model="PasswordForm" OnValidSubmit="OnValidSubmitPassword">
<div class="card-body">
<div class="row">
<AutoForm Model="PasswordForm" Columns="12" />
@@ -47,19 +47,37 @@
</div>
</div>
</div>
<div class="col-md-6 col-12">
<div class="card h-100">
<SmartForm Model="CookiesForm" OnValidSubmit="OnValidSubmitCookie">
<div class="card-body">
<h3>Cookies</h3>
<div>
<AutoForm Model="CookiesForm"/>
</div>
</div>
<div class="card-footer d-flex justify-content-end">
<button class="btn btn-primary" type="submit">Save changes</button>
</div>
</SmartForm>
</div>
</div>
</div>
</LazyLoader>
@code
{
private readonly ChangePasswordForm PasswordForm = new();
private ChangeCookiesForm CookiesForm = new();
private Task Load(LazyLoader lazyLoader)
private async Task Load(LazyLoader lazyLoader)
{
return Task.CompletedTask;
CookiesForm.UseOptionalCookies = await IdentityService.HasFlag("CookieConsent");
}
private async Task OnValidSubmit()
private async Task OnValidSubmitPassword()
{
if (PasswordForm.Password != PasswordForm.RepeatedPassword)
throw new DisplayException("The passwords do not match");
@@ -69,4 +87,11 @@
await ToastService.Success("Successfully changed password");
await IdentityService.Authenticate(true);
}
private async Task OnValidSubmitCookie()
{
await IdentityService.SetFlag("CookieConsent", CookiesForm.UseOptionalCookies);
await InvokeAsync(StateHasChanged);
}
}