Fix disabled locations when rescheduling (#5046)
* fix phone number input when attendee phone number is default checked * add selected location for rescheduling and remove default checked * don't show locations when rescheduling on availability page * fix type error Co-authored-by: CarinaWolli <wollencarina@gmail.com> Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
This commit is contained in:
4 files changed
+44
-32
No files matched your search
@@ -34,6 +34,7 @@ interface Props {
|
||||
isBookingPage?: boolean;
|
||||
children: ReactNode;
|
||||
isMobile?: boolean;
|
||||
rescheduleUid?: string;
|
||||
}
|
||||
|
||||
const BookingDescription: FC<Props> = (props) => {
|
||||
@@ -84,7 +85,7 @@ const BookingDescription: FC<Props> = (props) => {
|
||||
{t("requires_confirmation")}
|
||||
</div>
|
||||
)}
|
||||
{!isBookingPage ? (
|
||||
{!isBookingPage && !props.rescheduleUid ? (
|
||||
<AvailableEventLocations
|
||||
locations={eventType.locations as AvailabilityPageProps["eventType"]["locations"]}
|
||||
/>
|
||||
|
||||
@@ -419,7 +419,7 @@ const AvailabilityPage = ({ profile, eventType }: Props) => {
|
||||
"min-w-full md:w-[280px] md:min-w-[280px]",
|
||||
recurringEventCount && "xl:w-[380px] xl:min-w-[380px]"
|
||||
)}>
|
||||
<BookingDescription profile={profile} eventType={eventType}>
|
||||
<BookingDescription profile={profile} eventType={eventType} rescheduleUid={rescheduleUid}>
|
||||
{!rescheduleUid && eventType.recurringEvent && (
|
||||
<div className="flex items-start text-sm font-medium">
|
||||
<Icon.FiRefreshCcw className="float-left mr-[10px] mt-[7px] ml-[2px] inline-block h-4 w-4 " />
|
||||
|
||||
@@ -19,6 +19,7 @@ import {
|
||||
getEventLocationValue,
|
||||
getEventLocationType,
|
||||
EventLocationType,
|
||||
getHumanReadableLocationValue,
|
||||
} from "@calcom/app-store/locations";
|
||||
import { createPaymentLink } from "@calcom/app-store/stripepayment/lib/client";
|
||||
import { getEventTypeAppData } from "@calcom/app-store/utils";
|
||||
@@ -53,8 +54,6 @@ import slugify from "@lib/slugify";
|
||||
|
||||
import Gates, { Gate, GateState } from "@components/Gates";
|
||||
import BookingDescription from "@components/booking/BookingDescription";
|
||||
import { UserAvatars } from "@components/booking/UserAvatars";
|
||||
import EventTypeDescriptionSafeHTML from "@components/eventtype/EventTypeDescriptionSafeHTML";
|
||||
|
||||
import { BookPageProps } from "../../../pages/[user]/book";
|
||||
import { HashLinkPageProps } from "../../../pages/d/[link]/book";
|
||||
@@ -578,37 +577,48 @@ const BookingPage = ({
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
{locations.length > 1 && (
|
||||
<div className="mb-4">
|
||||
<div className="mb-4">
|
||||
<>
|
||||
<span className="block text-sm font-medium text-gray-700 dark:text-white">
|
||||
{t("location")}
|
||||
</span>
|
||||
{locations.map((location, i) => {
|
||||
const locationString = locationKeyToString(location);
|
||||
// TODO: Right now selectedLocationType isn't send by getSSP. Once that's available defaultChecked should work and show the location in the original booking
|
||||
const defaultChecked = rescheduleUid ? selectedLocationType === location.type : i === 0;
|
||||
if (typeof locationString !== "string") {
|
||||
// It's possible that location app got uninstalled
|
||||
return null;
|
||||
}
|
||||
return (
|
||||
<label key={i} className="block">
|
||||
<input
|
||||
type="radio"
|
||||
disabled={!!disableLocations}
|
||||
className="location dark:bg-darkgray-300 dark:border-darkgray-300 h-4 w-4 border-gray-300 text-black focus:ring-black ltr:mr-2 rtl:ml-2"
|
||||
{...bookingForm.register("locationType", { required: true })}
|
||||
value={location.type}
|
||||
defaultChecked={defaultChecked}
|
||||
/>
|
||||
<span className="text-sm ltr:ml-2 rtl:mr-2 dark:text-white">
|
||||
{locationKeyToString(location)}
|
||||
</span>
|
||||
</label>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
{rescheduleUid ? (
|
||||
<p className="mt-1 text-sm text-gray-500">
|
||||
{getHumanReadableLocationValue(booking?.location, t)}
|
||||
</p>
|
||||
) : (
|
||||
locations.length > 1 && (
|
||||
<>
|
||||
{locations.map((location, i) => {
|
||||
const locationString = locationKeyToString(location);
|
||||
if (!selectedLocationType) {
|
||||
bookingForm.setValue("locationType", locations[0].type);
|
||||
}
|
||||
if (typeof locationString !== "string") {
|
||||
// It's possible that location app got uninstalled
|
||||
return null;
|
||||
}
|
||||
return (
|
||||
<label key={i} className="block">
|
||||
<input
|
||||
type="radio"
|
||||
disabled={!!disableLocations}
|
||||
className="location dark:bg-darkgray-300 dark:border-darkgray-300 h-4 w-4 border-gray-300 text-black focus:ring-black ltr:mr-2 rtl:ml-2"
|
||||
{...bookingForm.register("locationType", { required: true })}
|
||||
value={location.type}
|
||||
defaultChecked={i === 0}
|
||||
/>
|
||||
<span className="text-sm ltr:ml-2 rtl:mr-2 dark:text-white">
|
||||
{locationKeyToString(location)}
|
||||
</span>
|
||||
</label>
|
||||
);
|
||||
})}
|
||||
</>
|
||||
)
|
||||
)}
|
||||
</>
|
||||
</div>
|
||||
{/* TODO: Change name and id ="phone" to something generic */}
|
||||
{AttendeeInput && (
|
||||
<div className="mb-4">
|
||||
|
||||
@@ -10,6 +10,7 @@ async function getBooking(prisma: PrismaClient, uid: string) {
|
||||
description: true,
|
||||
customInputs: true,
|
||||
smsReminderNumber: true,
|
||||
location: true,
|
||||
attendees: {
|
||||
select: {
|
||||
email: true,
|
||||
|
||||
Reference in new issue
Block a user