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>
67 lines
2.1 KiB
TypeScript
67 lines
2.1 KiB
TypeScript
import type { Ionicons } from "@expo/vector-icons";
|
|
import { Card } from "@/components/ui/Card";
|
|
import { OptionRow } from "@/components/ui/Field";
|
|
import { Text } from "@/components/ui/Text";
|
|
import type { PaymentMethod } from "@/lib/stores/locationStore";
|
|
import { colors } from "@/lib/theme";
|
|
import { View } from "react-native";
|
|
|
|
const META: Record<
|
|
PaymentMethod,
|
|
{ title: string; hint: string; icon: keyof typeof Ionicons.glyphMap }
|
|
> = {
|
|
chapa: { title: "Chapa", hint: "Card / mobile money via Chapa", icon: "card-outline" },
|
|
arifpay: { title: "ArifPay", hint: "Local digital checkout", icon: "wallet-outline" },
|
|
telebirr: { title: "Telebirr", hint: "Ethio telecom Telebirr", icon: "phone-portrait-outline" },
|
|
mpesa: { title: "M-Pesa", hint: "Safaricom M-Pesa", icon: "cash-outline" },
|
|
bank: { title: "Bank transfer", hint: "Transfer + upload receipt later", icon: "business-outline" },
|
|
pay_at_branch: {
|
|
title: "Pay at branch",
|
|
hint: "Cash or POS when you collect",
|
|
icon: "storefront-outline",
|
|
},
|
|
cod: { title: "Cash on delivery", hint: "Pay the rider on arrival", icon: "bicycle-outline" },
|
|
};
|
|
|
|
export function PaymentMethodList({
|
|
methods,
|
|
selected,
|
|
onSelect,
|
|
title = "Payment",
|
|
footnote,
|
|
}: {
|
|
methods: PaymentMethod[];
|
|
selected: PaymentMethod;
|
|
onSelect: (m: PaymentMethod) => void;
|
|
title?: string;
|
|
footnote?: string;
|
|
}) {
|
|
return (
|
|
<Card elevated={false} padded={false}>
|
|
<View style={{ padding: 16, paddingBottom: 8 }}>
|
|
<Text variant="h3">{title}</Text>
|
|
{footnote ? (
|
|
<Text variant="caption" color={colors.subtle} style={{ marginTop: 4 }}>
|
|
{footnote}
|
|
</Text>
|
|
) : null}
|
|
</View>
|
|
{methods.map((m, i) => (
|
|
<OptionRow
|
|
key={m}
|
|
title={META[m].title}
|
|
subtitle={META[m].hint}
|
|
selected={selected === m}
|
|
onPress={() => onSelect(m)}
|
|
icon={META[m].icon}
|
|
last={i === methods.length - 1}
|
|
/>
|
|
))}
|
|
</Card>
|
|
);
|
|
}
|
|
|
|
export function paymentLabel(m: PaymentMethod) {
|
|
return META[m]?.title ?? m;
|
|
}
|