Implemented text editor

Moonlight/Moonlight.csproj

@@ -25,6 +25,7 @@
     <ItemGroup>
       <PackageReference Include="Ben.Demystifier" Version="0.4.1" />
       <PackageReference Include="BlazorTable" Version="1.17.0" />
+      <PackageReference Include="HtmlSanitizer" Version="8.0.746" />
       <PackageReference Include="JWT" Version="10.1.1" />
       <PackageReference Include="MailKit" Version="4.2.0" />
       <PackageReference Include="Mappy.Net" Version="1.0.2" />

Moonlight/Shared/Components/Forms/TextEditor.razor

@@ -1,4 +1,10 @@
 @inject IJSRuntime JsRuntime
+@using Microsoft.AspNetCore.Components.Forms
+@using Moonlight.App.Services
+@using Ganss.Xss
+@inherits InputBase<string>
+
+@inject IdentityService IdentityService
 
 <style>
     :root {
@@ -105,11 +111,15 @@
     }
 </style>
 
-<div id="@Id" class="card card-body bg-black"></div>
+<div id="@Id" class="card card-body bg-black" @onfocusout="Callback"></div>
 
 @code
 {
+    [Parameter]
+    public string InitialContent { get; set; }
+    
     private string Id;
+    private bool IsInitialized = false;
 
     protected override void OnInitialized()
     {
@@ -121,6 +131,32 @@
         if (firstRender)
         {
             await JsRuntime.InvokeVoidAsync("moonlight.textEditor.create", Id);
+            await JsRuntime.InvokeVoidAsync("moonlight.textEditor.set", Id, InitialContent);
+            CurrentValue = InitialContent;
+            IsInitialized = true;
         }
     }
+
+    private async Task Callback()
+    {
+        if(!IsInitialized)
+            return;
+        
+        var html = await JsRuntime.InvokeAsync<string>("moonlight.textEditor.get", Id);
+        
+        var sanitizer = new HtmlSanitizer();
+        var sanitized = sanitizer.Sanitize(html);
+        
+        if(sanitized != html)
+            Logger.Warn($"XSS attempt by {IdentityService.CurrentUserNullable?.Username ?? "Guest"}: {html}", "security");
+
+        CurrentValue = sanitized;
+    }
+
+    protected override bool TryParseValueFromString(string? value, out string result, out string? validationErrorMessage)
+    {
+        result = value;
+        validationErrorMessage = "";
+        return true;
+    }
 }

Moonlight/Shared/Views/Test.razor

@@ -1,3 +0,0 @@
-@page "/test"
-
-<TextEditor />

Moonlight/wwwroot/js/moonlight.js

@@ -128,6 +128,11 @@ window.moonlight = {
         {
             let editor = document.getElementById(id).ckeditorInstance;
             return editor.getData();
+        },
+        set: function (id, data)
+        {
+            let editor = document.getElementById(id).ckeditorInstance;
+            editor.setData(data);
         }
     }
 }