From 72d392ff273cfd01c63b795bec3a269297b73b6d Mon Sep 17 00:00:00 2001
From: Thorsten Sommer <mail@tsommer.org>
Date: Sun, 15 Sep 2024 19:00:31 +0200
Subject: [PATCH] Refactored the `ConfigurationText` component
---
.../Components/ConfigurationText.razor | 9 ++--
.../Components/ConfigurationText.razor.cs | 53 ++++++++++++++++++-
.../wwwroot/changelog/v0.9.12.md | 3 ++
3 files changed, 60 insertions(+), 5 deletions(-)
create mode 100644 app/MindWork AI Studio/wwwroot/changelog/v0.9.12.md
diff --git a/app/MindWork AI Studio/Components/ConfigurationText.razor b/app/MindWork AI Studio/Components/ConfigurationText.razor
index 73d07be2..fb76fe79 100644
--- a/app/MindWork AI Studio/Components/ConfigurationText.razor
+++ b/app/MindWork AI Studio/Components/ConfigurationText.razor
@@ -3,7 +3,7 @@
<MudTextField
T="string"
Text="@this.Text()"
- TextChanged="@this.OptionChanged"
+ TextChanged="@this.InternalUpdate"
Label="@this.OptionDescription"
Disabled="@this.Disabled()"
Class="mb-3"
@@ -11,8 +11,9 @@
AdornmentIcon="@this.Icon"
AdornmentColor="@this.IconColor"
UserAttributes="@SPELLCHECK_ATTRIBUTES"
- Lines="1"
- Immediate="@false"
- DebounceInterval="500"
+ Lines="@this.NumLines"
+ AutoGrow="@this.AutoGrow"
+ MaxLines="@this.GetMaxLines"
+ Immediate="@true"
Variant="Variant.Outlined"
/>
\ No newline at end of file
diff --git a/app/MindWork AI Studio/Components/ConfigurationText.razor.cs b/app/MindWork AI Studio/Components/ConfigurationText.razor.cs
index e6cd379e..4e6bb7f9 100644
--- a/app/MindWork AI Studio/Components/ConfigurationText.razor.cs
+++ b/app/MindWork AI Studio/Components/ConfigurationText.razor.cs
@@ -1,5 +1,7 @@
using Microsoft.AspNetCore.Components;
+using Timer = System.Timers.Timer;
+
namespace AIStudio.Components;
public partial class ConfigurationText : ConfigurationBase
@@ -11,7 +13,7 @@ public partial class ConfigurationText : ConfigurationBase
public Func<string> Text { get; set; } = () => string.Empty;
/// <summary>
- /// An action which is called when the option is changed.
+ /// An action which is called when the text was changed.
/// </summary>
[Parameter]
public Action<string> TextUpdate { get; set; } = _ => { };
@@ -27,6 +29,55 @@ public partial class ConfigurationText : ConfigurationBase
/// </summary>
[Parameter]
public Color IconColor { get; set; } = Color.Default;
+
+ /// <summary>
+ /// How many lines should the textfield have?
+ /// </summary>
+ [Parameter]
+ public int NumLines { get; set; } = 1;
+
+ /// <summary>
+ /// What is the maximum number of lines?
+ /// </summary>
+ [Parameter]
+ public int MaxLines { get; set; } = 12;
+
+ private string internalText = string.Empty;
+ private Timer timer = new(TimeSpan.FromMilliseconds(500))
+ {
+ AutoReset = false
+ };
+
+ #region Overrides of ConfigurationBase
+
+ protected override async Task OnInitializedAsync()
+ {
+ this.timer.Elapsed += async (_, _) => await this.InvokeAsync(async () => await this.OptionChanged(this.internalText));
+ await base.OnInitializedAsync();
+ }
+
+ #region Overrides of ComponentBase
+
+ protected override async Task OnParametersSetAsync()
+ {
+ this.internalText = this.Text();
+ await base.OnParametersSetAsync();
+ }
+
+ #endregion
+
+ #endregion
+
+ private bool AutoGrow => this.NumLines > 1;
+
+ private int GetMaxLines => this.AutoGrow ? this.MaxLines : 1;
+
+ private void InternalUpdate(string text)
+ {
+ this.timer.Stop();
+ this.internalText = text;
+ this.timer.Start();
+ }
private async Task OptionChanged(string updatedText)
{
diff --git a/app/MindWork AI Studio/wwwroot/changelog/v0.9.12.md b/app/MindWork AI Studio/wwwroot/changelog/v0.9.12.md
new file mode 100644
index 00000000..2837560d
--- /dev/null
+++ b/app/MindWork AI Studio/wwwroot/changelog/v0.9.12.md
@@ -0,0 +1,3 @@
+# v0.9.12, build 187 (2024-09-xx xx:xx UTC)
+
+- Refactored the `ConfigurationText` component to debounce the input field to prevent unnecessary configuration updates. The component now also supports multiline text.
\ No newline at end of file