Merged in fix/SW-350-ui-comments (pull request #817)

fix/SW-350-ui-comments

Approved-by: Niclas Edenvin
This commit is contained in:
Pontus Dreij
2024-11-04 14:51:36 +00:00
12 changed files with 40 additions and 24 deletions

View File

@@ -80,7 +80,7 @@ export default function MobileToggleButton({
{!locationAndDateIsSet && ( {!locationAndDateIsSet && (
<> <>
<div> <div>
<Caption color="red"> <Caption type="bold" color="red">
{intl.formatMessage({ id: "Where to" })} {intl.formatMessage({ id: "Where to" })}
</Caption> </Caption>
<Body color="uiTextPlaceholder"> <Body color="uiTextPlaceholder">
@@ -91,7 +91,7 @@ export default function MobileToggleButton({
</div> </div>
<Divider color="baseSurfaceSubtleNormal" variant="vertical" /> <Divider color="baseSurfaceSubtleNormal" variant="vertical" />
<div> <div>
<Caption color="red"> <Caption type="bold" color="red">
{intl.formatMessage( {intl.formatMessage(
{ id: "booking.nights" }, { id: "booking.nights" },
{ totalNights: nights } { totalNights: nights }

View File

@@ -29,17 +29,23 @@ export default function SearchList({
}: SearchListProps) { }: SearchListProps) {
const intl = useIntl() const intl = useIntl()
const [hasMounted, setHasMounted] = useState(false) const [hasMounted, setHasMounted] = useState(false)
const [isFormSubmitted, setIsFormSubmitted] = useState(false)
const { const {
clearErrors, clearErrors,
formState: { errors }, formState: { errors, isSubmitted },
} = useFormContext() } = useFormContext()
const searchError = errors["search"] const searchError = errors["search"]
useEffect(() => {
setIsFormSubmitted(isSubmitted)
}, [isSubmitted])
useEffect(() => { useEffect(() => {
let timeoutID: ReturnType<typeof setTimeout> | null = null let timeoutID: ReturnType<typeof setTimeout> | null = null
if (searchError && searchError.message === "Required") { if (searchError && searchError.message === "Required") {
timeoutID = setTimeout(() => { timeoutID = setTimeout(() => {
clearErrors("search") clearErrors("search")
setIsFormSubmitted(false)
// magic number originates from animation // magic number originates from animation
// 5000ms delay + 120ms exectuion // 5000ms delay + 120ms exectuion
}, 5120) }, 5120)
@@ -60,7 +66,7 @@ export default function SearchList({
return null return null
} }
if (searchError) { if (searchError && isFormSubmitted) {
if (typeof searchError.message === "string") { if (typeof searchError.message === "string") {
if (!isOpen) { if (!isOpen) {
if (searchError.message === "Required") { if (searchError.message === "Required") {

View File

@@ -48,13 +48,10 @@ export default function Search({ locations }: SearchProps) {
dispatch({ type: ActionType.CLEAR_HISTORY_LOCATIONS }) dispatch({ type: ActionType.CLEAR_HISTORY_LOCATIONS })
} }
function handleOnChange( function dispatchInputValue(inputValue: string) {
evt: FormEvent<HTMLInputElement> | ChangeEvent<HTMLInputElement> if (inputValue) {
) {
const value = evt.currentTarget.value
if (value) {
dispatch({ dispatch({
payload: { search: value }, payload: { search: inputValue },
type: ActionType.SEARCH_LOCATIONS, type: ActionType.SEARCH_LOCATIONS,
}) })
} else { } else {
@@ -62,6 +59,14 @@ export default function Search({ locations }: SearchProps) {
} }
} }
function handleOnChange(
evt: FormEvent<HTMLInputElement> | ChangeEvent<HTMLInputElement>
) {
const newValue = evt.currentTarget.value
setValue(name, newValue)
dispatchInputValue(value)
}
function handleOnFocus(evt: FocusEvent<HTMLInputElement>) { function handleOnFocus(evt: FocusEvent<HTMLInputElement>) {
const searchValue = evt.currentTarget.value const searchValue = evt.currentTarget.value
if (searchValue) { if (searchValue) {
@@ -114,6 +119,7 @@ export default function Search({ locations }: SearchProps) {
inputValue={value} inputValue={value}
itemToString={(value) => (value ? value.name : "")} itemToString={(value) => (value ? value.name : "")}
onSelect={handleOnSelect} onSelect={handleOnSelect}
onInputValueChange={(inputValue) => dispatchInputValue(inputValue)}
> >
{({ {({
closeMenu, closeMenu,
@@ -128,7 +134,11 @@ export default function Search({ locations }: SearchProps) {
}) => ( }) => (
<div className={styles.container}> <div className={styles.container}>
<label {...getLabelProps({ htmlFor: name })} className={styles.label}> <label {...getLabelProps({ htmlFor: name })} className={styles.label}>
<Caption color={isOpen ? "uiTextActive" : "red"} asChild> <Caption
type="bold"
color={isOpen ? "uiTextActive" : "red"}
asChild
>
<span> <span>
{state.searchData?.type === "hotels" {state.searchData?.type === "hotels"
? state.searchData?.relationships?.city?.name ? state.searchData?.relationships?.city?.name

View File

@@ -65,11 +65,7 @@ export default function Form({ locations, type }: BookingWidgetFormProps) {
id={formId} id={formId}
> >
<input {...register("location")} type="hidden" /> <input {...register("location")} type="hidden" />
<FormContent <FormContent locations={locations} formId={formId} />
locations={locations}
formId={formId}
formState={formState}
/>
</form> </form>
</section> </section>
) )

View File

@@ -27,7 +27,7 @@ export default function GuestsRoomsPicker({
id: "Disabled booking options header", id: "Disabled booking options header",
}) })
const disabledBookingOptionsText = intl.formatMessage({ const disabledBookingOptionsText = intl.formatMessage({
id: "Disabled booking options text", id: "Disabled adding room",
}) })
const addRoomLabel = intl.formatMessage({ id: "Add Room" }) const addRoomLabel = intl.formatMessage({ id: "Add Room" })

View File

@@ -11,9 +11,9 @@
"Accessibility": "Tilgængelighed", "Accessibility": "Tilgængelighed",
"Accessible Room": "Tilgængelighedsrum", "Accessible Room": "Tilgængelighedsrum",
"Activities": "Aktiviteter", "Activities": "Aktiviteter",
"Add Room": "Tilføj værelse",
"Add code": "Tilføj kode", "Add code": "Tilføj kode",
"Add new card": "Tilføj nyt kort", "Add new card": "Tilføj nyt kort",
"Add room": "Tilføj værelse",
"Address": "Adresse", "Address": "Adresse",
"Adults": "voksne", "Adults": "voksne",
"Airport": "Lufthavn", "Airport": "Lufthavn",
@@ -90,6 +90,7 @@
"Destination": "Destination", "Destination": "Destination",
"Destinations & hotels": "Destinationer & hoteller", "Destinations & hotels": "Destinationer & hoteller",
"Details": "Detaljer", "Details": "Detaljer",
"Disabled adding room": "Tilføjelse af rum er endnu ikke tilgængelig på den nye hjemmeside.",
"Disabled booking options header": "Vi beklager", "Disabled booking options header": "Vi beklager",
"Disabled booking options text": "Koder, checks og bonusnætter er endnu ikke tilgængelige på den nye hjemmeside.", "Disabled booking options text": "Koder, checks og bonusnætter er endnu ikke tilgængelige på den nye hjemmeside.",
"Discard changes": "Kassér ændringer", "Discard changes": "Kassér ændringer",

View File

@@ -11,9 +11,9 @@
"Accessibility": "Zugänglichkeit", "Accessibility": "Zugänglichkeit",
"Accessible Room": "Barrierefreies Zimmer", "Accessible Room": "Barrierefreies Zimmer",
"Activities": "Aktivitäten", "Activities": "Aktivitäten",
"Add Room": "Zimmer hinzufügen",
"Add code": "Code hinzufügen", "Add code": "Code hinzufügen",
"Add new card": "Neue Karte hinzufügen", "Add new card": "Neue Karte hinzufügen",
"Add room": "Zimmer hinzufügen",
"Address": "Adresse", "Address": "Adresse",
"Adults": "Erwachsene", "Adults": "Erwachsene",
"Airport": "Flughafen", "Airport": "Flughafen",
@@ -90,6 +90,7 @@
"Destination": "Bestimmungsort", "Destination": "Bestimmungsort",
"Destinations & hotels": "Reiseziele & Hotels", "Destinations & hotels": "Reiseziele & Hotels",
"Details": "Details", "Details": "Details",
"Disabled adding room": "Zum Hinzufügen eines Zimmers ist derzeit nicht möglich.",
"Disabled booking options header": "Es tut uns leid", "Disabled booking options header": "Es tut uns leid",
"Disabled booking options text": "Codes, Schecks und Bonusnächte sind auf der neuen Website noch nicht verfügbar.", "Disabled booking options text": "Codes, Schecks und Bonusnächte sind auf der neuen Website noch nicht verfügbar.",
"Discard changes": "Änderungen verwerfen", "Discard changes": "Änderungen verwerfen",

View File

@@ -14,7 +14,6 @@
"Add Room": "Add room", "Add Room": "Add room",
"Add code": "Add code", "Add code": "Add code",
"Add new card": "Add new card", "Add new card": "Add new card",
"Add room": "Add room",
"Add to calendar": "Add to calendar", "Add to calendar": "Add to calendar",
"Address": "Address", "Address": "Address",
"Adults": "Adults", "Adults": "Adults",
@@ -96,6 +95,7 @@
"Destination": "Destination", "Destination": "Destination",
"Destinations & hotels": "Destinations & hotels", "Destinations & hotels": "Destinations & hotels",
"Details": "Details", "Details": "Details",
"Disabled adding room": "Adding room is not available on the new website yet.",
"Disabled booking options header": "We're sorry", "Disabled booking options header": "We're sorry",
"Disabled booking options text": "Codes, cheques and reward nights aren't available on the new website yet.", "Disabled booking options text": "Codes, cheques and reward nights aren't available on the new website yet.",
"Discard changes": "Discard changes", "Discard changes": "Discard changes",

View File

@@ -11,9 +11,9 @@
"Accessibility": "Saavutettavuus", "Accessibility": "Saavutettavuus",
"Accessible Room": "Esteetön huone", "Accessible Room": "Esteetön huone",
"Activities": "Aktiviteetit", "Activities": "Aktiviteetit",
"Add Room": "Lisää huone",
"Add code": "Lisää koodi", "Add code": "Lisää koodi",
"Add new card": "Lisää uusi kortti", "Add new card": "Lisää uusi kortti",
"Add room": "Lisää huone",
"Address": "Osoite", "Address": "Osoite",
"Adults": "Aikuista", "Adults": "Aikuista",
"Airport": "Lentokenttä", "Airport": "Lentokenttä",
@@ -90,6 +90,7 @@
"Destination": "Kohde", "Destination": "Kohde",
"Destinations & hotels": "Kohteet ja hotellit", "Destinations & hotels": "Kohteet ja hotellit",
"Details": "Tiedot", "Details": "Tiedot",
"Disabled adding room": "Lisäämään huone on vielä saatavilla uudella verkkosivustolla.",
"Disabled booking options header": "Olemme pahoillamme", "Disabled booking options header": "Olemme pahoillamme",
"Disabled booking options text": "Koodit, sekit ja palkintoillat eivät ole vielä saatavilla uudella verkkosivustolla.", "Disabled booking options text": "Koodit, sekit ja palkintoillat eivät ole vielä saatavilla uudella verkkosivustolla.",
"Discard changes": "Hylkää muutokset", "Discard changes": "Hylkää muutokset",

View File

@@ -11,9 +11,9 @@
"Accessibility": "Tilgjengelighet", "Accessibility": "Tilgjengelighet",
"Accessible Room": "Tilgjengelighetsrom", "Accessible Room": "Tilgjengelighetsrom",
"Activities": "Aktiviteter", "Activities": "Aktiviteter",
"Add Room": "Legg til rom",
"Add code": "Legg til kode", "Add code": "Legg til kode",
"Add new card": "Legg til nytt kort", "Add new card": "Legg til nytt kort",
"Add room": "Legg til rom",
"Address": "Adresse", "Address": "Adresse",
"Adults": "Voksne", "Adults": "Voksne",
"Airport": "Flyplass", "Airport": "Flyplass",
@@ -89,6 +89,7 @@
"Destination": "Destinasjon", "Destination": "Destinasjon",
"Destinations & hotels": "Destinasjoner og hoteller", "Destinations & hotels": "Destinasjoner og hoteller",
"Details": "Detaljer", "Details": "Detaljer",
"Disabled adding room": "Legg til rom er enda ikke tilgjengelig på den nye nettsiden.",
"Disabled booking options header": "Vi beklager", "Disabled booking options header": "Vi beklager",
"Disabled booking options text": "Koder, checks og belønningsnætter er enda ikke tilgjengelige på den nye nettsiden.", "Disabled booking options text": "Koder, checks og belønningsnætter er enda ikke tilgjengelige på den nye nettsiden.",
"Discard changes": "Forkaste endringer", "Discard changes": "Forkaste endringer",

View File

@@ -11,9 +11,9 @@
"Accessibility": "Tillgänglighet", "Accessibility": "Tillgänglighet",
"Accessible Room": "Tillgänglighetsrum", "Accessible Room": "Tillgänglighetsrum",
"Activities": "Aktiviteter", "Activities": "Aktiviteter",
"Add Room": "Lägg till rum",
"Add code": "Lägg till kod", "Add code": "Lägg till kod",
"Add new card": "Lägg till nytt kort", "Add new card": "Lägg till nytt kort",
"Add room": "Lägg till rum",
"Address": "Adress", "Address": "Adress",
"Adults": "Vuxna", "Adults": "Vuxna",
"Airport": "Flygplats", "Airport": "Flygplats",
@@ -89,6 +89,7 @@
"Destination": "Destination", "Destination": "Destination",
"Destinations & hotels": "Destinationer & hotell", "Destinations & hotels": "Destinationer & hotell",
"Details": "Detaljer", "Details": "Detaljer",
"Disabled adding room": "Lägg till rum är inte tillgängligt än på den nya webbplatsen.",
"Disabled booking options header": "Vi beklagar", "Disabled booking options header": "Vi beklagar",
"Disabled booking options text": "Koder, bonuscheckar och belöningsnätter är inte tillgängliga på den nya webbplatsen än.", "Disabled booking options text": "Koder, bonuscheckar och belöningsnätter är inte tillgängliga på den nya webbplatsen än.",
"Discard changes": "Ignorera ändringar", "Discard changes": "Ignorera ändringar",

View File

@@ -14,7 +14,6 @@ export interface BookingWidgetFormProps {
export interface BookingWidgetFormContentProps { export interface BookingWidgetFormContentProps {
locations: Locations locations: Locations
formId: string formId: string
formState: FormState<BookingWidgetSchema>
} }
export enum ActionType { export enum ActionType {