@inject IJSRuntime JS

<article class="paste">
  @* TODO: link to paste view *@
  <nav>
    <h5 class="mono"><a href="/pastes/tbc">@Paste.Title</a></h5>
    <div class="max"></div>
    @if (MarkupView)
    {
      <button class="transparent circle" title="View Original" @onclick="() => { MarkupView = false; InvokeAsync(StateHasChanged); }"><i class="fa-solid fa-code"></i></button>
    }
    else
    {
      <button class="transparent circle" title="View Markup" @onclick="() => { MarkupView = true; InvokeAsync(StateHasChanged); }"><i class="fa-solid fa-browser"></i></button>
    }
    <button class="transparent circle" title="Copy to Clipboard" @onclick="() => Clipboard.Default.SetTextAsync(Paste.Content)"><i class="fa-solid fa-copy"></i></button>
    <button class="transparent circle" @onclick="ShareClick">
      <i class="fa-solid fa-share-nodes"></i>
    </button>
  </nav>
  <small class="nowrap gray-5-fg"><i class="fa-solid fa-clock tiny"></i> @Paste.RelativeTime</small>
  @if(MarkupView){
    <div class="padding">
      @Utilities.MdToHtmlMarkup(Paste.Content)
    </div>
  }
  else {
    <pre><code class="padding margin">@((MarkupString)Paste.Content)</code></pre>
  }
  <nav>
    <div class="max"></div>
    @if (Editable) {
      <button @onclick="EditPaste"><i class="fa-solid fa-pencil"></i> Edit</button>
    }
  </nav>
</article>

@code {
  [Parameter]
  public Paste? Paste { get; set; }
  [Parameter]
  public bool Editable { get; set; } = false;
  [Parameter]
  public EditPasteDialog? Dialog { get; set; }

  private bool MarkupView = false;

  private async Task EditPaste(EventArgs e) {
    Dialog!.Paste = Paste;
    await InvokeAsync(StateHasChanged);
    await JS.InvokeVoidAsync("ui", "#" + Dialog?.id);
  }

  public async Task ShareClick(EventArgs e) {
    await Share.Default.RequestAsync(new ShareTextRequest {
        Uri = Paste!.Url,
        Text = Paste!.Content,
        Title = Paste!.Title,
        Subject = Paste!.Title
      });
  }
}