From cc69d77721c40435ec1c11998f06d6df6bc51564 Mon Sep 17 00:00:00 2001
From: G <idouattara@ldfgroupe.com>
Date: Wed, 8 May 2024 11:34:39 +0000
Subject: [PATCH] sample, will be changed later

---
 src/components/PaymentsOptionsRendererTwoColumn.tsx | 58 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 58 insertions(+)
 create mode 100644 src/components/PaymentsOptionsRendererTwoColumn.tsx

diff --git a/src/components/PaymentsOptionsRendererTwoColumn.tsx b/src/components/PaymentsOptionsRendererTwoColumn.tsx
new file mode 100644
index 0000000..9344433
--- /dev/null
+++ b/src/components/PaymentsOptionsRendererTwoColumn.tsx
@@ -0,0 +1,58 @@
+import type React from "react";
+import { Dimensions, View } from "react-native";
+import PaymentOption from "./PaymentOption";
+import Box from "./bases/Box";
+
+const PaymentsOptionsRendererTwoColumn = () => {
+	return (
+		<View>
+			<Box flexDirection={"row"} justifyContent={"space-between"} mb={"s"}>
+				<PaymentOptionContainer>
+					<PaymentOption
+						onPress={() => navigation.navigate("paymentAmountInputScreen")}
+						paymentMethod={"OrangeMoney"}
+					/>
+				</PaymentOptionContainer>
+				<PaymentOptionContainer>
+					<PaymentOption
+						onPress={() => navigation.navigate("paymentAmountInputScreen")}
+						paymentMethod={"MtnMoney"}
+					/>
+				</PaymentOptionContainer>
+			</Box>
+			<Box flexDirection={"row"} justifyContent={"space-between"} mb={"s"}>
+				<PaymentOptionContainer>
+					<PaymentOption
+						onPress={() => navigation.navigate("paymentAmountInputScreen")}
+						paymentMethod={"MoovMoney"}
+					/>
+				</PaymentOptionContainer>
+				<PaymentOptionContainer>
+					<PaymentOption
+						onPress={() => navigation.navigate("paymentAmountInputScreen")}
+						paymentMethod={"WaveMoney"}
+					/>
+				</PaymentOptionContainer>
+			</Box>
+			<PaymentOptionContainer>
+				<PaymentOption
+					onPress={() => navigation.navigate("paymentAmountInputScreen")}
+					paymentMethod={"VisaCard"}
+				/>
+			</PaymentOptionContainer>
+		</View>
+	);
+};
+
+const screenWidth = Dimensions.get("window").width;
+const paymentOptionCardWidth = screenWidth / 2 - 30;
+const paymentOptionCardHeight = paymentOptionCardWidth * 0.65;
+const PaymentOptionContainer = ({ children }: { children: React.ReactNode }) => {
+	return (
+		<Box width={paymentOptionCardWidth} height={paymentOptionCardHeight}>
+			{children}
+		</Box>
+	);
+};
+
+export default PaymentsOptionsRendererTwoColumn;
--
libgit2 0.27.1