fix(subscription): preselect pay channel before navigation

src/app/subscription/use-subscription-payment-flow.ts

@@ -16,6 +16,7 @@ import {
   usePaymentState,
 } from "@/stores/payment/payment-context";
 import { useUserDispatch } from "@/stores/user/user-context";
+import type { PayChannel } from "@/data/dto/payment";
 
 import type { SubscriptionType } from "./subscription-screen.helpers";
 
@@ -23,12 +24,14 @@ export interface UseSubscriptionPaymentFlowInput {
   subscriptionType: SubscriptionType;
   shouldResumePendingOrder: boolean;
   returnTo: "chat" | null;
+  initialPayChannel: PayChannel;
 }
 
 export function useSubscriptionPaymentFlow({
   subscriptionType,
   shouldResumePendingOrder,
   returnTo,
+  initialPayChannel,
 }: UseSubscriptionPaymentFlowInput) {
   const router = useRouter();
   const userDispatch = useUserDispatch();
@@ -37,14 +40,37 @@ export function useSubscriptionPaymentFlow({
   const refreshedPaidOrderRef = useRef<string | null>(null);
   const resumedPendingOrderRef = useRef<string | null>(null);
   const successDialogShownOrderRef = useRef<string | null>(null);
+  const initialPayChannelAppliedRef = useRef(false);
   const [showPaymentSuccessDialog, setShowPaymentSuccessDialog] =
     useState(false);
 
   useEffect(() => {
     if (payment.status === "idle") {
-      paymentDispatch({ type: "PaymentInit" });
+      initialPayChannelAppliedRef.current = true;
+      paymentDispatch({
+        type: "PaymentInit",
+        payChannel: initialPayChannel,
+      });
+      return;
     }
-  }, [payment.status, paymentDispatch]);
+
+    if (
+      !initialPayChannelAppliedRef.current &&
+      payment.status === "ready"
+    ) {
+      initialPayChannelAppliedRef.current = true;
+      if (payment.payChannel === initialPayChannel) return;
+      paymentDispatch({
+        type: "PaymentPayChannelChanged",
+        payChannel: initialPayChannel,
+      });
+    }
+  }, [
+    initialPayChannel,
+    payment.payChannel,
+    payment.status,
+    paymentDispatch,
+  ]);
 
   useEffect(() => {
     if (!payment.isPaid || !payment.currentOrderId) return;