diff --git a/src/features/AuthServiceApp/components/ConfirmPopup/index.tsx b/src/features/AuthServiceApp/components/ConfirmPopup/index.tsx
new file mode 100644
index 00000000..33fb1c6f
--- /dev/null
+++ b/src/features/AuthServiceApp/components/ConfirmPopup/index.tsx
@@ -0,0 +1,49 @@
+import { T9n } from 'features/T9n'
+
+import {
+ ScBody,
+ Modal,
+ ScApplyButton,
+ ScHeaderTitle,
+ ScText,
+} from './styled'
+
+import {
+ Header,
+ Wrapper,
+ Footer,
+} from '../RegisterPopup/styled'
+
+type Props = {
+ handleModalClose: () => void,
+ isModalOpen: boolean,
+}
+
+export const ConfirmPopup = (props: Props) => {
+ const {
+ handleModalClose,
+ isModalOpen,
+ } = props
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/src/features/AuthServiceApp/components/ConfirmPopup/styled.tsx b/src/features/AuthServiceApp/components/ConfirmPopup/styled.tsx
new file mode 100644
index 00000000..7d6cab2b
--- /dev/null
+++ b/src/features/AuthServiceApp/components/ConfirmPopup/styled.tsx
@@ -0,0 +1,30 @@
+import styled from 'styled-components/macro'
+import { ModalWindow } from 'features/Modal/styled'
+import {
+ ApplyButton,
+ Body,
+ Modal as BaseModal,
+ HeaderTitle,
+} from 'features/AuthServiceApp/components/RegisterPopup/styled'
+
+export const Modal = styled(BaseModal)`
+ ${ModalWindow} {
+ min-height: 220px;
+ }
+`
+
+export const ScHeaderTitle = styled(HeaderTitle)`
+ text-align: center;
+`
+
+export const ScBody = styled(Body)`
+ padding: 25px 16px 0 16px;
+`
+
+export const ScText = styled.span`
+ text-align: center;
+`
+
+export const ScApplyButton = styled(ApplyButton)`
+ margin: 0;
+`
diff --git a/src/features/AuthServiceApp/components/Login/hooks.tsx b/src/features/AuthServiceApp/components/Login/hooks.tsx
index b2ba8a09..454928bd 100644
--- a/src/features/AuthServiceApp/components/Login/hooks.tsx
+++ b/src/features/AuthServiceApp/components/Login/hooks.tsx
@@ -24,7 +24,14 @@ export const useLoginForm = () => {
} = useParamsUrl()
const [authError, setAuthError] = useState('')
const [isFetching, setIsFetching] = useState(false)
- const [isModalOpen, setIsModalOpen] = useState(false)
+ const [isRecoveryPopupOpen, setIsRecoveryPopupOpen] = useState(false)
+ const [isConfirmPopupOpen, setIsConfirmPopupOpen] = useState(false)
+
+ const countVisits = () => {
+ if (!localStorage.getItem('countVisits')) {
+ setIsConfirmPopupOpen(true)
+ }
+ }
const formRef = useRef(null)
@@ -47,7 +54,11 @@ export const useLoginForm = () => {
)
const handleModalOpen = () => {
- setIsModalOpen(true)
+ setIsRecoveryPopupOpen(true)
+ }
+
+ const closeConfirmPopup = () => {
+ setIsConfirmPopupOpen(false)
}
const submitForm = () => formRef.current?.submit()
@@ -72,6 +83,8 @@ export const useLoginForm = () => {
scope,
},
})
+ const numberVisits = localStorage.getItem('countVisits') ?? 0
+ localStorage.setItem('countVisits', (Number(numberVisits) + 1).toString())
submitForm()
} catch (err) {
handleError(String(err))
@@ -82,16 +95,22 @@ export const useLoginForm = () => {
setAuthError('')
}, [email, password])
+ useEffect(() => {
+ countVisits()
+ }, [])
+
return {
authError,
client_id,
+ closeConfirmPopup,
email,
formError,
formRef,
handleModalOpen,
handleSubmit,
+ isConfirmPopupOpen,
isFetching,
- isModalOpen,
+ isRecoveryPopupOpen,
isSubmitDisabled,
lang,
onEmailBlur,
@@ -103,7 +122,8 @@ export const useLoginForm = () => {
response_mode,
response_type,
scope,
- setIsModalOpen,
+ setIsConfirmPopupOpen,
+ setIsRecoveryPopupOpen,
url,
}
}
diff --git a/src/features/AuthServiceApp/components/Login/index.tsx b/src/features/AuthServiceApp/components/Login/index.tsx
index d9a70d8d..06383c09 100644
--- a/src/features/AuthServiceApp/components/Login/index.tsx
+++ b/src/features/AuthServiceApp/components/Login/index.tsx
@@ -1,6 +1,7 @@
import { T9n } from 'features/T9n'
import { ArrowLoader } from 'features/ArrowLoader'
import { RecoveryPopup } from 'features/AuthServiceApp/components/RecoveryPopup'
+import { ConfirmPopup } from 'features/AuthServiceApp/components/ConfirmPopup'
import { PAGES } from '../../config/pages'
import { LanguageSelect } from '../LanguageSelect'
@@ -28,13 +29,15 @@ const Login = () => {
const {
authError,
client_id,
+ closeConfirmPopup,
email,
formError,
formRef,
handleModalOpen,
handleSubmit,
+ isConfirmPopupOpen,
isFetching,
- isModalOpen,
+ isRecoveryPopupOpen,
isSubmitDisabled,
lang,
onEmailBlur,
@@ -46,7 +49,7 @@ const Login = () => {
response_mode,
response_type,
scope,
- setIsModalOpen,
+ setIsRecoveryPopupOpen,
url,
} = useLoginForm()
diff --git a/src/features/AuthServiceApp/components/Registration/styled.tsx b/src/features/AuthServiceApp/components/Registration/styled.tsx
index 560660c3..7ff07ebb 100644
--- a/src/features/AuthServiceApp/components/Registration/styled.tsx
+++ b/src/features/AuthServiceApp/components/Registration/styled.tsx
@@ -37,6 +37,7 @@ export const CheckboxWrapper = styled.div`
`
export const Label = styled.span`
+ width: 100%;
font-weight: normal;
font-size: 14px;
line-height: 21px;
diff --git a/src/features/AuthServiceApp/config/lexics.tsx b/src/features/AuthServiceApp/config/lexics.tsx
index 7e4fcaae..127c8fb7 100644
--- a/src/features/AuthServiceApp/config/lexics.tsx
+++ b/src/features/AuthServiceApp/config/lexics.tsx
@@ -6,6 +6,7 @@ export const lexics = {
check_password: 15842,
confirm_2_hours: 15906,
confirm_email: 15432,
+ consent: 15431,
error_accept_cookies: 17268,
error_email_already_in_use: 11156,
error_empty_email: 2498,
@@ -27,6 +28,7 @@ export const lexics = {
form_password: 751,
go_back: 1907,
i_accept: 15737,
+ i_agree: 15430,
login: 13404,
password_new: 15056,
password_repeat: 15057,
@@ -45,4 +47,5 @@ export const lexics = {
step_title_registration: 1306,
terms_and_conditions: 15738,
to_email: 15904,
+ updated_terms: 15429,
}