@@ -0,0 +1,15 @@
+const Sentry = {
+  init: jest.fn(),
+  captureException: jest.fn(),
+  captureMessage: jest.fn(),
+  withScope: jest.fn((callback) => {
+    callback({
+      setExtra: jest.fn(),
+      setTag: jest.fn(),
+      setUser: jest.fn(),
+    });
+  }),
+};
+
+
+export default Sentry;
@@ -0,0 +1,25 @@
+const mockRouter = {
+	push: jest.fn(() => Promise.resolve()),
+	replace: jest.fn(() => Promise.resolve()),
+	reload: jest.fn(),
+	back: jest.fn(),
+	prefetch: jest.fn(() => Promise.resolve()),
+	beforePopState: jest.fn(),
+	events: {
+		on: jest.fn(),
+		off: jest.fn(),
+		emit: jest.fn(),
+	},
+	query: {},
+	asPath: '',
+	pathname: '',
+	route: '',
+}
+
+const useRouter = jest.fn(() => mockRouter)
+
+export { useRouter }
+
+export const setRouter = (overrides: Partial<typeof mockRouter>) => {
+	Object.assign(mockRouter, overrides)
+}
@@ -0,0 +1,30 @@
+import { jest } from '@jest/globals'
+
+const mockUseSession = jest.fn()
+const mockSignIn = jest.fn()
+const mockSignOut = jest.fn()
+const mockGetSession = jest.fn()
+
+const mockSession = {
+	user: {
+		name: 'Test User',
+		email: 'test@example.com',
+		image: 'https://example.com/test.jpg',
+	},
+	expires: '1',
+}
+
+export const useSession = () => {
+	return { data: mockSession, status: 'authenticated' }
+}
+
+export const signIn = mockSignIn
+export const signOut = mockSignOut
+export const getSession = mockGetSession
+
+export default {
+	useSession,
+	signIn,
+	signOut,
+	getSession,
+}
@@ -0,0 +1,3 @@
+const ReactComponent = 'div'
+
+export default ReactComponent
\ No newline at end of file
@@ -0,0 +1,27 @@
+import { Modal, usePlatesStore } from '#/features/modals/model'
+import { useEffect } from 'react'
+import { jestRender } from './render'
+
+const ModalTester = ({ id, onModal }: { id: string; onModal: (modal: Modal) => void }) => {
+	const { getModal } = usePlatesStore()
+
+	useEffect(() => {
+		const modal = getModal(id)
+		onModal(modal)
+	}, [id, onModal])
+
+	return null
+}
+
+export async function getModalTest(id: string): Promise<Modal> {
+	return await new Promise((resolve) => {
+		jestRender(
+			<ModalTester
+				id={id}
+				onModal={(m) => {
+					resolve(m)
+				}}
+			/>
+		)
+	})
+}
@@ -0,0 +1,9 @@
+import { store } from '#/app/store/store'
+import { render } from '@testing-library/react'
+import { Provider } from 'react-redux'
+
+export function jestRender(component: React.ReactElement) {
+	return render(<Provider store={store}>{component}</Provider>)
+}
+
+
@@ -0,0 +1,28 @@
+//@ts-nocheck
+export function windowMock() {
+	let originalLocation = window.location // Сохраняем оригинальный window.location
+
+	beforeEach(() => {
+		// Удаляем оригинальный window.location
+		delete window.location
+
+		// Мокируем window.location
+		window.location = {
+			href: '',
+			assign: jest.fn(),
+			replace: jest.fn(),
+			reload: jest.fn(),
+			protocol: 'http:',
+			host: 'localhost',
+			pathname: '/',
+			search: '',
+			hash: '',
+			...originalLocation, // Сохраняем оригинальные методы
+		}
+	})
+	afterEach(() => {
+		// Возвращаем оригинальный window.location
+		// @ts-ignore
+		window.location = originalLocation
+	})
+}
@@ -1,19 +1,8 @@
-import axios from 'axios'
+import { api } from '#/shared/api'
 
