public-offering
/
cal.pub0.org
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: email embed – remove collapsible and permanently show times (#10996) 

Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
Co-authored-by: Mehul <mehulzr@gmail.com>
pull/11054/head
Peer Richelsen 2023-08-31 21:32:52 +02:00 committed by GitHub
parent 332c00dac2
commit e06c07bfec
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 34 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
packages/features/embed/Embed.tsx
View File

@ -38,7 +38,7 @@ import {
TextField, TextField,
TimezoneSelect, TimezoneSelect,
} from "@calcom/ui"; } from "@calcom/ui";
import { ArrowDown, ArrowLeft, ArrowUp, Sun } from "@calcom/ui/components/icon"; import { ArrowLeft, Sun } from "@calcom/ui/components/icon";
import { getDimension } from "./lib/getDimension"; import { getDimension } from "./lib/getDimension";
import type { EmbedTabs, EmbedType, EmbedTypes, PreviewState } from "./types"; import type { EmbedTabs, EmbedType, EmbedTypes, PreviewState } from "./types";
@ -223,58 +223,42 @@ const EmailEmbed = ({ eventType, username }: { eventType?: EventType; username:
return ( return (
<div className="flex flex-col"> <div className="flex flex-col">
<div className="mb-[9px] font-medium"> <div className="mb-[9px] font-medium">
<Collapsible open> <div className="text-default text-sm">{t("select_date")}</div>
<CollapsibleContent> <DatePicker
<div className="text-default text-sm">{t("select_date")}</div> isLoading={schedule.isLoading}
<DatePicker onChange={(date) => setSelectedDate(date ? date.format("YYYY-MM-DD") : date)}
isLoading={schedule.isLoading} onMonthChange={(date) => {
onChange={(date) => setSelectedDate(date ? date.format("YYYY-MM-DD") : date)} setMonth(date.format("YYYY-MM"));
onMonthChange={(date) => { setSelectedDate(date.format("YYYY-MM-DD"));
setMonth(date.format("YYYY-MM")); }}
setSelectedDate(date.format("YYYY-MM-DD")); includedDates={nonEmptyScheduleDays}
}} locale={i18n.language}
includedDates={nonEmptyScheduleDays} browsingDate={month ? dayjs(month) : undefined}
locale={i18n.language} selected={dayjs(selectedDate)}
browsingDate={month ? dayjs(month) : undefined} weekStart={weekdayToWeekIndex(event?.data?.users?.[0]?.weekStart)}
selected={dayjs(selectedDate)} eventSlug={eventType?.slug}
weekStart={weekdayToWeekIndex(event?.data?.users?.[0]?.weekStart)} />
eventSlug={eventType?.slug}
/>
</CollapsibleContent>
</Collapsible>
</div> </div>
{selectedDate ? ( {selectedDate ? (
<div className="mt-[9px] font-medium "> <div className="mt-[9px] font-medium ">
<Collapsible open> {selectTime && selectedDate ? (
<CollapsibleContent> <div className="flex h-full w-full flex-row gap-4">
<div <AvailableTimes
className="text-default mb-[9px] flex cursor-pointer items-center justify-between text-sm" className="w-full"
onClick={() => setSelectTime((prev) => !prev)}> date={dayjs(selectedDate)}
<p>{t("select_time")}</p>{" "} selectedSlots={
<> eventType.slug &&
{!selectedDate || !selectTime ? <ArrowDown className="w-4" /> : <ArrowUp className="w-4" />} selectedDatesAndTimes &&
</> selectedDatesAndTimes[eventType.slug] &&
</div> selectedDatesAndTimes[eventType.slug][selectedDate as string]
{selectTime && selectedDate ? ( ? selectedDatesAndTimes[eventType.slug][selectedDate as string]
<div className="flex h-full w-full flex-row gap-4"> : undefined
<AvailableTimes }
className="w-full" onTimeSelect={onTimeSelect}
date={dayjs(selectedDate)} slots={slots}
selectedSlots={ />
eventType.slug && </div>
selectedDatesAndTimes && ) : null}
selectedDatesAndTimes[eventType.slug] &&
selectedDatesAndTimes[eventType.slug][selectedDate as string]
? selectedDatesAndTimes[eventType.slug][selectedDate as string]
: undefined
}
onTimeSelect={onTimeSelect}
slots={slots}
/>
</div>
) : null}
</CollapsibleContent>
</Collapsible>
</div> </div>
) : null} ) : null}
<div className="mb-[9px] font-medium "> <div className="mb-[9px] font-medium ">