fix(subscription): preselect pay channel before navigation

src/app/sidebar/sidebar-screen.tsx

@@ -7,7 +7,8 @@ import { useRouter } from "next/navigation";
 
 import { BackButton } from "@/app/_components";
 import { MobileShell } from "@/app/_components/core";
-import { ROUTES } from "@/router/routes";
+import { getDefaultPayChannelForCountryCode } from "@/lib/payment/default_pay_channel";
+import { ROUTE_BUILDERS, ROUTES } from "@/router/routes";
 import { useAuthDispatch, useAuthState } from "@/stores/auth/auth-context";
 import { useUserDispatch, useUserState } from "@/stores/user/user-context";
 
@@ -20,8 +21,6 @@ import {
 import styles from "./components/sidebar-screen.module.css";
 
 const FALLBACK_USERNAME = "User name";
-const VIP_SUBSCRIPTION_URL = `${ROUTES.subscription}?type=vip`;
-const TOP_UP_SUBSCRIPTION_URL = `${ROUTES.subscription}?type=topup`;
 
 export function SidebarScreen() {
   const router = useRouter();
@@ -61,6 +60,15 @@ export function SidebarScreen() {
 
   const name = user.currentUser?.username ?? FALLBACK_USERNAME;
   const avatarUrl = user.avatarUrl ?? user.currentUser?.avatarUrl ?? null;
+  const defaultPayChannel = getDefaultPayChannelForCountryCode(
+    user.currentUser?.countryCode,
+  );
+  const vipSubscriptionUrl = ROUTE_BUILDERS.subscription("vip", {
+    payChannel: defaultPayChannel,
+  });
+  const topUpSubscriptionUrl = ROUTE_BUILDERS.subscription("topup", {
+    payChannel: defaultPayChannel,
+  });
 
   return (
     <MobileShell background="#fcf3f4">
@@ -88,9 +96,9 @@ export function SidebarScreen() {
             onActivateVip={
               sidebarState === "vip"
                 ? undefined
-                : () => router.push(VIP_SUBSCRIPTION_URL)
+                : () => router.push(vipSubscriptionUrl)
             }
-            onTopUp={() => router.push(TOP_UP_SUBSCRIPTION_URL)}
+            onTopUp={() => router.push(topUpSubscriptionUrl)}
             onRulesClick={() => router.push(ROUTES.coinsRules)}
           />
         </section>