Test :: fetch the payments types on screen opening

src/screens/HomePageWithPaymentOptions.tsx

 import type { PaymentStackScreenComponentProps } from "@/navigations/Types";
+import getPaymentTypes from "@/utils/requests/getPaymentTypes";
 import BalanceContainer from "@components/BalanceContainer";
 import BeasyLogoIcon from "@components/BeasyLogoIcon";
 import NotificationIconButton from "@components/NotificationIconButton";
@@ -6,11 +7,21 @@ import PaymentOption from "@components/PaymentOption";
 import BackgroundGreenWhiteContentArea from "@components/backgrounds/BackgroundGreenWhiteContentArea";
 import Box from "@components/bases/Box";
 import Text from "@components/bases/Text";
+import { useQuery } from "@tanstack/react-query";
 import { Dimensions } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
 
 const HomePageWithPaymentOptions: PaymentStackScreenComponentProps<"homePageWithPaymentOptions"> =
 	({ navigation }) => {
+		const { data, isLoading, error } = useQuery({
+			queryKey: ["paymentTypes"],
+			queryFn: getPaymentTypes,
+			enabled: true,
+		});
+
+		console.log("data", data);
+		console.log("isLoading", isLoading);
+		console.log("error", error);
 		return (
 			<BackgroundGreenWhiteContentArea>
 				<SafeAreaView>