import AnswerExplanation from "@/components/CompatibilityV4/templates/AnswerExplanation"
import { useTranslations } from "@/hooks/translations"
import { ELocalesPlacement } from "@/locales"
import routes from "@/routes"
import { selectors } from "@/store"
import { useSelector } from "react-redux"
import { useNavigate } from "react-router-dom"

function RelationshipStatusResult() {
    const navigate = useNavigate()
    const { translate } = useTranslations(ELocalesPlacement.CompatibilityV4)
    const { relationshipStatus } = useSelector(selectors.selectCompatibilityV4Answers)

    return (
        <AnswerExplanation
            title={translate(`/relationship-status-result.${relationshipStatus}.title`)}
            text={translate(`/relationship-status-result.${relationshipStatus}.text`)}
            handleNext={() => {
                navigate(routes.client.compatibilityV4Birthdate())
            }}
        />
    )
}

export default RelationshipStatusResult