Refactoring the control to be reusable

[MAILPOET-2676]

assets/js/src/common/controls/call_api.ts

@@ -0,0 +1,16 @@
+import MailPoet from 'mailpoet';
+
+export default async function ({ endpoint, action, data }) {
+  try {
+    const res = await MailPoet.Ajax.post({
+      api_version: (window as any).mailpoet_api_version,
+      endpoint,
+      action,
+      data,
+    });
+    return { success: true, res };
+  } catch (res) {
+    const error = res.errors.map((e) => e.message);
+    return { success: false, error };
+  }
+}

assets/js/src/settings/store/actions.ts

@@ -1,13 +1,21 @@
-import { Action, Settings } from './types';
+import { select } from '@wordpress/data';
+import { STORE_NAME } from '.';
+import { Action } from './types';
 
 export function setSetting(path: string[], value: any): Action {
   return { type: 'SET_SETTING', path, value };
 }
 
-export function* saveSettings(data: Settings) {
+export function* saveSettings() {
   yield { type: 'SAVE_STARTED' };
-  const error = yield { type: 'SEND_DATA_TO_API', data };
+  const data = select(STORE_NAME).getSettings();
-  if (error) {
+  const { success, error } = yield {
+    type: 'CALL_API',
+    endpoint: 'settings',
+    method: 'save',
+    data,
+  };
+  if (!success) {
     return { type: 'SAVE_FAILED', error };
   }
   yield { type: 'TRACK_SETTINGS_SAVED', data };

assets/js/src/settings/store/controls.ts

@@ -1,18 +1,4 @@
-import MailPoet from 'mailpoet';
+export { default as CALL_API } from 'common/controls/call_api';
-
-export async function SEND_DATA_TO_API({ data }) {
-  try {
-    await MailPoet.Ajax.post({
-      api_version: (window as any).mailpoet_api_version,
-      endpoint: 'settings',
-      action: 'set',
-      data,
-    });
-    return false;
-  } catch (res) {
-    return res.errors.map((e) => e.message);
-  }
-}
 
 export function TRACK_SETTINGS_SAVED({ data }) {
   // ...