-import { API_URL } from '#/shared/lib/constants'
-
-export const changePassword = async (email: string, password: string, newPassword: string, token?: string) => {
-	return await axios.patch<string | {detail: string}>(
-		API_URL + `/auth/business-host/account/change-pass/${email}`,
-		{
-			password_1: password,
-			password_2: newPassword,
-		},
-		{
-			headers: {
-				Authorization: `Bearer ${token}`,
-			},
-			validateStatus: (status) => status < 500
-		}
-	)
+export const changePassword = async (email: string, password_1: string, password_2: string) => {
+	return await api.patch<{ detail: string }>(`/auth/business-host/account/change-pass/${email}`, {
+		password_1,
+		password_2,
+	})
 }
@@ -4,6 +4,7 @@ import { useState } from 'react'
 import { getModalById, PLATE_CHANGE_PASSWORD } from '#/features/modals'
 import { useShowDataStore } from '#/shared/lib/hooks/use-show-data'
 import { useForm } from 'react-hook-form'
+import { makePrivateRequest } from '#/shared/api'
 
 interface ChangePasswordForm {
 	password: string
@@ -23,34 +24,27 @@ export const useChangePassword = () => {
 		setValue,
 	} = useForm<ChangePasswordForm>()
 	const { showMessage } = useShowDataStore()
-	const { data: session } = useSession()
 	const [passwordShowed, setPasswordShowed] = useState(false)
 
-	const onSubmit = handleSubmit(async (data, event) => {
-		if (!session) return
+	const onSubmit = handleSubmit(
+		makePrivateRequest(async ({ password, newPassword }) => {
+			if (password !== newPassword) {
+				showMessage('Пароли не совпадают')
+				setError('password', { message: 'Пароли не совпадают' })
+				return setError('newPassword', { message: 'Пароли не совпадают' })
+			}
 
-		if (data.password !== data.newPassword) {
-			showMessage('Пароли не совпадают!', 'error')
-			setError('password', { message: 'Пароли не совпадают' })
-			return setError('newPassword', { message: 'Пароли не совпадают' })
-		}
+			const { data, status } = await changePassword(modal.getStoreProperty<string>('email')!, password, newPassword)
 
-		const { data: res, status } = await changePassword(
-			modal.getStoreProperty<string>('email')!,
-			data.password,
-			data.newPassword,
-			session.access
-		)
+			if (status !== 200) return showMessage(data.detail)
 
-		if (status == 200) {
 			showMessage('Пароль изменен успешно!', 'success')
+
 			modal.setState(false)
-			return
-		}
 
-		showMessage((res as { detail: string }).detail)
-		reset()
-	})
+			reset()
+		})
+	)
 
 	return { onSubmit, register, watch, reset, errors, trigger, setValue, passwordShowed, setPasswordShowed }
 }
@@ -0,0 +1,100 @@
+import '@testing-library/jest-dom'
+import { act, fireEvent, screen, waitFor } from '@testing-library/react'
+import { jestRender } from '#/../jest/utils/render'
+import { windowMock } from '#/../jest/utils/window-mock'
+import { ChangePasswordPlate } from './change-password'
+import { PLATE_CHANGE_PASSWORD } from '#/features/modals'
+import { getModalTest } from '#/../jest/utils/modal-tester'
+import { api } from '#/shared/api/instance'
+
+jest.mock('next/router')
+jest.mock('@sentry/nextjs')
+
+jest.mock('#/shared/api/instance')
+
+const showMessageMock = jest.fn()
+const useSessionMock = jest.fn()
+
+jest.mock('next-auth/react', () => {
+	return {
+		useSession: () => useSessionMock(),
+	}
+})
+
+jest.mock('#/shared/lib/hooks/use-show-data', () => {
+	return {
+		useShowDataStore: jest.fn(() => {
+			return {
+				showMessage: showMessageMock,
+			}
+		}),
+	}
+})
+
+useSessionMock.mockReturnValue({
+	data: {
+		access: 'something access',
+	},
+})
+
+windowMock()
+
+describe('chage-password', () => {
+	it('successfully change password', async () => {
+		jestRender(<ChangePasswordPlate />)
+
+		const modal = await getModalTest(PLATE_CHANGE_PASSWORD)
+
+		act(() => {
+			modal.setState(true, {
+				email: 'aleksander.freelancer@gmail.com',
+			})
+		})
+		;(api.patch as jest.Mock).mockResolvedValue({
+			status: 200,
+			data: { detail: 'Host password has been updated' },
+		})
+
+		const password = screen.getByPlaceholderText('Пароль')
+		const newPassword = screen.getByPlaceholderText('Повторить пароль')
+		const button = screen.getByText('Сменить пароль')
+
+		fireEvent.change(password, { target: { value: 'h7O5vF$M' } })
+		fireEvent.change(newPassword, { target: { value: 'h7O5vF$M' } })
+
+		act(() => {
+			fireEvent.click(button)
+		})
+
+		await waitFor(() => {
+			expect(showMessageMock).toHaveBeenCalledWith('Пароль изменен успешно!', 'success')
+		})
+	})
+
+	it('not equal passwords', async () => {
+		jestRender(<ChangePasswordPlate />)
+
+		const modal = await getModalTest(PLATE_CHANGE_PASSWORD)
+
+		act(() => {
+			modal.setState(true, {
+				email: 'aleksander.freelancer@gmail.com',
+			})
+		})
+
+		const password = screen.getByPlaceholderText('Пароль')
+		const newPassword = screen.getByPlaceholderText('Повторить пароль')
+		const button = screen.getByText('Сменить пароль')
+
+		fireEvent.change(password, { target: { value: 'h7O5vF$M' } })
+		fireEvent.change(newPassword, { target: { value: 'h7O5vF$Md' } })
+
+		act(() => {
+			fireEvent.click(button)
+		})
+
+		await waitFor(() => {
+			expect(showMessageMock).toHaveBeenCalledWith('Пароли не совпадают')
+		})
+	})
+})
@@ -1,6 +1,5 @@
 import { getModalById, PLATE_CHANGE_PASSWORD, PlateTemplate } from '#/features/modals'
 import styles from './change-password.module.scss'
-import React, { useEffect } from 'react'
 import { CommonButton } from '#/shared/ui/button'
 import { CommonInput } from '#/shared/ui/common-input'
 import { useChangePassword } from '../lib/use-change-password'
@@ -9,30 +8,19 @@ import ClosedEyeSvg from '#/assets/svg/closed-eye.svg?react'
 
 export const ChangePasswordPlate = () => {
 	const modal = getModalById(PLATE_CHANGE_PASSWORD)
-	const { onSubmit, register, errors, reset, trigger, watch, setValue, passwordShowed, setPasswordShowed } = useChangePassword()
+
+	const { onSubmit, register, errors, reset, trigger, passwordShowed, setPasswordShowed } = useChangePassword()
 
 	return (
-		<PlateTemplate
-			id={PLATE_CHANGE_PASSWORD}
-			headerClassName={styles.container}
-			variant='secondary'
-			closeModal={() => {
-				reset()
-			}}
-		>
-			<form className={styles.modal} onSubmit={onSubmit}>
+		<PlateTemplate id={PLATE_CHANGE_PASSWORD} headerClassName={styles.container} variant='secondary' closeModal={() => reset()}>
+			<form className={styles.modal} onChange={() => trigger()} onSubmit={onSubmit}>
 				<p className={styles.modal__header}>Смена пароля</p>
 				<div className={styles.box}>
 					<CommonInput
 						{...register('password', {
 							required: 'Обязательное поле',
-							pattern: { value: /^[\w\d\._-]+$/i, message: 'Неверный формат' },
+							minLength: { value: 6, message: 'Укажите пароль не меньше 6 символов' },
 						})}
-						value={watch('password', '')}
-						onChange={(e) => {
-							setValue('password', e.target.value)
-							trigger('password')
-						}}
 						label='Новый пароль'
 						variant='outline'
 						placeholder='Пароль'
@@ -48,18 +36,12 @@ export const ChangePasswordPlate = () => {
 								)}
 							</button>
 						}
-						// onInput={() => trigger('password')}
 					/>
 					<CommonInput
 						{...register('newPassword', {
 							required: 'Обязательное поле',
-							pattern: { value: /^[\w\d\._-]+$/i, message: 'Неверный формат' },
+							pattern: { value: /^.{6,}$/, message: 'Неверный формат' },
 						})}
-						value={watch('newPassword', '')}
-						onChange={(e) => {
-							setValue('newPassword', e.target.value)
-							trigger('newPassword')
-						}}
 						label='Повторить пароль'
 						variant='outline'
 						placeholder='Повторить пароль'
@@ -74,21 +56,13 @@ export const ChangePasswordPlate = () => {
 							</button>
 						}
 						error={errors.newPassword}
-						// onInput={() => trigger('password')}
 					/>
 				</div>
 				<div className={styles.modal__buttons}>
 					<CommonButton variant='primary' type='submit'>
 						Сменить пароль
 					</CommonButton>
-					<CommonButton
-						variant='gray'
-						onClick={() => {
-							modal.setState(false)
-							reset()
-						}}
-						type='button'
-					>
+					<CommonButton variant='gray' onClick={() => modal.setState(false)} type='button'>
 						Отмена
 					</CommonButton>
 				</div>
@@ -1,4 +1,3 @@
-'use client'
 import { useEffect } from 'react'
 import { c } from '#/shared'
 import { usePlatesStore } from '../model'
@@ -44,8 +43,6 @@ export default function PlatesTemplate({
 
 	const modal = getModal(id)
 
-	const { theme } = useThemeAndDevice()
-
 	useEffect(() => setModal(id), [])
 
 	return (
@@ -1,4 +1,3 @@
-// @ts-nocheck
 import React, { useState } from 'react'
 import { useForm } from 'react-hook-form'
 import { SubmitErrorHandler } from 'react-hook-form/dist/types/form'
@@ -1,11 +1,12 @@
 .container {
 	padding-bottom: 0;
+	background-color: #373737;
 }
 
 .modal {
 	min-width: 450px;
 	width: 100%;
-  padding-top: 35px;
+	padding-top: 35px;
 
 	&__buttons {
 		display: flex;
@@ -3,15 +3,20 @@ import { useThemeAndDevice } from '#/shared/lib/hooks'
 import { Button } from '@mui/material'
 import { signIn } from 'next-auth/react'
 import Image from 'next/image'
-import React from 'react'
+import React, { useState } from 'react'
 
 interface YandexAuthButtonProps {}
 
 export const YandexAuthButton = ({}: YandexAuthButtonProps) => {
 	const { theme } = useThemeAndDevice()
 
+	const [hovered, setHovered] = useState(false)
+
 	return (
 		<Button
+			onMouseEnter={() => setHovered(true)}
+			onMouseLeave={() => setHovered(false)}
+			data-testid='yandex-auth-button'
 			variant='contained'
 			onClick={async () => {
 				await signIn('yandex', {
@@ -19,6 +24,7 @@ export const YandexAuthButton = ({}: YandexAuthButtonProps) => {
 					redirect: false,
 				})
 			}}
+			style={{ opacity: hovered ? 0.7 : 1 }}
 			sx={{
 				backgroundColor: theme === 'dark' ? '#1C1C1E' : '#F1FAFF',
 				color: theme === 'dark' ? 'white' : '#2B2B42',
@@ -33,7 +39,7 @@ export const YandexAuthButton = ({}: YandexAuthButtonProps) => {
 				height: 50,
 				'&:hover': {
 					backgroundColor: theme === 'dark' ? '#1C1C1E' : '#F1FAFF',
-					opacity: 0.7,
+					// opacity: 0.7,
 					boxShadow: 'none',
 				},
 			}}
@@ -20,6 +20,21 @@ import { pingFangFont } from '#/shared/lib/constants/font/font'
 import { useBlockTelegram } from '#/shared/lib/hooks/use-block-telegram'
 import { Error } from '#/shared'
 
+// import fetch from 'cross-fetch'
+
+// global.fetch = (...params: Parameters<typeof fetch>) => {
+// 	let url = params[0]
+
+// 	const baseUrl = process.env.NEXT_PUBLIC_NEXTAUTH_URL!
+
+// 	if (typeof url === 'string' && !(url as string).startsWith(baseUrl) && !(url as string).includes('http')) {
+// 		url = baseUrl.endsWith('/') ? baseUrl.slice(0, -1) + params[0] : baseUrl + params[0]
+// 		console.log(url)
+// 	}
+
+// 	return fetch(url, params[1])
+// }
+
 axios.defaults.httpsAgent = new https.Agent({
 	rejectUnauthorized: false,
 })
@@ -0,0 +1,2 @@
+export * from './instance'
+export * from './private-request'
\ No newline at end of file
@@ -0,0 +1,6 @@
+import axios from 'axios'
+
+export const api = axios.create({
+	validateStatus: () => true,
+	baseURL: process.env.NEXT_PUBLIC_API_HOST,
+})
@@ -0,0 +1,21 @@
+import { useSession } from 'next-auth/react'
+import { api } from './instance'
+
+export function makePrivateRequest(callback: (...params: any) => Promise<any>) {
+	const { data } = useSession()
+
+	return async (...params: any) => {
+		if (!data) return
+
+		api.interceptors.request.use((config) => {
+			config.headers.Authorization = `Bearer ${data.access}`
+			return config
+		})
+
+		const result = await callback(...params)
+
+		api.interceptors.request.clear()
+
+		return result
+	}
+}
@@ -24,9 +24,15 @@
 }
 
 .label {
-	color: #97989f;
+	color: #a6a5a5;
 	font-size: 14px;
 	margin-bottom: 8px;
+  width: 100%;
+
+	&_primary {
+		font-weight: 500;
+    margin-bottom: 10px;
+	}
 
 	&_error {
 		color: #97989f;
@@ -41,12 +47,24 @@
 	outline: none;
 	font-size: 16px;
 	width: 100%;
+	font-family: '__Raleway_9d395e' !important;
 
 	&:focus {
 		border: none;
 		outline: none;
 	}
 
+	&_primary {
+		padding: 16px 0;
+		color: var(--text-color-main) !important;
+		font-size: 19px;
+		font-weight: 400;
+
+		&::placeholder {
+			color: #97989f !important;
+		}
+	}
+
 	&_outline {
 		padding: 20px 0;
 		color: var(--text-color-main) !important;
@@ -64,11 +82,31 @@
 	}
 }
 
-
 .wrapper {
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
+	transition: all 0.3 ease-in;
+
+	&_primary {
+		color: var(--text-color-main) !important;
+		padding: 0 14px;
+		background-color: var(--new-ui-main-color);
+		border: 2px solid #40404e;
+		border-radius: 13px;
+
+		&:hover {
+			border: 2px solid var(--air-color);
+		}
+
+		&::placeholder {
+			color: #a6a5a5 !important;
+		}
+
+		&:focus {
+			border: 2px solid var(--background-color-table);
+		}
+	}
 
 	&_outline {
 		color: var(--text-color-main) !important;
@@ -99,7 +137,6 @@
 }
 
 html[data-theme='light'] {
-	// Переопределяем стили для светлой темы
 	.wrapper_outline {
 		border: 2px solid #f2f2f8 !important;
 		&:focus {
@@ -107,6 +144,18 @@ html[data-theme='light'] {
 		}
 	}
 
+  .wrapper_primary{
+    border-color: #D4D7DB;
+
+    &:hover{
+      border-color: var(--air-color);
+    }
+  }
+
+  .label_primary{
+    color: #181C32;
+  }
+
 	.wrapper_error {
 		border-color: #ff76a7 !important;
 		&::placeholder {
@@ -1,59 +1,80 @@
 import { c } from '#/shared/lib/helpers'
 import { FieldError } from 'react-hook-form'
 import styles from './common-input.module.scss'
-import { useEffect } from 'react'
+import React, { ForwardedRef, forwardRef, useEffect } from 'react'
 
-export type InputVariant = 'outline'
+export type InputVariant = 'outline' | 'primary'
 
 export interface CommonInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
 	children?: React.ReactNode
 	variant?: InputVariant
-	label?: string
+	label?: string | React.ReactNode
 	error?: FieldError
 	rightSlot?: React.ReactNode
+	trim?: boolean
+	ref?: ForwardedRef<HTMLInputElement>
 }
 
-export const CommonInput = ({ children, rightSlot, variant = 'outline', label, error, className, disabled, ...props }: CommonInputProps) => {
-	return (
-		<div className={styles.box}>
-			<div className={styles.header}>{label && <label className={c(styles.label, error && styles.label_error)}>{label}</label>}</div>
-			<div
-				className={c(
-					styles.wrapper,
-					styles[`wrapper_${variant}`],
-					disabled && styles[`wrapper_${variant}_disabled`],
-					error && styles.wrapper_error
-				)}
-			>
-				<input
-					{...props}
+export const CommonInput = forwardRef<HTMLInputElement, CommonInputProps>(
+	(
+		{
+			rightSlot,
+			label,
+			error,
+			className,
+			disabled,
+			trim = false,
+			variant = 'outline',
+			...props
+		},
+		ref
+	) => {
+		const onChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+			event.target.value = trim ? event.target.value.trim() : event.target.value
+		}
+
+		return (
+			<div className={styles.box}>
+				<div className={styles.header}>
+					{label && (
+						<label
+							className={c(
+								styles.label,
+								styles[`label_${variant}`],
+								error && styles.label_error
+							)}
+						>
+							{label}
+						</label>
+					)}
+				</div>
+				<div
 					className={c(
-						styles.input,
-						styles[`input_${variant}`],
-						disabled && styles[`input_${variant}_disabled`],
-						error && styles.input_error,
-						className
+						styles.wrapper,
+						styles[`wrapper_${variant}`],
+						disabled && styles[`wrapper_${variant}_disabled`],
+						error && styles.wrapper_error
 					)}
-					disabled={disabled}
-				/>
-				{rightSlot}
+				>
+					<input
+						ref={ref}
+						className={c(
+							styles.input,
+							styles[`input_${variant}`],
+							disabled && styles[`input_${variant}_disabled`],
+							error && styles.input_error,
+							className
+						)}
+						onChange={onChange}
+						disabled={disabled}
+						{...props}
+					/>
+					{rightSlot}
+				</div>
+				<p className={c(styles.header__error, error && styles.header__error_visible)}>
+					{error ? error?.message : ''}
+				</p>
 			</div>
-			<p className={c(styles.header__error, error && styles.header__error_visible)}>{error ? error?.message : ''}</p>
-		</div>
-	)
-}
-
-{
-	/* <div className="flex items-center justify-between px-[10px]">
-        {label && <label className="mb-[8px] inline-block font-medium">{label}</label>}
-        <p
-          className={c(
-            "translate-y-4 font-bold text-red-700",
-            "opacity-0 transition-all duration-300",
-            error && "!translate-y-0 !opacity-100"
-          )}
-        >
-          {error ? error?.message : ""}
-        </p>
-      </div> */
-}
+		)
+	}
+)
@@ -24,7 +24,13 @@ export const Error: React.FC<IError> = ({ handleClose }) => {
 
 	return (
 		<CSSTransition nodeRef={nodeRef} in={isOpened} timeout={400} unmountOnExit classNames='my-node'>
-			<Snackbar anchorOrigin={{ vertical: 'top', horizontal: 'right' }} open={isOpened} autoHideDuration={6000} onClose={handleClose}>
+			<Snackbar
+				style={{ zIndex: 100000 }}
+				anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
+				open={isOpened}
+				autoHideDuration={6000}
+				onClose={handleClose}
+			>
 				{variant == 'error' ? (
 					<Alert
 						ref={nodeRef}
@@ -0,0 +1,7 @@
+import '@testing-library/jest-dom'
+
+describe('Test', () => {
+	it('renders a heading', () => {
+		// throw new Error('test')
+	})
+})
@@ -77,7 +77,7 @@ export const SecurityList = ({
 			return [data]
 		})
 
-		showMessage('Пользователь успешно приглашен!')
+		showMessage('Пользователь успешно приглашен!', 'success')
 	}
 
 	const [search, setSearch] = useState('')
@@ -99,7 +99,7 @@ export const SecurityList = ({
 			})
 		)
 		setCurrentPerson(null)
-		showMessage(`Лимит пользователя ${email} успешно изменён!`)
+		showMessage(`Лимит пользователя ${email} успешно изменён!`, 'success')
 	}
 
 	useEffect(() => {
@@ -281,7 +281,7 @@ export const InviteSecurityModal: FC<InviteModalProps> = ({ open, onClose, showN
 		const res = await invitePerson(role, data.limit, data.email, group && group[0], session?.access)
 
 		if (res === null) {
-			showMessage('Что-то пошло не так')
+			showMessage('Что-то пошло не так', 'error')
 			setIsLoading(false)
 			return
 		}
@@ -293,7 +293,7 @@ export const InviteSecurityModal: FC<InviteModalProps> = ({ open, onClose, showN
 		showNewPersons(res.data)
 	}
 	const checkError: SubmitErrorHandler<IEmailForms> = (data) => {
-		showMessage(Object.values(data)[0].message || 'Неверные данные')
+		showMessage(Object.values(data)[0].message || 'Неверные данные', 'error')
 	}
 
 	const handleEmailChange = (event: any) => {
@@ -15,6 +15,8 @@ declare module "*.svg?react" {
   export default content;
 }
 
+
+
 declare module "*.svg?url" {
   const content: {
     blurHeight: number;
@@ -0,0 +1,17 @@
+import type { Config } from 'jest'
+import nextJest from 'next/jest.js'
+
+const createJestConfig = nextJest({
+	dir: './',
+})
+
+const config: Config = {
+	coverageProvider: 'v8',
+	testEnvironment: 'jsdom',
+	moduleNameMapper: { 
+		'^#/(.*)$': '<rootDir>/src/$1',
+		'\\.(svg)': '<rootDir>/__mocks__/svg.ts',
+	},
+}
+
+export default createJestConfig(config)
@@ -16,7 +16,9 @@
 		"precommit": "lint-staged",
 		"prepare": "husky install",
 		"tunnel": "vk-tunnel --insecure=1 --http-protocol=https --ws-protocol=wss --host=0.0.0.0 --port=3000",
-		"export": "next export"
+		"export": "next export",
+		"test": "jest",
+		"test:watch": "jest --watch"
 	},
 	"engines": {
 		"node": ">=12.0.0"
@@ -43,6 +45,7 @@
 		"@reduxjs/toolkit": "^1.9.5",
 		"@sentry/nextjs": "^9.12.0",
 		"@sentry/webpack-plugin": "^3.3.1",
+		"@testing-library/user-event": "^14.6.1",
 		"@types/cookie": "^0.5.1",
 		"@types/intro.js": "^5.1.1",
 		"@types/lodash": "^4.14.195",
@@ -50,7 +53,7 @@
 		"@types/react": "18.0.28",
 		"@types/react-dom": "18.0.11",
 		"@types/react-syntax-highlighter": "^15.5.7",
-		"axios": "^0.24.0",
+		"axios": "^1.7.9",
 		"base64-encode-file": "^1.0.7",
 		"buffer": "^6.0.3",
 		"chart.js": "^4.4.0",
@@ -92,13 +95,21 @@
 	},
 	"devDependencies": {
 		"@svgr/webpack": "^8.1.0",
+		"@testing-library/dom": "^10.4.0",
+		"@testing-library/jest-dom": "^6.6.3",
+		"@testing-library/react": "^16.3.0",
 		"@types/intro.js": "^5.1.1",
+		"@types/jest": "^29.5.14",
 		"@types/lodash": "^4.14.195",
 		"@types/react-draft-wysiwyg": "^1.13.8",
 		"@types/react-syntax-highlighter": "^15.5.7",
+		"cross-fetch": "^4.1.0",
 		"eslint-config-prettier": "^8.8.0",
+		"jest": "^29.7.0",
+		"jest-environment-jsdom": "^29.7.0",
 		"lint-staged": "^13.2.2",
 		"prettier": "^2.8.8",
+		"ts-node": "^10.9.2",
 		"typescript": "5.1.3"
 	},
 	"resolutions": {