Merged in fix/SW-2717-select-hotel-booking-codes- (pull request #2270)

fix: SW-2717 Updated filter display rules

* fix: SW-2717 Updated filter display rules

* fix: SW-2717 Fixed chip button trigger popover after next upgrade

* SW-2717 Optimised code


Approved-by: Erik Tiekstra
This commit is contained in:
Hrishikesh Vaipurkar
2025-06-05 07:14:49 +00:00
parent 9fb5f82d92
commit e3f4cfb738
9 changed files with 32 additions and 37 deletions

View File

@@ -1,6 +1,6 @@
"use client"
import { useState } from "react"
import { useEffect, useState } from "react"
import {
Dialog,
DialogTrigger,
@@ -33,6 +33,7 @@ export default function BookingCodeFilter() {
const intl = useIntl()
const lang = useLang()
const [isOpen, setIsOpen] = useState(false)
const [isDesktop, setIsDesktop] = useState(false)
const displayAsPopover = useMediaQuery("(min-width: 768px)")
const utils = trpc.useUtils()
const {
@@ -95,6 +96,11 @@ export default function BookingCodeFilter() {
})
)
// To fix the hyderation error
useEffect(() => {
setIsDesktop(displayAsPopover)
}, [displayAsPopover])
if (hideFilter || !booking.bookingCode) {
return null
}
@@ -115,8 +121,8 @@ export default function BookingCodeFilter() {
color="CurrentColor"
/>
</ChipButton>
{displayAsPopover ? (
<Popover placement="bottom end">
{isDesktop ? (
<Popover placement="bottom end" isNonModal>
<Dialog className={styles.dialog}>
{({ close }) => {
function handleChangeFilterValue(value: string) {

View File

@@ -19,6 +19,7 @@ import styles from "./roomPackageFilter.module.css"
export default function RoomPackageFilterModal() {
const intl = useIntl()
const [isOpen, setIsOpen] = useState(false)
return (
<DialogTrigger isOpen={isOpen} onOpenChange={setIsOpen}>
<ChipButton variant="Outlined">

View File

@@ -12,6 +12,7 @@ import styles from "./roomPackageFilter.module.css"
export default function RoomPackageFilterPopover() {
const intl = useIntl()
const [isOpen, setIsOpen] = useState(false)
return (
<DialogTrigger isOpen={isOpen} onOpenChange={setIsOpen}>
<ChipButton variant="Outlined">