'use client'

import { useTranslations } from 'next-intl';
import { useAllFilesExtensions } from '@/app/hooks/react-query/useAllFilesExtensions';
import VerificationUploadSection from '@/app/ui/settings/component/verification-upload-section';
import { useUserProfile } from '@/app/hooks/react-query/useUserDataInfo';

export default function SettingUserVerification() {
	const t = useTranslations('Global');

	const { data: allFilesExtensions } = useAllFilesExtensions();
	const { data: userData, isLoading, isError } = useUserProfile();

	return (
		<div className="settings-form">
			<div className="form-section verefication-section">
				<h3 className="form-section-title">
					Верификация юзера
				</h3>
				{userData?.verifiedStatus === 'NOT_VERIFIED' ? (
					<VerificationUploadSection
						fileType="image"
						allowedExtensions={allFilesExtensions.images}
						maxFileSize={allFilesExtensions.maxFileSize}
					/>
				) : (
					<span>
						{t('Status')}: {userData?.verifiedStatus === 'VERIFICATION_IN_PROGRESS'? t('under-moderation') : userData?.verifiedStatus}
					</span>
				)}
				{/* 					<button type="submit" className="btn btn-primary">
						загрузить
					</button> */}
			</div>
		</div>
	)
}