fix: Date overrides UI bug depending on screen size (#12423)

* Update DateOverrideInputDialog.tsx

fix: Date overrides UI bug depending on screen size (calcom#12406)

* chore: remove comment

---------

Co-authored-by: madhurgoyal19 <35370133+madhurgoyal19@users.noreply.github.com>
Co-authored-by: Udit Takkar <udit222001@gmail.com>
This commit is contained in:
Ujjwal Goyal 2023-11-21 20:26:59 +05:30 committed by GitHub
parent 404bc0e4d6
commit 85237c4985
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -5,7 +5,6 @@ import type { Dayjs } from "@calcom/dayjs";
import dayjs from "@calcom/dayjs";
import { yyyymmdd } from "@calcom/lib/date-fns";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import useMediaQuery from "@calcom/lib/hooks/useMediaQuery";
import type { WorkingHours } from "@calcom/types/schedule";
import {
Dialog,
@ -210,19 +209,12 @@ const DateOverrideInputDialog = ({
onChange: (newValue: TimeRange[]) => void;
value?: TimeRange[];
}) => {
const isMobile = useMediaQuery("(max-width: 768px)");
const [open, setOpen] = useState(false);
{
/* enableOverflow is used to allow overflow when there are too many overrides to show on mobile.
ref:- https://github.com/calcom/cal.com/pull/6215
*/
}
const enableOverflow = isMobile;
return (
<Dialog open={open} onOpenChange={setOpen}>
<DialogTrigger asChild>{Trigger}</DialogTrigger>
<DialogContent enableOverflow={enableOverflow} size="md" className="p-0">
<DialogContent enableOverflow={true} size="md" className="p-0">
<DateOverrideForm
excludedDates={excludedDates}
{...passThroughProps}