scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in fix/clear-guest-form (pull request #3168)

Browse Source 
fix(STAY-120): Avoid prefilling edit guest details form in MyStay

* fix: Avoid prefilling edit guest details form in MyStay

fix: Avoid prefilling edit guest details form in MyStay


Approved-by: Erik Tiekstra
Approved-by: Elin Svedin
Approved-by: Linus Flood
This commit is contained in:
Christel Westerberg
2025-11-19 08:11:26 +00:00
parent 01901ab02e
commit a6a259c739
4 changed files with 62 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
apps/scandic-web/components/HotelReservation/MyStay/ModifyContact/index.tsx
View File

@@ -1,12 +1,14 @@
"use client"
import { useEffect } from "react"
import { useFormContext } from "react-hook-form"
import { useIntl } from "react-intl"
import { getDefaultCountryFromLang } from "@scandic-hotels/common/utils/phone"
import Body from "@scandic-hotels/design-system/Body"
import {
formatPhoneNumber,
getDefaultCountryFromLang,
} from "@scandic-hotels/common/utils/phone"
import CountrySelect from "@scandic-hotels/design-system/Form/Country"
import Phone from "@scandic-hotels/design-system/Form/Phone"
import { Typography } from "@scandic-hotels/design-system/Typography"
import Input from "@/components/TempDesignSystem/Form/Input"
import useLang from "@/hooks/useLang"
@@ -30,17 +32,13 @@ export default function ModifyContact({
const lang = useLang()
const {
getValues,
setValue,
formState: { errors },
} = useFormContext()
useEffect(() => {
setValue("firstName", guest.firstName ?? "")
setValue("lastName", guest.lastName ?? "")
setValue("email", guest.email ?? "")
setValue("phoneNumber", guest.phoneNumber ?? "")
setValue("countryCode", guest.countryCode ?? "")
}, [guest, setValue])
const phoneNumber = formatPhoneNumber(
getValues("phoneNumber"),
getValues("phoneNumberCC")
)
return (
<>
@@ -115,19 +113,27 @@ export default function ModifyContact({
</div>
) : (
<>
<Body color="uiTextHighContrast">
{intl.formatMessage({
id: "myStay.modifyContact.confirmationMessage",
defaultMessage:
"Are you sure you want to change your guest details?",
})}
</Body>
<Typography variant="Body/Paragraph/mdRegular">
<p>
{intl.formatMessage({
id: "myStay.modifyContact.confirmationMessage",
defaultMessage:
"Are you sure you want to change your guest details?",
})}
</p>
</Typography>
<div className={styles.container}>
<Body color="uiTextHighContrast" textTransform="bold">
{getValues("firstName")} {getValues("lastName")}
</Body>
<Body color="uiTextHighContrast">{getValues("email")}</Body>
<Body color="uiTextHighContrast">{getValues("phoneNumber")}</Body>
<Typography variant="Body/Paragraph/mdBold">
<p>
{getValues("firstName")} {getValues("lastName")}
</p>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<p>{getValues("email")}</p>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<p>{phoneNumber}</p>
</Typography>
</div>
</>
)}