From 70139221ab6d88ac604554a1d52ff6c2c7981614 Mon Sep 17 00:00:00 2001
From: sbwalker <shaun.walker@siliqon.com>
Date: Wed, 20 Dec 2023 16:58:46 -0500
Subject: [PATCH] add an AllowRichText parameter to the RichTextEditor
 component and add logic to handle JS Interop failures

---
 .../Modules/Controls/RichTextEditor.razor     | 227 +++++++++---------
 1 file changed, 118 insertions(+), 109 deletions(-)

diff --git a/Oqtane.Client/Modules/Controls/RichTextEditor.razor b/Oqtane.Client/Modules/Controls/RichTextEditor.razor
index 413f63a1..ad7980d1 100644
--- a/Oqtane.Client/Modules/Controls/RichTextEditor.razor
+++ b/Oqtane.Client/Modules/Controls/RichTextEditor.razor
@@ -6,70 +6,75 @@
 
 <div class="row" style="margin-bottom: 50px;">
     <div class="col">
-        <TabStrip ActiveTab="@_activeTab">
-            <TabPanel Name="Rich" Heading="Rich Text Editor" ResourceKey="RichTextEditor">
-				@if (_richfilemanager)
-				{
-                    <FileManager @ref="_fileManager" Filter="@PageState.Site.ImageFiles" />
-					<ModuleMessage Message="@_message" Type="MessageType.Warning"></ModuleMessage>
-					<br />
-				}
-				<div class="d-flex justify-content-center mb-2">
-					@if (AllowRawHtml)
-					{
-						<button type="button" class="btn btn-secondary" @onclick="RefreshRichText">@Localizer["SynchronizeContent"]</button>@((MarkupString)"&nbsp;&nbsp;")
-					}
-					@if (AllowFileManagement)
-					{
-						<button type="button" class="btn btn-primary" @onclick="InsertRichImage">@Localizer["InsertImage"]</button>
-					}
-					@if (_richfilemanager)
-					{
-						@((MarkupString)"&nbsp;&nbsp;")
-						<button type="button" class="btn btn-secondary" @onclick="CloseRichFileManager">@Localizer["Close"]</button>
-					}
-				</div>
-				<div class="row">
-					<div class="col">
-						<div @ref="@_toolBar">
-							@if (ToolbarContent != null)
-							{
-								@ToolbarContent
-							}
-							else
-							{
-								<select class="ql-header">
-									<option selected=""></option>
-									<option value="1"></option>
-									<option value="2"></option>
-									<option value="3"></option>
-									<option value="4"></option>
-									<option value="5"></option>
-								</select>
-								<span class="ql-formats">
-									<button class="ql-bold"></button>
-									<button class="ql-italic"></button>
-									<button class="ql-underline"></button>
-									<button class="ql-strike"></button>
-								</span>
-								<span class="ql-formats">
-									<select class="ql-color"></select>
-									<select class="ql-background"></select>
-								</span>
-								<span class="ql-formats">
-									<button class="ql-list" value="ordered"></button>
-									<button class="ql-list" value="bullet"></button>
-								</span>
-								<span class="ql-formats">
-									<button class="ql-link"></button>
-								</span>
-							}
-						</div>
-						<div @ref="@_editorElement">
-						</div>
-					</div>
-				</div>
-			</TabPanel>
+        <TabStrip>
+			@if (AllowRichText)
+            {
+                <TabPanel Name="Rich" Heading="Rich Text Editor" ResourceKey="RichTextEditor">
+                    @if (_richfilemanager)
+                    {
+                        <FileManager @ref="_fileManager" Filter="@PageState.Site.ImageFiles" />
+                        <ModuleMessage Message="@_message" Type="MessageType.Warning"></ModuleMessage>
+                        <br />
+                    }
+                    <div class="d-flex justify-content-center mb-2">
+                        @if (AllowRawHtml)
+                        {
+                            <button type="button" class="btn btn-secondary" @onclick="RefreshRichText">@Localizer["SynchronizeContent"]</button>
+
+                            @((MarkupString)"&nbsp;&nbsp;")
+                        }
+                        @if (AllowFileManagement)
+                        {
+                            <button type="button" class="btn btn-primary" @onclick="InsertRichImage">@Localizer["InsertImage"]</button>
+                        }
+                        @if (_richfilemanager)
+                        {
+                            @((MarkupString)"&nbsp;&nbsp;")
+                            <button type="button" class="btn btn-secondary" @onclick="CloseRichFileManager">@Localizer["Close"]</button>
+                        }
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            <div @ref="@_toolBar">
+                                @if (ToolbarContent != null)
+                                {
+                                    @ToolbarContent
+                                }
+                                else
+                                {
+                                    <select class="ql-header">
+                                        <option selected=""></option>
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                        <option value="4"></option>
+                                        <option value="5"></option>
+                                    </select>
+                                    <span class="ql-formats">
+                                        <button class="ql-bold"></button>
+                                        <button class="ql-italic"></button>
+                                        <button class="ql-underline"></button>
+                                        <button class="ql-strike"></button>
+                                    </span>
+                                    <span class="ql-formats">
+                                        <select class="ql-color"></select>
+                                        <select class="ql-background"></select>
+                                    </span>
+                                    <span class="ql-formats">
+                                        <button class="ql-list" value="ordered"></button>
+                                        <button class="ql-list" value="bullet"></button>
+                                    </span>
+                                    <span class="ql-formats">
+                                        <button class="ql-link"></button>
+                                    </span>
+                                }
+                            </div>
+                            <div @ref="@_editorElement">
+                            </div>
+                        </div>
+                    </div>
+                </TabPanel>
+            }
 			@if (AllowRawHtml)
 			{
 				<TabPanel Name="Raw" Heading="Raw HTML Editor" ResourceKey="HtmlEditor">
@@ -106,7 +111,6 @@
 </div>
 
 @code {
-    private string _activeTab = "Rich";
     private ElementReference _editorElement;
     private ElementReference _toolBar;
     private bool _richfilemanager = false;
@@ -130,6 +134,9 @@
     [Parameter]
     public bool AllowFileManagement { get; set; } = true;
 
+    [Parameter]
+    public bool AllowRichText { get; set; } = true;  
+
     [Parameter]
     public bool AllowRawHtml { get; set; } = true;  
 
@@ -175,57 +182,59 @@
 
             await interop.LoadEditorContent(_editorElement, _richhtml);
 
-            // preserve a copy of the rich text content (Quill sanitizes content so we need to retrieve it from the editor)
-            _originalrichhtml = await interop.GetHtml(_editorElement);
-            if (_originalrichhtml != _originalrawhtml)
+            if (AllowRichText)
             {
-                _activeTab = "Raw";
-                StateHasChanged();
+                // preserve a copy of the rich text content (Quill sanitizes content so we need to retrieve it from the editor)
+                _originalrichhtml = await interop.GetHtml(_editorElement);
             }
+        }
+    }
 
