<.form
  for={@form}
  phx-change="validate"
  phx-submit="save"
  class="flex flex-col md:flex-row p-4 gap-4"
>
  <div class="flex-grow flex flex-col gap-y-4">
    <.input :if={@post.kind == :blog} type="text" label="title" field={@form[:title]} />
    <.input type="textarea" field={@form[:body]} label="body" class="md:flex-grow" />
  </div>
  <div class="md:w-80 flex flex-col gap-y-2">
    <.button type="submit" class="self-end">save</.button>
    <.link
      :if={@post.published_at}
      class="self-end"
      navigate={Web.Paths.public_post_path(@post)}
      target="_blank"
    >
      view
    </.link>
    <.input type="datetime-local" label="published (utc)" field={@form[:published_at]} />
    <%= if @post.published_at do %>
      <.button phx-click="unpublish" class="self-end">unpublish</.button>
    <% else %>
      <.button phx-click="publish" class="self-end">publish</.button>
    <% end %>
    <.input type="datetime-local" label="deleted (utc)" field={@form[:deleted_at]} />
    <%= if @post.deleted_at do %>
      <.button phx-click="undelete" class="self-end">undelete</.button>
    <% else %>
      <.button phx-click="delete" class="self-end">delete</.button>
    <% end %>
    <.input
      :if={@post.kind == :blog}
      label="slug"
      type="text"
      field={@form[:slug]}
      disabled={not update_slug?(@post)}
    />
  </div>
</.form>