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:
parent
404bc0e4d6
commit
85237c4985
|
@ -5,7 +5,6 @@ import type { Dayjs } from "@calcom/dayjs";
|
||||||
import dayjs from "@calcom/dayjs";
|
import dayjs from "@calcom/dayjs";
|
||||||
import { yyyymmdd } from "@calcom/lib/date-fns";
|
import { yyyymmdd } from "@calcom/lib/date-fns";
|
||||||
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
||||||
import useMediaQuery from "@calcom/lib/hooks/useMediaQuery";
|
|
||||||
import type { WorkingHours } from "@calcom/types/schedule";
|
import type { WorkingHours } from "@calcom/types/schedule";
|
||||||
import {
|
import {
|
||||||
Dialog,
|
Dialog,
|
||||||
|
@ -210,19 +209,12 @@ const DateOverrideInputDialog = ({
|
||||||
onChange: (newValue: TimeRange[]) => void;
|
onChange: (newValue: TimeRange[]) => void;
|
||||||
value?: TimeRange[];
|
value?: TimeRange[];
|
||||||
}) => {
|
}) => {
|
||||||
const isMobile = useMediaQuery("(max-width: 768px)");
|
|
||||||
const [open, setOpen] = useState(false);
|
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 (
|
return (
|
||||||
<Dialog open={open} onOpenChange={setOpen}>
|
<Dialog open={open} onOpenChange={setOpen}>
|
||||||
<DialogTrigger asChild>{Trigger}</DialogTrigger>
|
<DialogTrigger asChild>{Trigger}</DialogTrigger>
|
||||||
|
|
||||||
<DialogContent enableOverflow={enableOverflow} size="md" className="p-0">
|
<DialogContent enableOverflow={true} size="md" className="p-0">
|
||||||
<DateOverrideForm
|
<DateOverrideForm
|
||||||
excludedDates={excludedDates}
|
excludedDates={excludedDates}
|
||||||
{...passThroughProps}
|
{...passThroughProps}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user