'use client'

import { Config, OneTap } from '@vkid/sdk';

import { useEffect, useRef } from 'react';

const VKAuthDynamic = () => {
	const containerRef = useRef(null);
	const isInitialized = useRef(false);

	useEffect(() => {
		// Динамическая загрузка SDK
		const loadVKIDSDK = async () => {
			try {
				// Проверяем, не загружен ли уже SDK
				if (window.VKIDSDK) return window.VKIDSDK;

				const { default: VKID } = await import('@vkid/sdk');
				window.VKIDSDK = VKID;
				return VKID;
			} catch (error) {
				console.error('Failed to load VKID SDK:', error);
				return null;
			}
		};

		const initialize = async () => {
			if (isInitialized.current) return;

			const VKID = await loadVKIDSDK();
			if (!VKID || !containerRef.current) return;

			isInitialized.current = true;

			try {
				// Конфигурация
				VKID.Config.init({
					app: Number(process.env.NEXT_PUBLIC_VK_APP_ID) || 1111111,
					redirectUrl: process.env.NEXT_PUBLIC_REDIRECT_URL || window.location.origin,
					responseMode: VKID.ConfigResponseMode.Callback,
					source: VKID.ConfigSource.LOWCODE,
					scope: '',
				});

				// Создание и рендеринг виджета
				const oneTap = new VKID.OneTap();

				oneTap
					.render({
						container: containerRef.current,
						showAlternativeLogin: true,
					})
					.on(VKID.WidgetEvents.ERROR, handleError)
					.on(VKID.OneTapInternalEvents.LOGIN_SUCCESS, async (payload) => {
						const { code, device_id } = payload;

						try {
							const authData = await VKID.Auth.exchangeCode(code, device_id);
							handleSuccess(authData);
						} catch (error) {
							handleError(error);
						}
					});
			} catch (error) {
				console.error('VKID initialization error:', error);
			}
		};

		initialize();

		return () => {
			// Очистка
			isInitialized.current = false;
		};
	}, []);

	const handleSuccess = async (data) => {
		try {
			// Отправка данных на ваш API endpoint
			const response = await fetch('/api/auth/vk-callback', {
				method: 'POST',
				headers: { 'Content-Type': 'application/json' },
				body: JSON.stringify(data),
			});

			const result = await response.json();

			if (response.ok) {
				// Успешная авторизация
				console.log('Authentication successful:', result);
				// Перенаправление или обновление состояния
				window.location.href = '/dashboard'; // Пример редиректа
			} else {
				handleError(result);
			}
		} catch (error) {
			console.error('Server request failed:', error);
		}
	};

	const handleError = (error) => {
		console.error('Authentication error:', error);
		// Можно показать уведомление пользователю
	};

	return (
		<div>
			<div ref={containerRef} />
			vk
		</div>
	);
};

export default VKAuthDynamic;