feat(payment): share payment method selector

src/app/subscription/components/__tests__/tailwind-components.test.tsx

@@ -4,7 +4,6 @@ import { describe, expect, it } from "vitest";
 import { StripePaymentDialog } from "@/app/_components/payment/stripe-payment-dialog";
 
 import { SubscriptionCtaButton } from "../subscription-cta-button";
-import { SubscriptionPaymentMethod } from "../subscription-payment-method";
 import { SubscriptionPaymentSuccessDialog } from "../subscription-payment-success-dialog";
 import { SubscriptionCoinsOfferSection } from "../subscription-coins-offer-section";
 import { SubscriptionVipOfferSection } from "../subscription-vip-offer-section";
@@ -49,38 +48,6 @@ describe("subscription Tailwind components", () => {
     expect(html).toContain("OK");
   });
 
-  it("renders SubscriptionPaymentMethod with default ordering and selection", () => {
-    const html = renderToStaticMarkup(
-      <SubscriptionPaymentMethod
-        value="ezpay"
-        defaultChannel="ezpay"
-        caption="GCash by default"
-        onChange={() => undefined}
-      />,
-    );
-
-    expect(html).toContain('aria-labelledby="payment-method-title"');
-    expect(html).toContain("Payment Method");
-    expect(html).toContain("GCash by default");
-    expect(html.indexOf('aria-label="GCash"')).toBeLessThan(
-      html.indexOf('aria-label="Stripe"'),
-    );
-    const selectedButton = html.match(
-      /<button[^>]*aria-pressed="true"[^>]*>/,
-    )?.[0];
-    expect(selectedButton).toBeDefined();
-    expect(selectedButton).toContain(
-      'data-analytics-key="subscription.payment_method"',
-    );
-    expect(selectedButton).toContain("border-[#f657a0]");
-    expect(selectedButton).not.toContain("border-[rgba(246,87,160,0.18)]");
-    expect(selectedButton).toContain("bg-[#fff4f9]");
-    expect(selectedButton).not.toContain("bg-white");
-    expect(selectedButton).toContain("0_0_0_3px_rgba(217,47,127,0.18)");
-    expect(selectedButton).toContain("-translate-y-0.5");
-    expect(html).toContain("/images/subscription/gcash-logo.svg");
-  });
-
   it("renders StripePaymentDialog fallback with Tailwind dialog utilities", () => {
     const html = renderToStaticMarkup(
       <StripePaymentDialog