fix: Availability atom handleFormSubmit callbacks not triggering (calcom#23174)

* fix: form submit callbacks trigger

* added changelog

* fix: type-error

Author: ibex088

.changeset/rich-impalas-hug.md

@@ -0,0 +1,5 @@
+---
+"@calcom/atoms": minor
+---
+
+fix: Availability atom handleFormSubmit callbacks not triggering

packages/platform/atoms/availability/AvailabilitySettings.tsx

@@ -124,6 +124,7 @@ type AvailabilitySettingsProps = {
     isEventTypesFetching?: boolean;
     handleBulkEditDialogToggle: () => void;
   };
+  callbacksRef?: React.MutableRefObject<{ onSuccess?: () => void; onError?: (error: Error) => void }>;
 };
 
 const DeleteDialogButton = ({
@@ -306,6 +307,7 @@ export const AvailabilitySettings = forwardRef<AvailabilitySettingsFormRef, Avai
       bulkUpdateModalProps,
       allowSetToDefault = true,
       allowDelete = true,
+      callbacksRef,
     } = props;
     const [openSidebar, setOpenSidebar] = useState(false);
     const { t, i18n } = useLocale();
@@ -336,11 +338,9 @@ export const AvailabilitySettings = forwardRef<AvailabilitySettingsFormRef, Avai
 
     const saveButtonRef = useRef<HTMLButtonElement>(null);
 
-    const callbacksRef = useRef<{ onSuccess?: () => void; onError?: (error: Error) => void }>({});
-
     const handleFormSubmit = useCallback(
       (customCallbacks?: { onSuccess?: () => void; onError?: (error: Error) => void }) => {
-        if (customCallbacks) {
+        if (callbacksRef && customCallbacks) {
           callbacksRef.current = customCallbacks;
         }
 
@@ -350,14 +350,14 @@ export const AvailabilitySettings = forwardRef<AvailabilitySettingsFormRef, Avai
           form.handleSubmit(async (data) => {
             try {
               await handleSubmit(data);
-              callbacksRef.current?.onSuccess?.();
+              callbacksRef?.current?.onSuccess?.();
             } catch (error) {
-              callbacksRef.current?.onError?.(error as Error);
+              callbacksRef?.current?.onError?.(error as Error);
             }
           })();
         }
       },
-      [form, handleSubmit]
+      [form, handleSubmit, callbacksRef]
     );
 
     const validateForm = useCallback(async () => {

packages/platform/atoms/availability/wrappers/AvailabilitySettingsPlatformWrapper.tsx

@@ -39,7 +39,7 @@ export type AvailabilitySettingsPlatformWrapperProps = {
 };
 
 export const AvailabilitySettingsPlatformWrapper = forwardRef<
-AvailabilitySettingsFormRef,
+  AvailabilitySettingsFormRef,
   AvailabilitySettingsPlatformWrapperProps
 >(function AvailabilitySettingsPlatformWrapper(props, ref) {
   const {
@@ -202,6 +202,7 @@ AvailabilitySettingsFormRef,
         allowDelete={allowDelete}
         allowSetToDefault={allowSetToDefault}
         onFormStateChange={onFormStateChange}
+        callbacksRef={callbacksRef}
       />
     </AtomsWrapper>
   );