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

feat: SW-276 Updated plurals for labels

Browse Source
This commit is contained in:
Hrishikesh Vaipurkar
2024-10-07 15:32:23 +02:00
parent 770c82e57a
commit 4c82add3bc
7 changed files with 24 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
components/GuestsRoomsPicker/index.tsx
View File

@@ -15,21 +15,20 @@ import styles from "./guests-rooms-picker.module.css"
export default function GuestsRoomsPickerForm() {
const intl = useIntl()
const [isOpen, setIsOpen] = useState(false)
const guestsData = guestsRoomsStore().rooms
const { adultCount, childCount, setIsValidated } = guestsRoomsStore()
const { rooms, adultCount, childCount, setIsValidated } = guestsRoomsStore()
const ref = useRef<HTMLDivElement | null>(null)
function handleOnClick() {
setIsOpen((prevIsOpen) => !prevIsOpen)
}
const closePicker = useCallback(() => {
const guestRoomsValidData = guestRoomsSchema.safeParse(guestsData)
const guestRoomsValidData = guestRoomsSchema.safeParse(rooms)
if (guestRoomsValidData.success) {
setIsOpen(false)
setIsValidated(false)
} else {
setIsValidated(true)
}
}, [guestsData, setIsValidated, setIsOpen])
}, [rooms, setIsValidated, setIsOpen])
useEffect(() => {
function handleClickOutside(evt: Event) {
@@ -44,27 +43,26 @@ export default function GuestsRoomsPickerForm() {
}
}, [closePicker])
const selectedRoomsCount = guestsData.length
const childCountLabel =
childCount > 1
? intl.formatMessage({ id: "Children" })
: intl.formatMessage({ id: "Child" })
return (
<div className={styles.container} data-isopen={isOpen} ref={ref}>
<button className={styles.btn} onClick={handleOnClick} type="button">
<Body className={styles.body}>
{selectedRoomsCount}{" "}
{selectedRoomsCount > 1
? intl.formatMessage({ id: "Rooms" })
: intl.formatMessage({ id: "Room" })}
{intl.formatMessage(
{ id: "booking.rooms" },
{ totalRooms: rooms.length }
)}
{", "}
{adultCount}{" "}
{adultCount > 1
? intl.formatMessage({ id: "Adults" })
: intl.formatMessage({ id: "Adult" })}
{childCount > 0 ? ", " + childCount + " " + childCountLabel : null}
{intl.formatMessage(
{ id: "booking.adults" },
{ totalAdults: adultCount }
)}
{childCount > 0
? ", " +
intl.formatMessage(
{ id: "booking.children" },
{ totalChildren: childCount }
)
: null}
</Body>
</button>
<div aria-modal className={styles.hideWrapper} role="dialog">