theseus/app/views/letter/queues/_form.html.erb

<%= form_with(model: letter_queue, 
             url: letter_queue.is_a?(Letter::InstantQueue) ? 
                  (letter_queue.new_record? ? letter_instant_queues_path : letter_instant_queue_path(letter_queue)) : 
                  (letter_queue.new_record? ? letter_queues_path : letter_queue_path(letter_queue)),
             scope: letter_queue.is_a?(Letter::InstantQueue) ? :letter_instant_queue : :letter_queue) do |form| %>
  <% if letter_queue.errors.any? %>
    <div style="color: red">
      <h2><%= pluralize(letter_queue.errors.count, "error") %> prohibited this letter_queue from being saved:</h2>
      <ul>
        <% letter_queue.errors.each do |error| %>
          <li><%= error.full_message %></li>
        <% end %>
      </ul>
    </div>
  <% end %>
  <h3>the important part:</h3>
  <div class="grid md:grid-cols-2 gap-4">
    <div class="form-group">
      <%= form.label :name, class: "form-label" %>
      <%= form.text_field :name, class: "form-control" %>
    </div>
    <div class="form-group">
      <%= form.label :user_facing_title, "Display Title", class: "form-label" %>
      <%= form.text_field :user_facing_title, class: "form-control", placeholder: "Optional title that will be shown to users" %>
    </div>
    <div class="form-group">
      <%= render 'shared/tag_picker', form: form %>
    </div>
  </div>
  <% if letter_queue.new_record? %>
    <div class="form-group">
      <%= form.label :type, "Queue Type", class: "form-label" %>
      <%= form.select :type, 
        [
          ["Regular Queue", "Letter::Queue"],
          ["Instant Queue", "Letter::InstantQueue"]
        ],
        { selected: letter_queue.type || "Letter::Queue" },
        { class: "form-control", onchange: "toggleQueueType(this)" } %>
    </div>
  <% end %>
  <h3>set defaults for letters:</h3>
  <div class="form-group">
    <%= form.label :template, "Label Template", class: "form-label" %>
    <%= form.hidden_field :template, id: "selected_template", value: letter_queue.template %>
    <%= render "shared/template_picker", multiple: false, show_all: true %>
  </div>
  <%= render 'letters/letter_attributes_form', form: form, is_batch: true %>
  <div class="form-group">
    <%= form.label :letter_mailer_id_id, "USPS Mailer ID", class: "form-label" %>
    <%= form.collection_select :letter_mailer_id_id,
                             USPS::MailerId.all,
                             :id,
                             :display_name,
                             { selected: current_user.home_mid_id },
                             { class: "form-control" } %>
  </div>
  <div class="form-group">
    <%= form.label :letter_return_address_id, "Return Address", class: "form-label" %>
    <%= link_to "(manage)", return_addresses_path, class: "text-sm" %>
    <%= form.collection_select :letter_return_address_id,
                             ReturnAddress.shared.or(ReturnAddress.owned_by(current_user)),
                             :id,
                             :display_name,
                             { selected: current_user.home_return_address_id },
                             { class: "form-control" } %>
  </div>
  <div class="form-group">
    <%= form.label :letter_return_address_name, "custom return address name", class: "form-label" %>
    <%= form.text_field :letter_return_address_name, class: "form-control", placeholder: "leave blank to use the address' default name" %>
  </div>
  <%# Instant Queue specific fields %>
  <div id="instantFields" style="display: <%= letter_queue.is_a?(Letter::InstantQueue) ? 'block' : 'none' %>">
    <h3>Instant Queue Settings</h3>
    <div class="form-group">
      <%= form.label :postage_type, "Postage Type", class: "form-label" %>
      <%= form.select :postage_type,
                     [["Indicia", "indicia"], ["Stamps", "stamps"], ["International Origin", "international_origin"]],
                     { selected: letter_queue.postage_type || "indicia" },
                     { class: "form-control", onchange: "togglePaymentAccount(this)" } %>
    </div>
    <div class="form-group" id="paymentAccountField" style="display: <%= letter_queue.postage_type == 'indicia' ? 'block' : 'none' %>">
      <%= form.label :usps_payment_account_id, "USPS Payment Account", class: "form-label" %>
      <%= form.collection_select :usps_payment_account_id,
                               USPS::PaymentAccount.all,
                               :id,
                               :display_name,
                               { selected: letter_queue.usps_payment_account_id },
                               { class: "form-control" } %>
    </div>
    <div class="form-group" id="hcbPaymentAccountField" style="display: <%= letter_queue.postage_type == 'indicia' ? 'block' : 'none' %>">
      <%= form.label :hcb_payment_account_id, "Pay with HCB Organization", class: "form-label" %>
      <% if current_user.hcb_payment_accounts.any? %>
        <%= form.collection_select :hcb_payment_account_id,
                                 current_user.hcb_payment_accounts,
                                 :id,
                                 :organization_name,
                                 { selected: letter_queue.hcb_payment_account_id, prompt: "Select an organization" },
                                 { class: "form-control", required: true } %>
      <% else %>
        <p class="text-sm text-gray-600">
          <%= link_to "Connect your HCB account", new_hcb_oauth_connection_path %> to use indicia.
        </p>
      <% end %>
    </div>
    <div class="form-group">
      <%= form.label :include_qr_code, "Include QR Code", class: "form-label" %>
      <%= form.check_box :include_qr_code, class: "form-checkbox", checked: letter_queue.include_qr_code.nil? ? true : letter_queue.include_qr_code %>
    </div>
  </div>
  <% admin_tool do %>
    <div>
      <%= form.label :slug, style: "display: block" %>
      <%= form.text_field :slug %>
    </div>
  <% end %>
  <div class="form-group mt-4">
    <%= form.submit class: "btn success" %>
  </div>
<% end %>
<script>
  function toggleQueueType(select) {
    const instantFields = document.getElementById('instantFields');
    instantFields.style.display = select.value === "Letter::InstantQueue" ? "block" : "none";
  }

  function togglePaymentAccount(select) {
    const paymentAccountField = document.getElementById('paymentAccountField');
    const hcbPaymentAccountField = document.getElementById('hcbPaymentAccountField');
    if (paymentAccountField) paymentAccountField.style.display = select.value === "indicia" ? "block" : "none";
    if (hcbPaymentAccountField) hcbPaymentAccountField.style.display = select.value === "indicia" ? "block" : "none";
  }

  const typeSelect = document.getElementById('letter_queue_type');
  if (typeSelect) toggleQueueType(typeSelect);
  
  const postageSelect = document.getElementById('letter_queue_postage_type') || document.getElementById('letter_instant_queue_postage_type');
  if (postageSelect) togglePaymentAccount(postageSelect);
</script>