[frontend/components] Add PromptDialog

Iceshrimp.Frontend/Components/GlobalComponents.razor

@@ -2,6 +2,7 @@
 <BannerContainer />
 <ConfirmDialog />
 <NoticeDialog />
+<PromptDialog />
 <StreamingStatus />
 @code {
 }

Iceshrimp.Frontend/Components/PromptDialog.razor

@@ -0,0 +1,74 @@
+@using Iceshrimp.Frontend.Core.Services
+@using Iceshrimp.Frontend.Localization
+@using Microsoft.Extensions.Localization
+@inject GlobalComponentSvc             GlobalComponentSvc;
+@inject IJSRuntime                     Js;
+@inject IStringLocalizer<Localization> Loc;
+
+<dialog class="dialog" @ref="Dialog">
+    <div class="prompt">
+        <span>@Text</span>
+        @if (MultiLine)
+        {
+            <textarea class="input" @bind="Input" @bind:event="oninput" rows="5" placeholder="@Placeholder"></textarea>
+        }
+        else
+        {
+            <input type="text" class="input" @bind="Input" @bind:event="oninput" placeholder="@Placeholder"/>
+        }
+        <div class="buttons">
+            <button class="btn submit-btn" @onclick="ConfirmAction"
+                    disabled="@string.IsNullOrWhiteSpace(Input)">@(ButtonText ?? Loc["Submit"])</button>
+            <button class="btn" @onclick="CancelAction">@Loc["Cancel"]</button>
+        </div>
+    </div>
+</dialog>
+
+@code {
+    private ElementReference       Dialog { get; set; }
+    private IJSObjectReference     _module = null!;
+    private EventCallback<string?> Action      { get; set; }
+    private string                 Text        { get; set; } = "";
+    private string                 Placeholder { get; set; } = "";
+    private bool                   MultiLine   { get; set; }
+    private string?                ButtonText  { get; set; }
+    private string                 Input       { get; set; } = "";
+
+    private async Task CloseDialog()
+    {
+        await _module.InvokeVoidAsync("closeDialog", Dialog);
+    }
+
+    public async Task Prompt(EventCallback<string?> action, string text, string placeholder, bool multiLine = false, string? buttonText = null)
+    {
+        Action      = action;
+        Text        = text;
+        Placeholder = placeholder;
+        MultiLine   = multiLine;
+        ButtonText  = buttonText;
+        Input       = "";
+
+        StateHasChanged();
+
+        await _module.InvokeVoidAsync("openDialog", Dialog);
+    }
+
+    private async Task ConfirmAction()
+    {
+        await Action.InvokeAsync(MultiLine ? Input.ReplaceLineEndings("\n").Trim() : Input.ReplaceLineEndings(" ").Trim());
+        await CloseDialog();
+    }
+
+    private async Task CancelAction()
+    {
+        await Action.InvokeAsync(null);
+        await CloseDialog();
+    }
+
+    protected override async Task OnInitializedAsync()
+    {
+        _module = await Js.InvokeAsync<IJSObjectReference>("import",
+                                                           "./Components/PromptDialog.razor.js");
+        GlobalComponentSvc.PromptDialog = this;
+    }
+}

Iceshrimp.Frontend/Components/PromptDialog.razor.css

@@ -0,0 +1,45 @@
+.dialog {
+    margin: auto;
+}
+
+.dialog::backdrop {
+    opacity: 50%;
+    background-color: black;
+}
+
+.prompt {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 0.5rem;
+    background-color: var(--background-color);
+    border-radius: 1rem;
+    margin: auto;
+    padding: 1rem;
+    min-width: 12rem;
+    width: max-content;
+    max-width: 45rem;
+    color: var(--font-color);
+    text-align: center;
+    text-wrap: wrap;
+    word-break: break-word;
+}
+
+.prompt textarea {
+    width: 100%;
+}
+
+.buttons {
+    display: flex;
+    gap: 0.5rem;
+}
+
+.submit-btn {
+    background: var(--accent-color);
+    color: var(--font-color);
+}
+
+.submit-btn[disabled] {
+    opacity: 0.4;
+    cursor: not-allowed;
+}

Iceshrimp.Frontend/Components/PromptDialog.razor.js

@@ -0,0 +1,7 @@
+export function openDialog(element) {
+    element.showModal()
+}
+
+export function closeDialog(element) {
+    element.close()
+}

Iceshrimp.Frontend/Core/Services/GlobalComponentSvc.cs

@@ -8,4 +8,5 @@ public class GlobalComponentSvc
     public BannerContainer? BannerComponent { get; set; }
     public ConfirmDialog?   ConfirmDialog   { get; set; }
     public NoticeDialog?    NoticeDialog    { get; set; }
+    public PromptDialog?    PromptDialog    { get; set; }
 }