<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Reset Password</title>
    <script>
        async function resetPassword(event) {
            event.preventDefault(); // Prevent form submission reload

            // Get the token and new password
            const params = new URLSearchParams(window.location.search);
            const token = params.get('token'); // Extract token from URL
            const newPassword = document.getElementById('new-password').value;

            // if (token && newPassword) {
            if(true){
                // Send password reset request to the backend
                const response = await fetch('http://localhost:5000/reset-password', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                    },
                    body: JSON.stringify({ token, newPassword }),
                });

                // Handle the response from the server
                const result = await response.json();
                if (response.ok) {
                    alert('Your password has been reset successfully!');
                    window.location.href = '/login'; // Redirect to login page
                } else {
                    alert(result.message || 'Failed to reset password.');
                }
            } else {
                alert('Please provide a valid token and new password.');
            }
        }
    </script>
</head>
<body>
    <h1>Reset Your Password</h1>
    <form onsubmit="resetPassword(event)">
        <label for="new-password">New Password:</label>
        <input type="password" id="new-password" name="new-password" required />
        <button type="submit">Submit</button>
    </form>
</body>
</html>
