Add payment/notification prefs, assisted pharmacist codes, Rx status journey, and mock payment intents so demo flows match the storefront brief. Co-authored-by: Cursor <cursoragent@cursor.com>
59 lines
1.8 KiB
TypeScript
59 lines
1.8 KiB
TypeScript
import { router } from "expo-router";
|
|
import { ScrollView, View } from "react-native";
|
|
import { Button } from "@/components/ui/Button";
|
|
import { Card } from "@/components/ui/Card";
|
|
import { AppHeader } from "@/components/ui/Header";
|
|
import { Screen } from "@/components/ui/Screen";
|
|
import { Text } from "@/components/ui/Text";
|
|
import { PaymentMethodList } from "@/components/checkout/PaymentMethodList";
|
|
import { routes } from "@/lib/routes";
|
|
import { useLocationStore, type PaymentMethod } from "@/lib/stores/locationStore";
|
|
import { colors, gutter } from "@/lib/theme";
|
|
|
|
const ALL: PaymentMethod[] = [
|
|
"chapa",
|
|
"arifpay",
|
|
"telebirr",
|
|
"mpesa",
|
|
"bank",
|
|
"cod",
|
|
"pay_at_branch",
|
|
];
|
|
|
|
export default function PaymentMethodsScreen() {
|
|
const payment = useLocationStore((s) => s.paymentPreference);
|
|
const setPayment = useLocationStore((s) => s.setPaymentPreference);
|
|
|
|
return (
|
|
<Screen>
|
|
<AppHeader title="Payment methods" subtitle="Preferred checkout channel" />
|
|
<ScrollView
|
|
contentContainerStyle={{
|
|
paddingHorizontal: gutter,
|
|
paddingBottom: 40,
|
|
gap: 14,
|
|
}}
|
|
>
|
|
<Card elevated={false}>
|
|
<Text variant="bodySm" color={colors.muted}>
|
|
Saved preference is pre-selected at checkout. Card/wallet tokens are not
|
|
stored in this demo — gateway handoff happens at pay time.
|
|
</Text>
|
|
</Card>
|
|
<PaymentMethodList
|
|
methods={ALL}
|
|
selected={payment}
|
|
onSelect={setPayment}
|
|
title="Preferred method"
|
|
/>
|
|
<Button title="Done" onPress={() => router.back()} />
|
|
<Button
|
|
title="Go to checkout"
|
|
variant="outline"
|
|
onPress={() => router.push(routes.checkout)}
|
|
/>
|
|
</ScrollView>
|
|
</Screen>
|
|
);
|
|
}
|