Commit 1378854e by G

render only payment mode returned from the query which have an active state after filtering.

parent 10011035
...@@ -12,8 +12,6 @@ import { useMemo } from "react"; ...@@ -12,8 +12,6 @@ import { useMemo } from "react";
import { Dimensions } from "react-native"; import { Dimensions } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context"; import { SafeAreaView } from "react-native-safe-area-context";
const PAYMENT_TYPES = new Set(["ORANGE", "FLOOZ", "MTN", "WAVE", "CB"]);
const HomePageWithPaymentOptions: PaymentStackScreenComponentProps<"homePageWithPaymentOptions"> = const HomePageWithPaymentOptions: PaymentStackScreenComponentProps<"homePageWithPaymentOptions"> =
({ navigation }) => { ({ navigation }) => {
const { data, isLoading, error } = useQuery({ const { data, isLoading, error } = useQuery({
...@@ -23,13 +21,13 @@ const HomePageWithPaymentOptions: PaymentStackScreenComponentProps<"homePageWith ...@@ -23,13 +21,13 @@ const HomePageWithPaymentOptions: PaymentStackScreenComponentProps<"homePageWith
}); });
// getting valid payments supported // getting valid payments supported
const paymentTypesToRender = useMemo(() => { const paymentTypesWithActiveStatus = useMemo(() => {
console.log("Filtering payment types"); console.log("Filtering payment types");
const paymentTypes = data?.results || []; const paymentTypes = data?.results || [];
return paymentTypes.filter((paymentType) => PAYMENT_TYPES.has(paymentType.code)); return paymentTypes.filter((paymentType) => paymentType.etat === true);
}, [data]); }, [data]);
console.log("paymentTypesToRender", paymentTypesToRender); console.log("paymentTypesToRender", paymentTypesWithActiveStatus);
return ( return (
<BackgroundGreenWhiteContentArea> <BackgroundGreenWhiteContentArea>
...@@ -61,48 +59,16 @@ const HomePageWithPaymentOptions: PaymentStackScreenComponentProps<"homePageWith ...@@ -61,48 +59,16 @@ const HomePageWithPaymentOptions: PaymentStackScreenComponentProps<"homePageWith
flexWrap={"wrap"} flexWrap={"wrap"}
rowGap={"m"} rowGap={"m"}
> >
<PaymentOptionContainer> {paymentTypesWithActiveStatus.map((paymentType) => (
<PaymentOption <PaymentOptionContainer key={paymentType.id}>
onPress={() => <PaymentOption
navigation.navigate("paymentAmountInputScreen") onPress={() =>
} navigation.navigate("paymentAmountInputScreen")
paymentMethod={"ORANGE"} }
/> paymentMethod={paymentType.code}
</PaymentOptionContainer> />
<PaymentOptionContainer> </PaymentOptionContainer>
<PaymentOption ))}
onPress={() =>
navigation.navigate("paymentAmountInputScreen")
}
paymentMethod={"MTN"}
/>
</PaymentOptionContainer>
<PaymentOptionContainer>
<PaymentOption
onPress={() =>
navigation.navigate("paymentAmountInputScreen")
}
paymentMethod={"FLOOZ"}
/>
</PaymentOptionContainer>
<PaymentOptionContainer>
<PaymentOption
onPress={() =>
navigation.navigate("paymentAmountInputScreen")
}
paymentMethod={"WAVE"}
/>
</PaymentOptionContainer>
<PaymentOptionContainer>
<PaymentOption
onPress={() =>
navigation.navigate("paymentAmountInputScreen")
}
paymentMethod={"CB"}
/>
</PaymentOptionContainer>
</Box> </Box>
</Box> </Box>
</Box> </Box>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment