<div class="flex flex-col py-4 px-6">
  <header class="mb-4">
    <nav>
      <ul class="flex flex-row gap-x-4">
        <li>
          <.link navigate={~p"/admin/writing"}>
            writing
          </.link>
        </li>
        <li>
          <.link navigate={~p"/admin/microblog"}>
            microblog
          </.link>
        </li>
        <li>
          <.link class="underline" patch={~p"/admin/syndication"}>
            syndication
          </.link>
        </li>
      </ul>
    </nav>
  </header>

  <main class="flex flex-col">
    <div>
      <strong>Mastodon: </strong>
      <%= if @mastodon_account do %>
        <.link href={@mastodon_account.uid} target="_blank">{@mastodon_account.uid}</.link>
      <% else %>
        <.link href={~p"/auth/mastodon"}>Connect account</.link>
      <% end %>
    </div>
    <div>
      <strong>Bluesky: </strong>Coming soon!
    </div>
  </main>
</div>