Enable edit statuslog bio

This commit is contained in:
Gordon Pedersen 2024-07-23 11:12:52 +10:00
parent 909038ff79
commit 6e5b206c20
6 changed files with 100 additions and 5 deletions

View file

@ -167,10 +167,11 @@ namespace Neighbourhood.omg.lol
public async Task<List<Status>> Statuslog(string address) =>
(await Get<StatusResponseData>($"/address/{address}/statuses"))?.Statuses ?? new List<Status>();
public async Task<MarkupString> StatuslogBio(string address) {
StatusBioResponseData? responseData = await Get<StatusBioResponseData>($"/address/{address}/statuses/bio");
return Utilities.MdToHtmlMarkup(responseData?.Bio ?? "");
}
public async Task<string> StatuslogBio(string address) =>
(await Get<StatusBioResponseData>($"/address/{address}/statuses/bio"))?.Bio ?? string.Empty;
public async Task<string> PostStatuslogBio(string address, string bio) =>
(await Post<StatusBioResponseData, PostStatusBio>($"/address/{address}/statuses/bio", new PostStatusBio() { Content = bio }))?.Bio ?? string.Empty;
public async Task<AccountResponseData?> AccountInfo() =>
await Get<AccountResponseData>("/account/application/info");

View file

@ -224,7 +224,7 @@ namespace Neighbourhood.omg.lol {
public async Task<MarkupString?> GetBio(string address, bool forceRefresh = false) {
CachedAddress = address;
if (forceRefresh || CachedAddressBio == null) {
CachedAddressBio = await api.StatuslogBio(address);
CachedAddressBio = Utilities.MdToHtmlMarkup(await api.StatuslogBio(address));
}
return CachedAddressBio;
}

View file

@ -0,0 +1,79 @@
@inject IJSRuntime JS
@inject State State
@inject ApiService api
<div class="overlay" data-ui="#@id"></div>
<dialog id="@id">
<h5>Edit your statuslog bio</h5>
<div class="row">
<div class="max markdown-editor">
@if (Bio != null) {
<MarkdownEditor @ref="Editor"
@bind-Value="@Bio"
Theme="material-darker"
MaxHeight="100%">
<Toolbar>
<MarkdownToolbarButton Action="MarkdownAction.Bold" Icon="fa-solid fa-bold" Title="Bold" />
<MarkdownToolbarButton Action="MarkdownAction.Italic" Icon="fa-solid fa-italic" Title="Italic" />
<MarkdownToolbarButton Action="MarkdownAction.Heading" Icon="fa-solid fa-heading" Title="Heading" />
<MarkdownToolbarButton Action="MarkdownAction.Code" Icon="fa-solid fa-code" Title="Code" Separator="true" />
<MarkdownToolbarButton Action="MarkdownAction.Quote" Icon="fa-solid fa-quote-left" Title="Quote" />
<MarkdownToolbarButton Action="MarkdownAction.UnorderedList" Icon="fa-solid fa-list-ul" Title="Unordered List" />
<MarkdownToolbarButton Action="MarkdownAction.OrderedList" Icon="fa-solid fa-list-ol" Title="Ordered List" />
<MarkdownToolbarButton Action="MarkdownAction.Link" Icon="fa-solid fa-link" Title="Link" Separator="true" />
<MarkdownToolbarButton Action="MarkdownAction.Image" Icon="fa-solid fa-image" Title="Image" />
<MarkdownToolbarButton Action="MarkdownAction.HorizontalRule" Icon="fa-solid fa-horizontal-rule" Title="Horizontal Rule" />
<MarkdownToolbarButton Action="MarkdownAction.Guide" Icon="fa-solid fa-circle-question" Title="Guide" Separator="true" />
</Toolbar>
</MarkdownEditor>
}
</div>
</div>
<nav class="no-space">
<div class="max"></div>
<button class="transparent link" data-ui="#@id" disabled="@loading">Cancel</button>
<button @onclick="PostBio" disabled="@loading">
@if (loading) {
<span>Saving...</span>
}
else {
<i class="fa-solid fa-floppy-disk"></i> <span>Save</span>
}
</button>
</nav>
</dialog>
@code {
private MarkdownEditor? Editor;
public string? Bio { get; set; }
[Parameter]
public string? Address { get; set; }
private bool loading = true;
[Parameter]
public string? id { get; set; }
protected override async Task OnInitializedAsync() {
await base.OnInitializedAsync();
Bio = await api.StatuslogBio(Address ?? State.SelectedAddressName!);
await InvokeAsync(StateHasChanged);
await Editor!.SetValueAsync(Bio);
loading = false;
await InvokeAsync(StateHasChanged);
}
public async Task PostBio() {
loading = true;
await InvokeAsync(StateHasChanged);
// Post the bio
await api.PostStatuslogBio(Address!, Bio ?? string.Empty);
State.CachedAddressBio = Utilities.MdToHtmlMarkup(Bio ?? string.Empty);
await JS.InvokeVoidAsync("ui", "#" + id);
// reset input
await OnInitializedAsync();
loading = false;
await InvokeAsync(StateHasChanged);
State.SendRefresh();
}
}

View file

@ -79,6 +79,12 @@
</article>
</div>
}
@if (IsMe) {
<EditBioDialog id="edit-bio" Address="@Address"></EditBioDialog>
<div class="row center-align">
<button data-ui="#edit-bio"><i class="fa-solid fa-pencil"></i> Edit Bio</button>
</div>
}
<StatusList @ref="StatusList" StatusFunc="@(async(refresh) => await State.GetStatuses(Address, refresh))" Editable="@IsMe"></StatusList>
@if(IsMe) {
<button class="fab circle extra large-elevate" data-ui="#post-modal">

View file

@ -0,0 +1,5 @@
namespace Neighbourhood.omg.lol.Models {
public class PostStatusBio {
public string Content { get; set; } = string.Empty;
}
}

View file

@ -94,6 +94,10 @@ dialog {
width: 80%
}
dialog#edit-bio {
overflow: scroll;
}
.invisible {
max-width: 0;
max-height: 0;