"use client" import { useEffect, useState } from "react" import { useWatch } from "react-hook-form" import { useIntl } from "react-intl" import { privacyPolicy } from "@/constants/currentWebHrefs" import Checkbox from "@/components/TempDesignSystem/Form/Checkbox" import DateSelect from "@/components/TempDesignSystem/Form/Date" import Input from "@/components/TempDesignSystem/Form/Input" import JoinScandicFriendsCard from "@/components/TempDesignSystem/Form/JoinScandicFriendsCard" import Link from "@/components/TempDesignSystem/Link" import Body from "@/components/TempDesignSystem/Text/Body" import Caption from "@/components/TempDesignSystem/Text/Caption" import useLang from "@/hooks/useLang" import styles from "./signup.module.css" export default function Signup({ name }: { name: string }) { const lang = useLang() const intl = useIntl() const [isJoinChecked, setIsJoinChecked] = useState(false) const joinValue = useWatch({ name }) useEffect(() => { // In order to avoid hydration errors the state needs to be set as side effect, // since the join value can come from search params setIsJoinChecked(joinValue) }, [joinValue]) return (
{isJoinChecked ? (
{intl.formatMessage({ id: "Birth date" })} *
{intl.formatMessage({ id: "Yes, I accept the Terms and conditions for Scandic Friends and understand that Scandic will process my personal data in accordance with", })}{" "} {intl.formatMessage({ id: "Scandic's Privacy Policy." })}
) : null}
) }