import React, { useState } from "react";
import { ScrollView, View } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";
import { useNavigation } from "../../context/NavigationContext";
import { StatusBar } from "expo-status-bar";
import { Ionicons } from "@expo/vector-icons";
import { useColorScheme } from "nativewind";
import * as Haptics from "expo-haptics";
import { MutedText, Text } from "../../components/text";
import { Button, IconButton } from "../../components/button";
import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } from "../../components/card";
import { withClickTracking } from "../../services/telemetry";
import { EmailInput } from "../../components/input";
import AuthService from "../../services/auth.service";
import { validateEmail } from "../../utils/validation";
import { useAppConfig } from "../../context/AppConfigContext";
export function ForgotPasswordScreen() {
    const [email, setEmail] = useState("");
    const [error, setError] = useState("");
    const [isLoading, setIsLoading] = useState(false);
    const [sent, setSent] = useState(false);
    const { colorScheme } = useColorScheme();
    const isDark = colorScheme === "dark";
    const router = useNavigation();
    const { routes } = useAppConfig();
    const handleSubmit = async () => {
        // Re-entry guard against double-submit (button + form-submit
        // keypress) firing before React flushes `setIsLoading(true)`
        // and disables the button.
        if (isLoading) {
            return;
        }
        if (!email) {
            setError("Email is required");
            return;
        }
        if (!validateEmail(email)) {
            setError("Please enter a valid email address");
            return;
        }
        setIsLoading(true);
        try {
            await AuthService.forgotPassword(email);
        }
        catch (e) {
            // Deliberately swallow — the server is supposed to respond
            // identically for known and unknown emails, but a 5xx (or a
            // rate-limit, network blip, etc.) would otherwise let the UI
            // branch on "did this email exist or not?". Surface the same
            // confirmation regardless; the server retries on its own
            // schedule and ops can read the failure from the server logs.
            if (__DEV__) {
                console.warn("[forgot-password] request failed; showing generic confirmation:", e);
            }
        }
        await Haptics.notificationAsync(Haptics.NotificationFeedbackType.Success);
        setSent(true);
        setIsLoading(false);
    };
    return (<SafeAreaView className="flex-1 bg-background dark:bg-black">
      <StatusBar style={isDark ? "light" : "dark"}/>
      <ScrollView className="flex-1" contentContainerClassName="flex-1 items-center justify-center p-6" keyboardShouldPersistTaps="handled">
        <View className="mt-4 self-start absolute top-4 left-6">
          <IconButton variant="ghost" telemetryId="auth.forgot_password.back" onPress={() => router.back()} accessibilityLabel="Go back" accessibilityRole="button">
            <Ionicons name="arrow-back" size={24} color={isDark ? "#FFFFFF" : "#000000"}/>
          </IconButton>
        </View>

        <Card className="w-full max-w-[360px]">
          <CardHeader>
            <CardTitle>{sent ? "Check your email" : "Forgot password?"}</CardTitle>
            <CardDescription>
              {sent
            ? `If an account exists for ${email}, you will receive a password reset code.`
            : "Enter your email to reset your password"}
            </CardDescription>
          </CardHeader>

          {!sent ? (<>
              <CardContent className="gap-4">
                <EmailInput label="Email" value={email} onChangeText={(text) => {
                setEmail(text);
                if (error) {
                    setError("");
                }
            }} error={error} autoFocus returnKeyType="done" onSubmitEditing={handleSubmit} accessibilityLabel="Email address"/>
              </CardContent>

              <CardFooter className="flex-col items-stretch gap-3 border-t-0">
                <Button className="w-full" telemetryId="auth.forgot_password.submit" onPress={handleSubmit} isLoading={isLoading} accessibilityLabel="Reset your password" accessibilityRole="button">
                  Reset your password
                </Button>

                <MutedText className="text-center text-sm">
                  Remember your password?{" "}
                  <Text className="text-sm text-foreground underline" onPress={withClickTracking("auth.forgot_password.push", () => router.push(routes.login))} accessibilityRole="link" accessibilityLabel="Sign in">
                    Sign In
                  </Text>
                </MutedText>
              </CardFooter>
            </>) : (<CardFooter className="flex-col items-stretch gap-3 border-t-0">
              <Button className="w-full" telemetryId="auth.forgot_password.push_2" onPress={() => router.push({
                pathname: routes.resetPassword,
                params: { email },
            })} accessibilityLabel="Enter reset code" accessibilityRole="button">
                Enter reset code
              </Button>

              <MutedText className="text-center text-sm">
                Didn't receive the code?{" "}
                <Text className="text-sm text-foreground underline" onPress={withClickTracking("auth.forgot_password.sent", () => {
                setSent(false);
                setError("");
            })} accessibilityRole="button" accessibilityLabel="Resend reset email">
                  Resend
                </Text>
              </MutedText>
            </CardFooter>)}
        </Card>
      </ScrollView>
    </SafeAreaView>);
}
export default ForgotPasswordScreen;
//# sourceMappingURL=ForgotPasswordScreen.jsx.map