Revert "feat: Add cancelledBy input to cancellation page (#18770)" (#22479)

This reverts commit 2838053ba8.

apps/web/components/booking/CancelBooking.tsx

@@ -9,8 +9,7 @@ import { useTelemetry } from "@calcom/lib/hooks/useTelemetry";
 import { collectPageParameters, telemetryEventTypes } from "@calcom/lib/telemetry";
 import type { RecurringEvent } from "@calcom/types/Calendar";
 import { Button } from "@calcom/ui/components/button";
-import { Dialog, DialogContent, DialogHeader } from "@calcom/ui/components/dialog";
-import { Input, Label, Select, TextArea } from "@calcom/ui/components/form";
+import { Label, Select, TextArea } from "@calcom/ui/components/form";
 import { Icon } from "@calcom/ui/components/icon";
 
 interface InternalNotePresetsSelectProps {
@@ -77,8 +76,6 @@ type Props = {
     title?: string;
     uid?: string;
     id?: number;
-    userEmail?: string;
-    attendees?: { email: string }[];
   };
   profile: {
     name: string | null;
@@ -121,9 +118,6 @@ export default function CancelBooking(props: Props) {
   const telemetry = useTelemetry();
   const [error, setError] = useState<string | null>(booking ? null : t("booking_already_cancelled"));
   const [internalNote, setInternalNote] = useState<{ id: number; name: string } | null>(null);
-  const [showVerificationDialog, setShowVerificationDialog] = useState<boolean>(false);
-  const [verificationEmail, setVerificationEmail] = useState<string>("");
-  const [verificationError, setVerificationError] = useState<string>("");
 
   const cancelBookingRef = useCallback((node: HTMLTextAreaElement) => {
     if (node !== null) {
@@ -134,74 +128,6 @@ export default function CancelBooking(props: Props) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  const handleCancellation = async () => {
-    setLoading(true);
-
-    telemetry.event(telemetryEventTypes.bookingCancelled, collectPageParameters());
-
-    const res = await fetch("/api/cancel", {
-      body: JSON.stringify({
-        uid: booking?.uid,
-        cancellationReason: cancellationReason,
-        allRemainingBookings,
-        // @NOTE: very important this shouldn't cancel with number ID use uid instead
-        seatReferenceUid,
-        cancelledBy: currentUserEmail,
-        internalNote: internalNote,
-      }),
-      headers: {
-        "Content-Type": "application/json",
-      },
-      method: "POST",
-    });
-
-    const bookingWithCancellationReason = {
-      ...(bookingCancelledEventProps.booking as object),
-      cancellationReason,
-    } as unknown;
-
-    if (res.status >= 200 && res.status < 300) {
-      // tested by apps/web/playwright/booking-pages.e2e.ts
-      sdkActionManager?.fire("bookingCancelled", {
-        ...bookingCancelledEventProps,
-        booking: bookingWithCancellationReason,
-      });
-      refreshData();
-    } else {
-      setLoading(false);
-      setError(`${t("error_with_status_code_occured", { status: res.status })} ${t("please_try_again")}`);
-    }
-  };
-
-  const verifyAndCancel = () => {
-    if (!currentUserEmail) {
-      setShowVerificationDialog(true);
-      return;
-    }
-
-    handleCancellation();
-  };
-
-  const handleVerification = () => {
-    setVerificationError("");
-    if (!verificationEmail) {
-      setVerificationError(t("email_required"));
-      return;
-    }
-
-    if (
-      booking.attendees?.some(
-        (attendee) => attendee.email.toLowerCase() === verificationEmail.toLowerCase()
-      ) ||
-      verificationEmail.toLowerCase() === booking?.userEmail?.toLowerCase()
-    ) {
-      setShowVerificationDialog(false);
-      handleCancellation();
-    } else {
-      setVerificationError(t("proceed_with_cancellation_error"));
-    }
-  };
-
   return (
     <>
       {error && (
@@ -256,7 +182,7 @@ export default function CancelBooking(props: Props) {
           {props.isHost ? (
             <div className="-mt-2 mb-4 flex items-center gap-2">
               <Icon name="info" className="text-subtle h-4 w-4" />
-              <p className="text-subtle text-sm leading-none">
+              <p className="text-default text-subtle text-sm leading-none">
                 {t("notify_attendee_cancellation_reason_warning")}
               </p>
             </div>
@@ -275,7 +201,48 @@ export default function CancelBooking(props: Props) {
                   props.isHost &&
                   (!cancellationReason?.trim() || (props.internalNotePresets.length > 0 && !internalNote?.id))
                 }
-                onClick={verifyAndCancel}
+                onClick={async () => {
+                  setLoading(true);
+
+                  telemetry.event(telemetryEventTypes.bookingCancelled, collectPageParameters());
+
+                  const res = await fetch("/api/cancel", {
+                    body: JSON.stringify({
+                      uid: booking?.uid,
+                      cancellationReason: cancellationReason,
+                      allRemainingBookings,
+                      // @NOTE: very important this shouldn't cancel with number ID use uid instead
+                      seatReferenceUid,
+                      cancelledBy: currentUserEmail,
+                      internalNote: internalNote,
+                    }),
+                    headers: {
+                      "Content-Type": "application/json",
+                    },
+                    method: "POST",
+                  });
+
+                  const bookingWithCancellationReason = {
+                    ...(bookingCancelledEventProps.booking as object),
+                    cancellationReason,
+                  } as unknown;
+
+                  if (res.status >= 200 && res.status < 300) {
+                    // tested by apps/web/playwright/booking-pages.e2e.ts
+                    sdkActionManager?.fire("bookingCancelled", {
+                      ...bookingCancelledEventProps,
+                      booking: bookingWithCancellationReason,
+                    });
+                    refreshData();
+                  } else {
+                    setLoading(false);
+                    setError(
+                      `${t("error_with_status_code_occured", { status: res.status })} ${t(
+                        "please_try_again"
+                      )}`
+                    );
+                  }
+                }}
                 loading={loading}>
                 {props.allRemainingBookings ? t("cancel_all_remaining") : t("cancel_event")}
               </Button>
@@ -283,34 +250,6 @@ export default function CancelBooking(props: Props) {
           </div>
         </div>
       )}
-      <Dialog open={showVerificationDialog} onOpenChange={setShowVerificationDialog}>
-        <DialogContent>
-          <DialogHeader title={t("verify_email")} />
-          <div className="space-y-4 py-4">
-            <p className="text-default text-sm">{t("proceed_with_cancellation_description")}</p>
-            <Input
-              type="email"
-              placeholder={t("email_placeholder")}
-              value={verificationEmail}
-              onChange={(e) => setVerificationEmail(e.target.value)}
-              className="mb-2"
-            />
-            {verificationError && <p className="text-error text-sm">{verificationError}</p>}
-            <div className="flex justify-end space-x-2">
-              <Button
-                color="secondary"
-                onClick={() => {
-                  setShowVerificationDialog(false);
-                  setVerificationError("");
-                  setVerificationEmail("");
-                }}>
-                {t("cancel")}
-              </Button>
-              <Button onClick={handleVerification}>{t("verify")}</Button>
-            </div>
-          </div>
-        </DialogContent>
-      </Dialog>
     </>
   );
 }

apps/web/modules/bookings/views/bookings-single-view.tsx

@@ -185,6 +185,7 @@ export default function Success(props: PageProps) {
     searchParams?.get("cancelledBy") ??
     session?.user?.email ??
     undefined;
+
   const defaultRating = isNaN(parsedRating) ? 3 : parsedRating > 5 ? 5 : parsedRating < 1 ? 1 : parsedRating;
   const [rateValue, setRateValue] = useState<number>(defaultRating);
   const [isFeedbackSubmitted, setIsFeedbackSubmitted] = useState(false);
@@ -858,8 +859,6 @@ export default function Success(props: PageProps) {
                               uid: bookingInfo?.uid,
                               title: bookingInfo?.title,
                               id: bookingInfo?.id,
-                              attendees: bookingInfo?.attendees,
-                              userEmail: bookingInfo?.user?.email as string,
                             }}
                             profile={{ name: props.profile.name, slug: props.profile.slug }}
                             recurringEvent={eventType.recurringEvent}

packages/lib/server/locales/en/common.json

@@ -2500,9 +2500,6 @@
   "extensive_whitelabeling": "Extensive Whitelabeling",
   "extensive_whitelabeling_description": "Customize your scheduling experience with your own logo, colors, and more",
   "unlimited_teams": "Unlimited Teams",
-  "verify_email": "Verify email",
-  "proceed_with_cancellation_description" : "Please enter the email address used for this booking to proceed with cancellation",
-  "proceed_with_cancellation_error" : "Email doesn't match the booking email",
   "unlimited_teams_description": "Add as many subteams as you need to your organization",
   "unified_billing": "Unified Billing",
   "advanced_managed_events": "Advanced Managed Event Types",