feat(settings): Add notification settings functionality

Author: nur-alam

assets/core/ts/components/form.ts

@@ -375,7 +375,7 @@ export const form = (config: FormControlConfig & { id?: string } = {}) => {
       const isCheckbox = type === 'checkbox';
       const isFile = type === 'file';
 
-      const defaultValue = this.values[name] ?? (isCheckbox ? false : '');
+      const defaultValue = this.values[name] ?? (isCheckbox ? element?.checked ?? false : '');
 
       this.fields[name] = {
         name,

assets/src/js/frontend/dashboard/pages/settings.ts

@@ -77,6 +77,7 @@ const settings = () => {
     saveBillingInfoMutation: null as MutationState<TutorMutationResponse<string>> | null,
     saveWithdrawMethodMutation: null as MutationState<TutorMutationResponse<string>> | null,
     resetPasswordMutation: null as MutationState<TutorMutationResponse<string>> | null,
+    handleUpdateNotification: null as MutationState<unknown, unknown> | null,
 
     init() {
       if (!this.$el) {
@@ -91,6 +92,15 @@ const settings = () => {
       this.handleSaveWithdrawMethod = this.handleSaveWithdrawMethod.bind(this);
       this.handleResetPassword = this.handleResetPassword.bind(this);
 
+      this.handleUpdateNotification = this.query.useMutation(this.updateNotification, {
+        onSuccess: (data: TutorMutationResponse<string>) => {
+          this.toast.success(data?.message ?? __('Successfully updated profile', 'tutor'));
+        },
+        onError: (error: Error) => {
+          this.toast.error(convertToErrorMessage(error) || __('Failed to update profile', 'tutor'));
+        },
+      });
+
       this.fetchCountriesQuery = this.query.useQuery('fetch-countries', () => this.fetchCountries());
 
       this.uploadProfilePhotoMutation = this.query.useMutation(this.uploadProfilePhoto, {
@@ -151,6 +161,34 @@ const settings = () => {
       });
     },
 
+    async updateNotification(payload: Record<string, boolean>) {
+      // Transform boolean values to "on"/"off" strings and restructure keys
+      const transformedPayload = Object.keys(payload).reduce(
+        (formattedPayload, key) => {
+          const value = payload[key];
+          const stringValue = typeof value === 'boolean' ? (value ? 'on' : 'off') : value;
+
+          // Check if key contains double underscore
+          if (key.includes('__')) {
+            const [firstPart, secondPart] = key.split('__');
+            if (firstPart && secondPart) {
+              const transformedKey = `tutor_notification_preference[email][${firstPart}][${secondPart}]`;
+              formattedPayload[transformedKey] = stringValue;
+            }
+          } else {
+            const transformedKey = `tutor_notification_preference[${key}]`;
+            formattedPayload[transformedKey] = stringValue;
+          }
+
+          return formattedPayload;
+        },
+        {} as Record<string, string>,
+      );
+
+      console.log('noti', transformedPayload);
+      return wpAjaxInstance.post(endpoints.UPDATE_PROFILE_NOTIFICATION, transformedPayload).then((res) => res.data);
+    },
+
     async fetchCountries() {
       return await axios.get(`${tutorConfig.tutor_url}${endpoints.FETCH_COUNTRIES}`).then((res) => res.data);
     },

assets/src/js/v3/shared/utils/endpoints.ts

@@ -181,6 +181,7 @@ const endpoints = {
   SAVE_BILLING_INFO: 'tutor_save_billing_info',
   SAVE_WITHDRAW_METHOD: 'tutor_save_withdraw_account',
   RESET_PASSWORD: 'tutor_profile_password_reset',
+  UPDATE_PROFILE_NOTIFICATION: 'tutor_save_notification_preference'
 } as const;
 
 export default endpoints;