fix: Button re-enables on sluggish networks whilst redirecting (#13106)
* fix: Button re-enables on sluggish networks whilst re-direct is happening * Add explanatory comment * fix: Booking form validation can take a while --------- Co-authored-by: Joe Au-Yeung <65426560+joeauyeung@users.noreply.github.com> Co-authored-by: Peer Richelsen <peeroke@gmail.com>
This commit is contained in:
parent
6dbf372ab0
commit
c34c27fc0a
|
@ -200,7 +200,7 @@ export const BookEventFormChild = ({
|
||||||
const { uid, paymentUid } = responseData;
|
const { uid, paymentUid } = responseData;
|
||||||
const fullName = getFullName(bookingForm.getValues("responses.name"));
|
const fullName = getFullName(bookingForm.getValues("responses.name"));
|
||||||
if (paymentUid) {
|
if (paymentUid) {
|
||||||
return router.push(
|
router.push(
|
||||||
createPaymentLink({
|
createPaymentLink({
|
||||||
paymentUid,
|
paymentUid,
|
||||||
date: timeslot,
|
date: timeslot,
|
||||||
|
@ -225,7 +225,7 @@ export const BookEventFormChild = ({
|
||||||
isRescheduling && bookingData?.startTime ? dayjs(bookingData.startTime).toString() : undefined,
|
isRescheduling && bookingData?.startTime ? dayjs(bookingData.startTime).toString() : undefined,
|
||||||
};
|
};
|
||||||
|
|
||||||
return bookingSuccessRedirect({
|
bookingSuccessRedirect({
|
||||||
successRedirectUrl: eventType?.successRedirectUrl || "",
|
successRedirectUrl: eventType?.successRedirectUrl || "",
|
||||||
query,
|
query,
|
||||||
booking: responseData,
|
booking: responseData,
|
||||||
|
@ -272,7 +272,7 @@ export const BookEventFormChild = ({
|
||||||
isRescheduling && bookingData?.startTime ? dayjs(bookingData.startTime).toString() : undefined,
|
isRescheduling && bookingData?.startTime ? dayjs(bookingData.startTime).toString() : undefined,
|
||||||
};
|
};
|
||||||
|
|
||||||
return bookingSuccessRedirect({
|
bookingSuccessRedirect({
|
||||||
successRedirectUrl: eventType?.successRedirectUrl || "",
|
successRedirectUrl: eventType?.successRedirectUrl || "",
|
||||||
query,
|
query,
|
||||||
booking,
|
booking,
|
||||||
|
@ -325,10 +325,6 @@ export const BookEventFormChild = ({
|
||||||
);
|
);
|
||||||
|
|
||||||
const bookEvent = (values: BookingFormValues) => {
|
const bookEvent = (values: BookingFormValues) => {
|
||||||
// Clears form values stored in store, so old values won't stick around.
|
|
||||||
setFormValues({});
|
|
||||||
bookingForm.clearErrors();
|
|
||||||
|
|
||||||
// It shouldn't be possible that this method is fired without having eventQuery data,
|
// It shouldn't be possible that this method is fired without having eventQuery data,
|
||||||
// but since in theory (looking at the types) it is possible, we still handle that case.
|
// but since in theory (looking at the types) it is possible, we still handle that case.
|
||||||
if (!eventQuery?.data) {
|
if (!eventQuery?.data) {
|
||||||
|
@ -375,6 +371,9 @@ export const BookEventFormChild = ({
|
||||||
} else {
|
} else {
|
||||||
createBookingMutation.mutate(mapBookingToMutationInput(bookingInput));
|
createBookingMutation.mutate(mapBookingToMutationInput(bookingInput));
|
||||||
}
|
}
|
||||||
|
// Clears form values stored in store, so old values won't stick around.
|
||||||
|
setFormValues({});
|
||||||
|
bookingForm.clearErrors();
|
||||||
};
|
};
|
||||||
|
|
||||||
if (!eventType) {
|
if (!eventType) {
|
||||||
|
@ -442,7 +441,14 @@ export const BookEventFormChild = ({
|
||||||
<Button
|
<Button
|
||||||
type="submit"
|
type="submit"
|
||||||
color="primary"
|
color="primary"
|
||||||
loading={createBookingMutation.isLoading || createRecurringBookingMutation.isLoading}
|
loading={
|
||||||
|
bookingForm.formState.isSubmitting ||
|
||||||
|
createBookingMutation.isLoading ||
|
||||||
|
createRecurringBookingMutation.isLoading ||
|
||||||
|
// A redirect is triggered on mutation success, so keep the button disabled as this is happening.
|
||||||
|
createBookingMutation.isSuccess ||
|
||||||
|
createRecurringBookingMutation.isSuccess
|
||||||
|
}
|
||||||
data-testid={
|
data-testid={
|
||||||
rescheduleUid && bookingData ? "confirm-reschedule-button" : "confirm-book-button"
|
rescheduleUid && bookingData ? "confirm-reschedule-button" : "confirm-book-button"
|
||||||
}>
|
}>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user