@page "/editNow"
@inject NavigationManager Nav
@inject RestService api
@inject State State


<div class="max markdown-editor">
  <MarkdownEditor @ref="Editor"
    @bind-Value="@markdownValue"
    Theme="material-darker"
    MaxHeight="100%"
    />
</div>

<nav>
  <label class="checkbox" disabled="@loading">
    <InputCheckbox @bind-Value="listed" disabled="@loading"></InputCheckbox>
    <span>Include my page in the Now Garden</span>
  </label>
  <div class="max"></div>
  <button class="transparent link" onclick="history.back();" disabled="@loading">Cancel</button>
  <button @onclick="Save" disabled="@loading">
    @if (loading) {
      <span>Saving...</span>
    }
    else {
      <i class="fa-solid fa-floppy-disk"></i> <span>Save</span>
    }
  </button>
</nav>

@code {
  private MarkdownEditor? Editor;
  private bool listed;
  private string? markdownValue;

  private bool loading = false;

  protected override async Task OnInitializedAsync() {
    await base.OnInitializedAsync();
    NowContentData? data = await api.GetNowPage(State.SelectedAddressName!);
    if (data != null)
    {
      listed = data.Listed == 1;
      markdownValue = data.Content;
      await Editor!.SetValueAsync(markdownValue);
    }
    await InvokeAsync(StateHasChanged);
  }

  Task OnMarkdownValueChanged(string value) {
    return Task.CompletedTask;
  }

  public async Task Save() {
    loading = true;
    await InvokeAsync(StateHasChanged);
    var result = await api.PostNowPage(State.SelectedAddressName!, markdownValue ?? string.Empty, listed);
    if (result != null) {
      await State.RefreshNow();
      await InvokeAsync(StateHasChanged);
      Nav.NavigateTo($"/person/{State.SelectedAddressName}#now");
    }

    loading = false;
  }
}