From 9111e18e35e01da67c0c730129d548ee8dc42539 Mon Sep 17 00:00:00 2001
From: Amine Ben hammou <amine@mailpoet.com>
Date: Thu, 9 Apr 2020 05:25:13 +0200
Subject: [PATCH] Add sending method field

[MAILPOET-2693]
---
 assets/js/src/settings/pages/index.tsx        |  2 +-
 .../send_with/other/other_sending_methods.tsx | 10 ++++++
 .../pages/send_with/other/sending_method.tsx  | 35 +++++++++++++++++++
 .../pages/send_with/other_sending_methods.tsx |  7 ----
 4 files changed, 46 insertions(+), 8 deletions(-)
 create mode 100644 assets/js/src/settings/pages/send_with/other/other_sending_methods.tsx
 create mode 100644 assets/js/src/settings/pages/send_with/other/sending_method.tsx
 delete mode 100644 assets/js/src/settings/pages/send_with/other_sending_methods.tsx

diff --git a/assets/js/src/settings/pages/index.tsx b/assets/js/src/settings/pages/index.tsx
index d63b4ffe9b..837c599dbf 100644
--- a/assets/js/src/settings/pages/index.tsx
+++ b/assets/js/src/settings/pages/index.tsx
@@ -2,6 +2,6 @@ export { default as Basics } from './basics/basics';
 export { default as Advanced } from './advanced/advanced';
 export { default as KeyActivation } from './key_activation/key_activation';
 export { default as SendWith } from './send_with/send_with';
-export { default as OtherSendingMethods } from './send_with/other_sending_methods';
+export { default as OtherSendingMethods } from './send_with/other/other_sending_methods';
 export { default as SignupConfirmation } from './signup_confirmation/signup_confirmation';
 export { default as WooCommerce } from './woo_commerce/woo_commerce';
diff --git a/assets/js/src/settings/pages/send_with/other/other_sending_methods.tsx b/assets/js/src/settings/pages/send_with/other/other_sending_methods.tsx
new file mode 100644
index 0000000000..5b91bc18b8
--- /dev/null
+++ b/assets/js/src/settings/pages/send_with/other/other_sending_methods.tsx
@@ -0,0 +1,10 @@
+import React from 'react';
+import SendingMethod from './sending_method';
+
+export default function OtherSendingMethods() {
+  return (
+    <div className="mailpoet-settings-grid">
+      <SendingMethod />
+    </div>
+  );
+}
diff --git a/assets/js/src/settings/pages/send_with/other/sending_method.tsx b/assets/js/src/settings/pages/send_with/other/sending_method.tsx
new file mode 100644
index 0000000000..23b2fd6d0e
--- /dev/null
+++ b/assets/js/src/settings/pages/send_with/other/sending_method.tsx
@@ -0,0 +1,35 @@
+import React from 'react';
+import { Label, Inputs } from 'settings/components';
+import { t, onChange } from 'common/functions';
+import { useSetting } from 'settings/store/hooks';
+
+export default function SendingMethod() {
+  const [provider, setProvider] = useSetting('smtp_provider');
+  const [, setMethod] = useSetting('mta', 'method');
+  const updateProvider = (value: 'server' | 'manual' | 'AmazonSES' | 'SendGrid') => {
+    setProvider(value);
+    switch (value) {
+      case 'server': setMethod('PHPMail'); break;
+      case 'manual': setMethod('SMTP'); break;
+      case 'AmazonSES': setMethod('AmazonSES'); break;
+      case 'SendGrid': setMethod('AmazonSES'); break;
+      default:
+    }
+  };
+
+  return (
+    <>
+      <Label title={t('method')} htmlFor="mailpoet_smtp_method" />
+      <Inputs>
+        <select id="mailpoet_smtp_method" value={provider} onChange={onChange(updateProvider)}>
+          <option value="server">{t('hostOption')}</option>
+          <option value="manual">{t('smtpOption')}</option>
+          <optgroup label={t('selectProvider')}>
+            <option value="AmazonSES">Amazon SES</option>
+            <option value="SendGrid">SendGrid</option>
+          </optgroup>
+        </select>
+      </Inputs>
+    </>
+  );
+}
diff --git a/assets/js/src/settings/pages/send_with/other_sending_methods.tsx b/assets/js/src/settings/pages/send_with/other_sending_methods.tsx
deleted file mode 100644
index 9e3d9382d1..0000000000
--- a/assets/js/src/settings/pages/send_with/other_sending_methods.tsx
+++ /dev/null
@@ -1,7 +0,0 @@
-import React from 'react';
-
-export default function OtherSendingMethods() {
-  return (
-    <div className="mailpoet-settings-grid">Sending methods form</div>
-  );
-}