new.html.erb

<% @page_title = "Generate an access token for #{@bot.name}" %>

<% content_for :header do %>
  <div class="header__actions header__actions--start">
    <%= back_link_to @bot.name, account_bot_path(@bot), "keydown.left@document->hotkey#click keydown.esc@document->hotkey#click" %>
  </div>

  <h1 class="header__title" data-bridge--title-target="header"><%= @page_title %></h1>
<% end %>

<article class="panel panel--wide shadow center txt-align-start" style="view-transition-name: <%= dom_id(@access_token) %>">
  <%= form_with model: @access_token, url: account_bot_access_tokens_path(@bot), scope: :access_token, data: { controller: "form" }, html: { class: "flex flex-column gap" } do |form| %>
    <div class="flex flex-column gap-half">
      <strong><%= form.label :description, "Access token description" %></strong>
      <%= form.text_field :description, required: true, autofocus: true, class: "input", placeholder: "e.g. CI/CD pipeline", data: { action: "keydown.esc@document->form#cancel" } %>
    </div>

    <div class="flex flex-column gap-half">
      <strong><%= form.label :permission %></strong>
      <%= form.select :permission, options_for_select({ "Read" => "read", "Read + Write" => "write" }, "write"), {}, class: "input input--select" %>
    </div>

    <%= form.button type: :submit, class: "btn btn--link center txt-medium" do %>
      <span>Generate access token</span>
    <% end %>

    <%= link_to "Cancel and go back", account_bot_path(@bot), data: { form_target: "cancel" }, hidden: true %>
  <% end %>
</article>