refactor(payment): unify method selector visibility

src/app/_components/payment/payment-method-selector.tsx

@@ -3,6 +3,7 @@
 import Image from "next/image";
 
 import type { PayChannel } from "@/data/schemas/payment";
+import type { PaymentMethodConfig } from "@/lib/payment/payment_method";
 
 const PAYMENT_METHODS: readonly {
   channel: PayChannel;
@@ -21,24 +22,28 @@ const PAYMENT_METHODS: readonly {
 ];
 
 export interface PaymentMethodSelectorProps {
+  config: PaymentMethodConfig;
   value: PayChannel;
-  defaultChannel?: PayChannel;
   disabled?: boolean;
   caption?: string;
+  className?: string;
   analyticsKey: string;
   onChange: (channel: PayChannel) => void;
 }
 
 export function PaymentMethodSelector({
+  config,
   value,
-  defaultChannel = "stripe",
   disabled = false,
   caption = "Stripe by default",
+  className,
   analyticsKey,
   onChange,
 }: PaymentMethodSelectorProps) {
+  if (!config.canChoosePaymentMethod) return null;
+
   const paymentMethods =
-    defaultChannel === "ezpay"
+    config.initialPayChannel === "ezpay"
       ? [...PAYMENT_METHODS].sort((a, b) =>
           a.channel === "ezpay" ? -1 : b.channel === "ezpay" ? 1 : 0,
         )
@@ -46,7 +51,7 @@ export function PaymentMethodSelector({
 
   return (
     <section
-      className="flex flex-col gap-[clamp(8px,1.852vw,10px)]"
+      className={`flex flex-col gap-[clamp(8px,1.852vw,10px)] ${className ?? ""}`.trim()}
       aria-labelledby="payment-method-title"
     >
       <div className="flex items-baseline justify-between gap-sm px-xs">