import { Box, Typography } from '@mui/material';
import useAuth from '../hooks/useAuth';
import AuthForm from '../components/Login/AuthForm';
import MemorySlider from '../components/Login/MemorySlider';
import { useNavigate } from 'react-router-dom';
import PopaPopa from '../components/popa-popa';
import useConfig from '../hooks/useConfig';
import { useState } from 'react';
import { FullScreenLoader } from '../components/FullScreenLoader';

interface LoginProps {
  onLoginSuccess?: (username: string) => void;
}

const Login = ({ onLoginSuccess }: LoginProps) => {
  const navigate = useNavigate();
  const { config, setConfig, saveConfig, handleInputChange } = useConfig();
  const { status, validateSession, refreshSession, authenticateWithElyBy } =
    useAuth();
  const [loading, setLoading] = useState(false);

  const authorization = async () => {
    console.log('Начинаем процесс авторизации...');

    if (!config.username.trim()) {
      console.log('Ошибка: не указан никнейм');
      alert('Введите никнейм!');
      return;
    }

    setLoading(true);
    try {
      // Проверяем, есть ли сохранённый токен
      if (config.accessToken && config.clientToken) {
        console.log('Проверка валидности существующего токена...');
        const isValid = await validateSession(config.accessToken);

        if (!isValid) {
          console.log('Токен недействителен, пытаемся обновить...');
          const refreshedSession = await refreshSession(
            config.accessToken,
            config.clientToken,
          );

          if (!refreshedSession) {
            console.log(
              'Не удалось обновить токен, требуется новая авторизация',
            );
            // Очищаем недействительные токены
            saveConfig({
              accessToken: '',
              clientToken: '',
            });

            // Пытаемся выполнить новую авторизацию
            if (config.password) {
              const newSession = await authenticateWithElyBy(
                config.username,
                config.password,
                saveConfig,
              );
              if (!newSession) {
                console.log('Авторизация не удалась');
                return;
              }
            } else {
              console.log('Требуется ввод пароля для новой авторизации');
              return;
            }
          }
        } else {
          console.log('Токен действителен');
        }
      } else {
        console.log('Токен отсутствует, выполняем авторизацию...');
        // Проверяем наличие пароля
        if (!config.password) {
          console.log('Ошибка: не указан пароль');
          alert('Введите пароль!');
          return;
        }

        const session = await authenticateWithElyBy(
          config.username,
          config.password,
          saveConfig,
        );
        if (!session) {
          console.log('Авторизация не удалась');
          return;
        }
      }

      console.log('Авторизация успешно завершена');

      if (onLoginSuccess) {
        onLoginSuccess(config.username);
      }

      navigate('/');
    } catch (error: any) {
      console.log(`ОШИБКА при авторизации: ${error.message}`);
      saveConfig({
        accessToken: '',
        clientToken: '',
      });
    } finally {
      setLoading(false);
    }
  };

  return (
    <Box>
      {loading ? (
        <FullScreenLoader message="Входим..." />
      ) : (
        <>
          <PopaPopa />
          <AuthForm
            config={config}
            handleInputChange={handleInputChange}
            onLogin={authorization}
          />
        </>
      )}
    </Box>
  );
};

export default Login;
