takes navigation props now. upon getting the payment url we go to qr screen

src/hooks/useWave.tsx

 import { useModalsManagerContext } from "@/contexts/ModalsManagerContext";
+import type { IpaymentStackNavigator } from "@/navigations/Types";
 import {
 	type IwavePaymentStarter,
 	getTransactionStatus,
@@ -6,6 +7,7 @@ import {
 } from "@/utils/requests/wavePayment";
 import LoadingModal from "@components/modals/LoadingModal";
 import { LOG } from "@logger";
+import type { NativeStackNavigationProp } from "@react-navigation/native-stack";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import * as WebBrowser from "expo-web-browser";
 import { useState } from "react";
@@ -20,7 +22,13 @@ const paymentObjectDefault: IwavePaymentStarter = {
 	montant: 0,
 };
 
-const useWave = () => {
+const useWave = (
+	navigation?: NativeStackNavigationProp<
+		IpaymentStackNavigator,
+		"paymentAmountInputScreen",
+		"IpaymentStackNavigator"
+	>,
+) => {
 	const { showModal, closeModal } = useModalsManagerContext();
 	const [isBrowserOpen, setIsBrowserOpen] = useState(false);
 
@@ -101,9 +109,15 @@ const useWave = () => {
 			showModal(<LoadingModal message="Initialization de la transaction." />);
 
 			const response = await waveTransactionInitializerMutation.mutateAsync(amount);
-			log.info("waveTransactionHandler :: ", response.wave_launch_url);
-			log.info("Opening browser for payment...");
-			await openBrowserThenCheckStatus(response.wave_launch_url, response.id);
+			log.info("waveTransactionHandler payment url received :: ", response.wave_launch_url);
+			// log.info("Opening browser for payment...");
+			log.info("Navigating to the qr code screen...");
+			closeModal();
+			navigation
+				?.getParent()
+				?.navigate("waveQrCodePaymentScreen", { paymentUrl: response.wave_launch_url });
+
+			// await openBrowserThenCheckStatus(response.wave_launch_url, response.id);
 		} catch (error) {
 			log.error("waveTransactionHandler |", error);
 			throw error;