chore: fix UI

This commit is contained in:
2026-04-26 19:07:26 +02:00
parent a120ad6391
commit d39c49cce6
10 changed files with 172 additions and 147 deletions
@@ -9,6 +9,7 @@ import {
TouchableOpacity,
TextInput as RNTextInput,
ActivityIndicator,
useWindowDimensions,
} from "react-native";
import { Ionicons } from "@expo/vector-icons";
import { spacing, fontSize, borderRadius } from "../../theme";
@@ -58,6 +59,7 @@ type RoleFilter = "all" | "client" | "livreur" | "cabine" | "admin";
// ==================================================
export default function UsersScreen() {
const { colors } = useTheme();
const { width: screenWidth } = useWindowDimensions();
const ROLE_TABS: {
key: RoleFilter;
@@ -487,6 +489,8 @@ export default function UsersScreen() {
setAmendeReason("");
if (res.compensated) {
showSuccess("Compensation", "Amende annulée — solde parrainage débité en compensation");
} else {
showSuccess("Validé", `Amende de ${pts} € appliquée à "${sanctionModal.client!.username}"`);
}
await loadData();
},
@@ -501,6 +505,7 @@ export default function UsersScreen() {
async () => {
const res = await resetClientPenalties(sanctionModal.client!.username, false);
if (!res.success) { showError("Erreur", res.error || "Echec"); return; }
showSuccess("Validé", `Amende de "${sanctionModal.client!.username}" remise à zéro`);
await loadData();
},
"Remettre à zéro",
@@ -523,6 +528,7 @@ export default function UsersScreen() {
setPointsLoading((prev) => ({ ...prev, [poolKey]: false }));
if (!res.success) { showError("Erreur", res.error || "Echec"); return; }
setPointsInputs((prev) => ({ ...prev, [poolKey]: "" }));
showSuccess("Validé", `${pts} points "${poolName}" ajoutés à "${sanctionModal.client!.username}"`);
await loadData();
},
);
@@ -544,6 +550,7 @@ export default function UsersScreen() {
setSubtractLoading((prev) => ({ ...prev, [poolKey]: false }));
if (!res.success) { showError("Erreur", res.error || "Echec"); return; }
setSubtractInputs((prev) => ({ ...prev, [poolKey]: "" }));
showSuccess("Validé", `${pts} points "${poolName}" retirés à "${sanctionModal.client!.username}"`);
await loadData();
},
);
@@ -557,6 +564,7 @@ export default function UsersScreen() {
async () => {
const res = await resetClientPoints(sanctionModal.client!.username, poolIdx);
if (!res.success) { showError("Erreur", res.error || "Echec"); return; }
showSuccess("Validé", `Points "${poolName}" de "${sanctionModal.client!.username}" remis à zéro`);
await loadData();
},
"Remettre à zéro",
@@ -675,36 +683,38 @@ export default function UsersScreen() {
// Filter grid
filterGrid: {
flexDirection: "row",
paddingHorizontal: spacing.m,
paddingVertical: spacing.m,
gap: spacing.s,
paddingHorizontal: screenWidth < 380 ? spacing.s : spacing.m,
paddingVertical: spacing.s,
gap: screenWidth < 380 ? spacing.xs : spacing.s,
},
filterCard: {
flex: 1,
alignItems: "center",
paddingVertical: spacing.m,
paddingVertical: spacing.s,
paddingHorizontal: 2,
borderRadius: borderRadius.md,
borderWidth: 1,
borderColor: colors.border,
backgroundColor: colors.bgSecondary,
},
filterIconCircle: {
width: 36,
height: 36,
borderRadius: 18,
width: screenWidth < 380 ? 28 : 36,
height: screenWidth < 380 ? 28 : 36,
borderRadius: screenWidth < 380 ? 14 : 18,
justifyContent: "center",
alignItems: "center",
marginBottom: 4,
marginBottom: 2,
},
filterCount: {
color: colors.textWhite,
fontSize: fontSize.lg,
fontSize: screenWidth < 380 ? fontSize.sm : fontSize.md,
fontWeight: "700",
},
filterLabel: {
color: colors.textMuted,
fontSize: fontSize.sm,
fontSize: screenWidth < 380 ? 10 : fontSize.xs,
fontWeight: "600",
textAlign: "center",
},
// Card
@@ -754,17 +764,23 @@ export default function UsersScreen() {
},
statsRow: {
flexDirection: "row",
marginTop: spacing.m,
gap: spacing.l,
flexWrap: "wrap",
marginTop: spacing.s,
gap: spacing.s,
marginLeft: 52,
},
stat: { alignItems: "center" },
stat: {
alignItems: "center",
minWidth: 52,
paddingVertical: spacing.xs,
},
statValue: {
fontSize: fontSize.md,
fontSize: fontSize.sm,
fontWeight: "bold",
color: colors.textWhite,
textAlign: "center",
},
statLabel: { fontSize: fontSize.xs, color: colors.textMuted },
statLabel: { fontSize: fontSize.xs, color: colors.textMuted, textAlign: "center" },
// Non-client
nonClientInfo: {
@@ -846,7 +862,7 @@ export default function UsersScreen() {
fontWeight: "600",
},
}),
[colors],
[colors, screenWidth],
);
// --------------------------------------------------
@@ -991,10 +1007,10 @@ export default function UsersScreen() {
</View>
<View style={styles.statsRow}>
<View style={styles.stat}>
<Text style={styles.statValue}>
<Text style={styles.statValue} numberOfLines={1}>
{item.clientData.command}
</Text>
<Text style={styles.statLabel}>Cmd</Text>
<Text style={styles.statLabel} numberOfLines={1}>Cmd</Text>
</View>
{pointsEnabled && poolNames.map((name, i) => {
const key = poolKeys[i] ?? "";
@@ -1002,46 +1018,40 @@ export default function UsersScreen() {
const color = i === 0 ? colors.success : i === 1 ? colors.info : colors.warning;
return (
<View key={i} style={styles.stat}>
<Text style={[styles.statValue, { color }]}>{value}</Text>
<Text style={styles.statLabel}>{name}</Text>
<Text style={[styles.statValue, { color }]} numberOfLines={1}>{value}</Text>
<Text style={styles.statLabel} numberOfLines={1}>{name}</Text>
</View>
);
})}
{amendeEnabled && (
<View style={styles.stat}>
<Text
style={[
styles.statValue,
{ color: colors.warning },
]}
style={[styles.statValue, { color: colors.warning }]}
numberOfLines={1}
>
{item.clientData.amende}
{item.clientData.amende}
</Text>
<Text style={styles.statLabel}>Amende</Text>
<Text style={styles.statLabel} numberOfLines={1}>Amende</Text>
</View>
)}
<View style={styles.stat}>
<Text
style={[
styles.statValue,
{ color: colors.danger },
]}
style={[styles.statValue, { color: colors.danger }]}
numberOfLines={1}
>
{item.clientData.cancellations_count}
</Text>
<Text style={styles.statLabel}>Annul.</Text>
<Text style={styles.statLabel} numberOfLines={1}>Annul.</Text>
</View>
{referralEnabled && (item.clientData.referral_balance ?? 0) > 0 && (
<View style={styles.stat}>
<Text
style={[
styles.statValue,
{ color: colors.success },
]}
style={[styles.statValue, { color: colors.success }]}
numberOfLines={1}
>
{(item.clientData.referral_balance ?? 0).toFixed(0)}
</Text>
<Text style={styles.statLabel}>Parrain</Text>
<Text style={styles.statLabel} numberOfLines={1}>Parrain</Text>
</View>
)}
</View>