-		}
-	}
+    public void CloseRichFileManager()
+    {
+        _richfilemanager = false;
+        _message = string.Empty;
+        StateHasChanged();
+    }
 
-	public void CloseRichFileManager()
-	{
-		_richfilemanager = false;
-		_message = string.Empty;
-		StateHasChanged();
-	}
+    public void CloseRawFileManager()
+    {
+        _rawfilemanager = false;
+        _message = string.Empty;
+        StateHasChanged();
+    }
 
-	public void CloseRawFileManager()
-	{
-		_rawfilemanager = false;
-		_message = string.Empty;
-		StateHasChanged();
-	}
+    public void RefreshRichText()
+    {
+        _richhtml = _rawhtml;
+        StateHasChanged();
+    }
 
-	public void RefreshRichText()
-	{
-		_richhtml = _rawhtml;
-		StateHasChanged();
-	}
+    public async Task RefreshRawHtml()
+    {
+        var interop = new RichTextEditorInterop(JSRuntime);
+        _rawhtml = await interop.GetHtml(_editorElement);
+        StateHasChanged();
+    }
 
-	public async Task RefreshRawHtml()
-	{
-		var interop = new RichTextEditorInterop(JSRuntime);
-		_rawhtml = await interop.GetHtml(_editorElement);
-		StateHasChanged();
-	}
-
-	public async Task<string> GetHtml()
-	{
-		// evaluate raw html content as first priority
-		if (_rawhtml != _originalrawhtml)
-		{
-			return _rawhtml;
-		}
-		else
-		{
-			// return rich text content if it has changed
-			var interop = new RichTextEditorInterop(JSRuntime);
-			var richhtml = await interop.GetHtml(_editorElement);
-			if (richhtml != _originalrichhtml)
+    public async Task<string> GetHtml()
+    {
+        // evaluate raw html content as first priority
+        if (_rawhtml != _originalrawhtml)
+        {
+            return _rawhtml;
+        }
+        else
+        {
+            var richhtml = "";
+            if (AllowRichText)
+            {
+                // return rich text content if it has changed
+                var interop = new RichTextEditorInterop(JSRuntime);
+                richhtml = await interop.GetHtml(_editorElement);
+            }
+            // rich text value will only be blank if AllowRichText is disabled or the JS Interop method failed
+            if (richhtml != _originalrichhtml && !string.IsNullOrEmpty(richhtml) && !string.IsNullOrEmpty(_originalrichhtml))
 			{
 				return richhtml;
 			}