feat: add attention page and edit birthday page

src/components/AttentionPage/index.tsx

@@ -0,0 +1,31 @@
+import { useNavigate } from 'react-router-dom'
+import { useTranslation } from 'react-i18next'
+import Title from '../Title'
+import routes from '../../routes'
+import styles from './styles.module.css'
+import CheckboxWithText from '../CheckboxWithText'
+
+function AttentionPage(): JSX.Element {
+  const { t } = useTranslation()
+  const navigate = useNavigate()
+  const handleNext = () => navigate(routes.client.feedback())
+
+  const onChangeCheckbox = (e: React.FormEvent<HTMLInputElement>) => {
+    if (e.currentTarget.checked) {
+      handleNext()
+    }
+  }
+
+  return (
+    <section className={`${styles.page} page`}>
+      <img className={styles.icon} src="/stop-icon.png" alt="stop" />
+      <Title variant='h2'>{t('attention')}</Title>
+      <p className={styles.text}>{t('attention_page_text')}</p>
+      <div className={styles['checkbox-container']}>
+        <CheckboxWithText text={t('not_ready_for_information')} onChange={onChangeCheckbox} />
+      </div>
+    </section>
+  )
+}
+
+export default AttentionPage

src/components/AttentionPage/styles.module.css

@@ -0,0 +1,22 @@
+.page {
+    flex: auto;
+    height: calc(100vh - 50px);
+    max-height: -webkit-fill-available;
+    justify-content: center;
+    gap: 16px;
+}
+
+.icon {
+    width: 96px;
+}
+
+.text {
+    text-align: center;
+    line-height: 1.2;
+    font-weight: 700;
+}
+
+.checkbox-container {
+    width: 80%;
+    margin: 64px auto 0;
+}

src/components/BirthdayPage/index.tsx

@@ -17,7 +17,7 @@ function BirthdayPage(): JSX.Element {
   const navigate = useNavigate()
   const birthdate = useSelector(selectors.selectBirthdate)
   const [isDisabled, setIsDisabled] = useState(true)
-  const handleNext = () => navigate(routes.client.birthtime())
+  const handleNext = () => navigate(routes.client.didYouKnow())
   const handleValid = (birthdate: string) => {
     dispatch(actions.form.addDate(birthdate))
     setIsDisabled(birthdate === '')