You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Mobile/app/(auth)/reset-password.tsx

68 lines
2.3 KiB

import {Text} from "@/components/ui/text";
import {
Button,
ButtonGroup,
ButtonIcon,
ButtonText,
} from "@/components/ui/button";
import {VStack} from "@/components/ui/vstack";
import React from "react";
import {
ArrowRightIcon,
LockIcon,
MailIcon,
MessageCircleIcon,
} from "@/components/ui/icon";
import BackButton from "@/components/BackButton";
import Screen from "@/components/Screen";
import {Heading} from "@/components/ui/heading";
import {Link} from "expo-router";
import {SafeAreaView} from "react-native";
const resetButtons: IResetButton[] = [
{icon: MailIcon, text: "Envoyer par email"},
{icon: LockIcon, text: "Envoyer par 2FA"},
{icon: MessageCircleIcon, text: "Envoyer par SMS"},
];
interface IResetButton {
icon: React.ElementType;
text: string;
}
export default function ResetPasswordPage() {
return (
<SafeAreaView>
<Screen>
<BackButton link={"/login"}/>
<VStack space="2xl">
<VStack space="sm">
<Heading className="text-center" size="3xl">
Réinitialisation de ton mot de passe
</Heading>
<Text size="lg" className="text-center">
Selectionne une méthode pour recevoir ton code temporaire
</Text>
</VStack>
<ButtonGroup space="xl">
{resetButtons.map((resetButton) => (
<Link key={resetButton.text} href={"/sign-in"} asChild>
<Button
className="justify-between"
size="2xl"
action="primary"
variant="outline"
>
<ButtonIcon as={resetButton.icon}/>
<ButtonText>{resetButton.text}</ButtonText>
<ButtonIcon as={ArrowRightIcon}/>
</Button>
</Link>
))}
</ButtonGroup>
</VStack>
</Screen>
</SafeAreaView>
);
}