feat: added option to lock maxactivebookingsperbooker for managed events (#21892)

* added option to disable maxactivebookingsperbooker for managed events

* chore

* update

---------

Co-authored-by: Kartik Saini <41051387+kart1ka@users.noreply.github.com>
Co-authored-by: unknown <adhabal2002@gmail.com>
Co-authored-by: Anik Dhabal Babu <81948346+anikdhabal@users.noreply.github.com>

packages/features/eventtypes/components/tabs/limits/EventLimitsTab.tsx

@@ -389,6 +389,7 @@ export const EventLimitsTab = ({ eventType, customClassNames }: EventLimitsTabPr
   const onlyFirstAvailableSlotLocked = shouldLockDisableProps("onlyShowFirstAvailableSlot");
   const periodTypeLocked = shouldLockDisableProps("periodType");
   const offsetStartLockedProps = shouldLockDisableProps("offsetStart");
+  const maxActiveBookingsPerBookerLocked = shouldLockDisableProps("maxActiveBookingsPerBooker");
 
   const [offsetToggle, setOffsetToggle] = useState(formMethods.getValues("offsetStart") > 0);
   const [maxActiveBookingsPerBookerToggle, setMaxActiveBookingsPerBookerToggle] = useState(
@@ -687,7 +688,9 @@ export const EventLimitsTab = ({ eventType, customClassNames }: EventLimitsTabPr
           );
         }}
       />
-      <MaxActiveBookingsPerBookerController />
+      <MaxActiveBookingsPerBookerController
+        maxActiveBookingsPerBookerLocked={maxActiveBookingsPerBookerLocked}
+      />
       <Controller
         name="periodType"
         render={({ field: { onChange, value } }) => {

packages/features/eventtypes/components/tabs/limits/MaxActiveBookingsPerBookerController.tsx

@@ -7,7 +7,17 @@ import classNames from "@calcom/ui/classNames";
 import { SettingsToggle } from "@calcom/ui/components/form";
 import { TextField, CheckboxField } from "@calcom/ui/components/form";
 
-export default function MaxActiveBookingsPerBookerController() {
+type maxActiveBookingsPerBookerLockedProps = {
+  disabled: boolean;
+  LockedIcon: false | JSX.Element;
+  isLocked: boolean;
+};
+
+export default function MaxActiveBookingsPerBookerController({
+  maxActiveBookingsPerBookerLocked,
+}: {
+  maxActiveBookingsPerBookerLocked: maxActiveBookingsPerBookerLockedProps;
+}) {
   const { t } = useLocale();
   const formMethods = useFormContext<FormValues>();
 
@@ -19,6 +29,7 @@ export default function MaxActiveBookingsPerBookerController() {
   const maxActiveBookingPerBookerOfferReschedule = formMethods.watch(
     "maxActiveBookingPerBookerOfferReschedule"
   );
+
   return (
     <Controller
       name="maxActiveBookingsPerBooker"
@@ -27,7 +38,8 @@ export default function MaxActiveBookingsPerBookerController() {
         return (
           <SettingsToggle
             labelClassName={classNames("text-sm")}
-            disabled={isRecurringEvent}
+            {...maxActiveBookingsPerBookerLocked}
+            disabled={isRecurringEvent || maxActiveBookingsPerBookerLocked.disabled}
             tooltip={isRecurringEvent ? t("recurring_event_doesnt_support_booker_booking_limit") : ""}
             toggleSwitchAtTheEnd={true}
             switchContainerClassName={classNames(
@@ -51,6 +63,7 @@ export default function MaxActiveBookingsPerBookerController() {
                 required
                 type="number"
                 value={value ?? ""}
+                disabled={maxActiveBookingsPerBookerLocked.disabled}
                 onChange={(e) => {
                   onChange(e.target.value === "" ? null : parseInt(e.target.value, 10));
                 }}
@@ -64,6 +77,7 @@ export default function MaxActiveBookingsPerBookerController() {
                 checked={!!maxActiveBookingPerBookerOfferReschedule}
                 descriptionAsLabel
                 description={t("offer_to_reschedule_last_booking")}
+                disabled={maxActiveBookingsPerBookerLocked.disabled}
                 onChange={(e) => {
                   formMethods.setValue("maxActiveBookingPerBookerOfferReschedule", e.target.checked, {
                     shouldDirty: true,