add yandex button

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "no-copy-frontend",
-	"version": "0.14.0",
+	"version": "0.15.0",
 	"private": true,
 	"scripts": {
 		"dev": "next dev -p 2999",

src/app/[locale]/login/page.tsx

@@ -6,6 +6,7 @@ import LoginForm from '@/app/ui/forms/login-form';
 import LanguageSwitcher from '@/app/components/LanguageSwitcher';
 import { useTranslations } from 'next-intl';
 import VKLogin from '@/app/components/VKLogin';
+import YandexAuthWithScript from '@/app/components/YandexLogin';
 
 export const metadata: Metadata = {
 	title: 'Login',
@@ -33,9 +34,12 @@ export default function Page() {
 						{t('or-log-in-via')}
 					</span>
 				</div>
-				<div>
+				<div className="mb-4">
 					<VKLogin />
 				</div>
+				<div>
+					<YandexAuthWithScript />
+				</div>
 				<div className={`${styles['register-link']}`}>
 					<p>{t('no-account')}?
 						<Link href="register"> {t('register')}</Link>

src/app/actions/yandexAuth.ts

@@ -0,0 +1,58 @@
+'use server'
+
+import { API_BASE_URL } from '@/app/actions/definitions';
+import { createSession } from '@/app/actions/session';
+import { redirect } from 'next/navigation';
+
+
+export async function YandexAuthorization(data: any, codeVerifier: string) {
+
+	console.log(data);
+	console.log(codeVerifier);
+	const { code, state, device_id } = data
+
+	try {
+		const response = await fetch(`${API_BASE_URL}/api/v1/yandex/authorization/${code}/${state}/${codeVerifier}/${device_id}`, {
+			method: 'GET',
+			headers: {
+				"Content-Type": "application/json",
+				"Accept": "application/json"
+			}
+		});
+		if (response.ok) {
+			let parsed = await response.json();
+			console.log(parsed);
+			if (parsed.message_desc === 'Operation successful') {
+				/* await createSession(parsed.message_body.token, email); */
+			} else {
+				throw (`${parsed.message_code}`);
+			}
+		} else {
+			throw ('request-ended-with-an-error');
+		}
+
+	} catch (error) {
+		const errors: Record<string, string> = {}
+
+		switch (error) {
+			case '2':
+				errors['server'] = 'password-does-not-match'
+				break;
+
+			case '4':
+				errors['server'] = 'email-not-found'
+				break;
+
+			default:
+				errors['server'] = 'request-ended-with-an-error'
+				break;
+		}
+
+		if (error) {
+			return error;
+		}
+		throw error;
+	}
+
+	redirect('/pages/dashboard');
+}

src/app/components/YandexLogin.tsx

@@ -0,0 +1,69 @@
+"use client";
+
+import Script from 'next/script';
+import { useEffect, useRef, useState } from 'react';
+
+declare global {
+	interface Window {
+		YaAuthSuggest: any;
+	}
+}
+
+export default function YandexAuthWithScript() {
+	const buttonRef = useRef<HTMLDivElement>(null);
+	const [isReady, setIsReady] = useState(false);
+
+	const handleLogin = (token: string) => {
+		console.log('handleLogin');
+	};
+
+	useEffect(() => {
+		if (!isReady || !buttonRef.current || !window.YaAuthSuggest) return;
+
+		window.YaAuthSuggest.init(
+			{
+				client_id: 'b356a7ceac0f4c50a3b434220f86bce0',
+				response_type: 'token',
+				redirect_uri: `http://localhost:2999/ru/login`,
+			},
+			'http://localhost:2999',
+			{
+				parentId: buttonRef.current.id,
+				view: 'button',
+				buttonView: 'main',
+				buttonTheme: 'light',
+				buttonSize: 'm',
+				buttonBorderRadius: 10
+			}
+		)
+			.then((result: any) => {
+				console.log('then');
+				console.log(result);
+				if (result?.access_token) {
+					handleLogin(result.access_token);
+				}
+			})
+			.catch((error: any) => {
+				console.error('Yandex auth error:', error);
+			});
+	}, [isReady]);
+
+	return (
+		<>
+			<Script
+				src="https://yastatic.net/s3/passport-sdk/autofill/v1/sdk-suggest-with-polyfills-latest.js"
+				strategy="lazyOnload"
+				onLoad={() => setIsReady(true)}
+				onError={() => console.error('Failed to load Yandex script')}
+			/>
+
+			<div
+				ref={buttonRef}
+				id="yandex-auth-container"
+				className="flex justify-center"
+			>
+				{!isReady && <div>Загрузка Яндекс авторизации...</div>}
+			</div>
+		</>
+	);
+}