rutube

1
import { To,useNavigate } from "react-router-dom";
2

3
import phone from "../../assets/phone.png";
4
import { useAppDispatch } from "../../hooks/useTypedDispatch";
5
import Form from "../../layouts/Form/Form";
6
import { setFinish } from "../../models/feedback";
7
import RoutesPath from "../../utils/enum/RoutesPath";
8
import { delayBeforeMoveToOtherPage } from "../../utils/helper";
9
import IFeedback from "../../utils/interfaces/IFeedback";
10
import css from "./extra.module.css";
11

12
const Extra = () =>
13
{
14
	const navigate = useNavigate();
15
	const dispatch = useAppDispatch();
16

17
	const handleSubmit = (e: React.FormEvent,feedback: IFeedback[]) =>
18
	{
19
		e.preventDefault();
20
		console.log("Submit data:",feedback);
21
		delayBeforeMoveToOtherPage<(to: To) => void>(navigate)(RoutesPath.FINISH);
22
		dispatch(setFinish(true));
23
	};
24

25
	return (
26
		<section className={css.extra_content}>
27
			<div>
28
				<p className={css.extra_content__title}>Пожалуйста,&nbsp;ответьте&nbsp;на&nbsp;дополнительные вопросы.</p>
29
				<Form<IFeedback[]>
30
					handleSubmit={handleSubmit}
31
				/>
32
			</div>
33
			<div className={css.wrapper_img}>
34
				<img src={phone} alt="phone" />
35
			</div>
36
		</section>
37
	);
38
};
39

40
export default Extra;
41