fix: normalize checkbox value and improve UI layout

- Normalize checkbox 'on' value to boolean true in settings
- Change Payment Data layout to flex-nowrap for horizontal display
- Replace membership fee type dropdown with display-only view
- Fix tests to use correct button selectors and switch to membership fees tab

lib/mv_web/live/member_live/show/membership_fees_component.ex

@@ -24,31 +24,22 @@ defmodule MvWeb.MemberLive.Show.MembershipFeesComponent do
     ~H"""
     <div id={@id}>
       <.section_box title={gettext("Membership Fees")}>
-        <%!-- Membership Fee Type Selection --%>
+        <%!-- Membership Fee Type Display --%>
         <div class="mb-6">
           <label class="label">
             <span class="label-text font-semibold">{gettext("Membership Fee Type")}</span>
           </label>
-          <select
-            class="select select-bordered w-full max-w-xs"
-            phx-change="change_membership_fee_type"
-            phx-target={@myself}
-            value={@member.membership_fee_type_id || ""}
-          >
-            <option value="">{gettext("None")}</option>
-            <%= for fee_type <- @available_fee_types do %>
-              <option value={fee_type.id} selected={fee_type.id == @member.membership_fee_type_id}>
-                {fee_type.name} ({MembershipFeeHelpers.format_currency(fee_type.amount)}, {MembershipFeeHelpers.format_interval(
-                  fee_type.interval
+          <%= if @member.membership_fee_type do %>
+            <div class="flex items-center gap-2">
+              <span class="font-medium">{@member.membership_fee_type.name}</span>
+              <span class="text-base-content/60">
+                ({MembershipFeeHelpers.format_currency(@member.membership_fee_type.amount)}, {MembershipFeeHelpers.format_interval(
+                  @member.membership_fee_type.interval
                 )})
-              </option>
-            <% end %>
-          </select>
-          <%= if @interval_warning do %>
-            <div class="alert alert-warning mt-2">
-              <.icon name="hero-exclamation-triangle" class="size-5" />
-              <span>{@interval_warning}</span>
+              </span>
             </div>
+          <% else %>
+            <span class="text-base-content/60 italic">{gettext("No membership fee type assigned")}</span>
           <% end %>
         </div>