chore: add parrainage

mobile/src/screens/client/CheckoutScreen.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useMemo } from "react";
+import React, { useState, useEffect, useMemo } from "react";
 import {
     View,
     Text,
@@ -6,12 +6,14 @@ import {
     StyleSheet,
     KeyboardAvoidingView,
     Platform,
+    Switch,
+    TouchableOpacity,
 } from "react-native";
 import { useNavigation } from "@react-navigation/native";
 import type { NativeStackNavigationProp } from "@react-navigation/native-stack";
 import { Ionicons } from "@expo/vector-icons";
 import { useCart } from "../../context/CartContext";
-import { checkoutCart } from "../../api/api";
+import { checkoutCart, getReferralBalance } from "../../api/api";
 import type { ClientStackParamList } from "../../navigation/types";
 import TextInput from "../../components/ui/TextInput";
 import Button from "../../components/ui/Button";
@@ -36,6 +38,14 @@ export default function CheckoutScreen() {
     const [confirmationData, setConfirmationData] = useState<any>(null);
     const [invalidAddressModal, setInvalidAddressModal] = useState(false);
     const [suggestedAddress, setSuggestedAddress] = useState("");
+    const [referralBalance, setReferralBalance] = useState(0);
+    const [useReferral, setUseReferral] = useState(false);
+
+    useEffect(() => {
+        getReferralBalance().then((res) => {
+            if (res.success && res.balance > 0) setReferralBalance(res.balance);
+        });
+    }, []);
 
     const handleCheckout = async () => {
         if (!nom.trim()) {
@@ -67,6 +77,7 @@ export default function CheckoutScreen() {
                 nom.trim(),
                 prenom.trim(),
                 telephone.trim(),
+                useReferral && referralBalance > 0,
             );
             if (res.success) {
                 setConfirmationData(res);
@@ -158,6 +169,36 @@ export default function CheckoutScreen() {
                     fontSize: fontSize.sm,
                     textAlign: "center",
                 },
+                referralCard: {
+                    backgroundColor: colors.bgCard,
+                    borderRadius: borderRadius.md,
+                    borderWidth: 1,
+                    borderColor: colors.accent + "44",
+                    padding: spacing.l,
+                    marginBottom: spacing.xl,
+                },
+                referralRow: {
+                    flexDirection: "row",
+                    alignItems: "center",
+                    justifyContent: "space-between",
+                },
+                referralLeft: { flexDirection: "row", alignItems: "center", gap: spacing.s, flex: 1 },
+                referralTitle: {
+                    color: colors.textPrimary,
+                    fontSize: fontSize.md,
+                    fontWeight: fontWeight.semibold,
+                },
+                referralAmount: {
+                    color: colors.accent,
+                    fontSize: fontSize.sm,
+                    marginTop: 2,
+                },
+                referralHint: {
+                    color: colors.textMuted,
+                    fontSize: fontSize.xs,
+                    marginTop: spacing.s,
+                    lineHeight: 16,
+                },
                 invalidAddrContent: { gap: spacing.m },
                 invalidAddrIconContainer: { alignItems: "center" },
                 invalidAddrIconCircle: {
@@ -372,6 +413,34 @@ export default function CheckoutScreen() {
                     />
                 </View>
 
+                {/* Section parrainage — visible uniquement si solde > 0 */}
+                {referralBalance > 0 && (
+                    <View style={styles.referralCard}>
+                        <View style={styles.referralRow}>
+                            <View style={styles.referralLeft}>
+                                <Ionicons name="gift-outline" size={22} color={colors.accent} />
+                                <View>
+                                    <Text style={styles.referralTitle}>Credit parrainage</Text>
+                                    <Text style={styles.referralAmount}>
+                                        {referralBalance.toFixed(2)} € disponibles
+                                    </Text>
+                                </View>
+                            </View>
+                            <Switch
+                                value={useReferral}
+                                onValueChange={setUseReferral}
+                                trackColor={{ false: colors.border, true: colors.accent + "66" }}
+                                thumbColor={useReferral ? colors.accent : colors.textMuted}
+                            />
+                        </View>
+                        {useReferral && (
+                            <Text style={styles.referralHint}>
+                                Le credit sera deduit de ta commande. Tu dois quand meme atteindre le minimum de ta zone + le credit utilise.
+                            </Text>
+                        )}
+                    </View>
+                )}
+
                 {error &&
                     nom.trim() &&
                     prenom.trim() &&
@@ -461,6 +530,21 @@ export default function CheckoutScreen() {
                         Votre commande #{confirmationData?.command_id} a ete
                         creee avec succes.
                     </Text>
+                    {confirmationData?.referral_used > 0 && (
+                        <View style={styles.confirmInfo}>
+                            <Ionicons
+                                name="gift-outline"
+                                size={16}
+                                color={colors.accent}
+                            />
+                            <Text style={styles.confirmInfoText}>
+                                {confirmationData.referral_used.toFixed(2)} € de credit parrainage utilises
+                                {confirmationData.referral_balance !== undefined
+                                    ? ` — Solde restant : ${confirmationData.referral_balance.toFixed(2)} €`
+                                    : ""}
+                            </Text>
+                        </View>
+                    )}
                     {confirmationData?.assigned_to && (
                         <View style={styles.confirmInfo}>
                             <Ionicons