<%= form_with model: transaction, namespace: dom_id(transaction), html: { data: { controller: "auto-submit-form", list_filter_target: "list" }, class: "flex flex-col gap-0.5 p-1.5 mt-0.5 mr-2 max-h-64 overflow-y-scroll scrollbar" } do |form| %> <% Current.family.transaction_categories.each do |category| %> <% is_selected = category.id == transaction.category.try(:id) %> <%= content_tag :div, class: ["filterable-item flex items-center hover:bg-gray-25 border-none rounded-lg px-2 py-1 group", { "bg-gray-25": is_selected }], data: { filter_name: category.name } do %> <%= form.radio_button :category_id, category.id, class: "hidden", data: { auto_submit_form_target: "auto" } %> <%= label dom_id(transaction), :transaction_category_id, value: category.id, class: "flex w-full items-center gap-1.5 cursor-pointer" do %> <%= lucide_icon("check", class: "w-5 h-5 text-gray-500") if is_selected %> <%= render partial: "shared/category_badge", locals: { name: category.name, color: category.color } %> <% end %> <%= lucide_icon("more-horizontal", class: "w-5 h-5 text-gray-500") %> <% end %> <% end %> <% end %>

---