@bigbinary/neeto-email-delivery-frontend 1.0.11 → 1.0.13

package/README.md

@@ -64,13 +64,18 @@ class ApplicationMailer < NeetoCommonsBackend::ApplicationMailer
   # ...
 end
 
-6. Include NeetoEmailDeliveryEngine::HasEmailIntegrations in the host's owner model
+6. Include NeetoEmailDeliveryEngine::HasEmailIntegrations in the host's owner model and override the `email_delivery_redirect_url` method
 
 ```diff
 class Form < ApplicationRecord
 # ...
 +  include NeetoEmailDeliveryEngine::HasEmailIntegrations
 # ...
+
+  def email_delivery_redirect_url
+    # "/admin/..."
+  end
+
 end
 ````
 
@@ -81,7 +86,58 @@ end
 NeetoEmailDeliveryEngine.owner_class = "Form"
 ```
 
-8. The following env variables need to be added to the host application.
+8. Override the `load_owner` private method by adding the following files.
+
+- app/overrides/controllers/neeto_email_delivery_engine/integrations/sparkpost_domains_controller_override.rb
+- app/overrides/controllers/neeto_email_delivery_engine/gmail_controller_override.rb
+- app/overrides/controllers/neeto_email_delivery_engine/outlook_controller_override.rb
+
+Example:
+
+```ruby
+NeetoEmailDeliveryEngine::Api::V1::GmailController.class_eval do
+
+  private
+    def load_owner
+      # @owner = current_user
+      # OR
+      # @owner = @organization.forms.find(params[:owner_id])
+    end
+end
+```
+
+9. Override the `send_disconnection_email` private method -
+
+- app/overrides/services/neeto_email_delivery_engine/gmail/send_email_service_override.rb
+- app/overrides/services/neeto_email_delivery_engine/outlook/send_email_service_override.rb
+
+Example:
+
+```ruby
+NeetoEmailDeliveryEngine::Gmail::SendEmailService.class_eval do
+
+  private
+
+    def send_disconnection_email
+      organization = @gmail_account.organization
+      # DisconnectionMailer
+      #   .with(organization_id: organization.id)
+      #   .send_email(user: @gmail_account.integrable, type: "gmail")
+      #   .deliver_later
+    end
+end
+```
+
+10. Add mailgun ingress config in application.rb
+
+```ruby
+config.action_mailbox.ingress = :mailgun
+```
+
+11. Add `:gmail` and `:outlook` to omniauth_providers in
+    config/initializers/extend_user_omniauth.rb.
+
+12. The following env variables need to be added to the host application.
 
 ```
 GOOGLE_OAUTH_CLIENT_ID
@@ -97,10 +153,25 @@ CONNECT_PUBLIC_KEY
 MAILGUN_INGRESS_SIGNING_KEY (needed for our custom logic to verify the Outlook account.)
 ```
 
-9. Ensure that the domain `<app-name>email.com` (production) and
-   `<app-name>email.net` (staging) is correctly setup in Mailgun to accept
-   incoming emails. Example: For NeetoForm it would be neetoformemail.com
-   (production) and neetoformemail.net (staging).
+13. In secrets.yml add
+
+```
+sparkpost:
+  sending_domains_key: <%= ENV['SPARKPOST_SENDING_DOMAINS_KEY'] %>
+  sending_domains_user_name: SMTP_Injection
+  sending_domains_address: smtp.sparkpostmail.com
+```
+
+14. Ensure that the domain `<app-name>email.com` (production) and
+    `<app-name>email.net` (staging) is correctly setup in Mailgun to accept
+    incoming emails. Example: For NeetoForm it would be neetoformemail.com
+    (production) and neetoformemail.net (staging).
+
+15. Add the following to ApplicationMailbox
+
+```ruby
+routing /neetoemaildelivery/i => "neeto_email_delivery_engine/inbound"
+```
 
 ### Frontend package
 

package/app/javascript/src/translations/en.json

@@ -20,6 +20,30 @@
       "shadowAccountMessage": "Looks like Outlook mailbox is not configured for your email address - {{email}}. Please configure your Outlook mailbox by logging in to your Outlook account and then try again.",
       "cancel": "Cancel"
     },
+    "smtp": {
+      "title": "SMTP",
+      "description": "Add your SMTP server details so that all emails are sent from your SMTP provider and not from Neeto.",
+      "connectSmtp": "Connect SMTP",
+      "smtpConfigured": "SMTP is configured for sending emails.",
+      "setup": {
+        "title": "Setup SMTP for outgoing emails",
+        "saveAndActivate": "Save & activate",
+        "note": "Note: Ensure that the SMTP credentials you provide have permission to send emails from the configured from email.",
+        "hostLabel": "SMTP host",
+        "portLabel": "SMTP port",
+        "usernameLabel": "Username",
+        "passwordLabel": "Password",
+        "emailLabel": "Email",
+        "encryptionLabel": "Encryption",
+        "noneLabel": "None",
+        "starttlsLabel": "StartTLS",
+        "sslLabel": "SSL",
+        "displayNameLabel": "Display name",
+        "disconnect": "Disconnect SMTP",
+        "requiredField": "{{field}} is required",
+        "emailInvalid": "Invalid email"
+      }
+    },
     "sparkpost": {
       "ownDomainConfigured": "Own domain is configured for sending emails.",
       "customDomain": "Custom domain",

package/dist/EmailDeliveryScreen.js

@@ -1,6 +1,8 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { useState } from 'react';
 import { isPresent, humanize } from '@bigbinary/neeto-cist';
 import { useQueryParams } from '@bigbinary/neeto-commons-frontend/react-utils';
-import { showThumbsUpToastr, buildUrl } from '@bigbinary/neeto-commons-frontend/utils';
+import { buildUrl } from '@bigbinary/neeto-commons-frontend/utils';
 import MailSend from '@bigbinary/neeto-icons/MailSend';
 import GmailIcon from '@bigbinary/neeto-icons/misc/Gmail';
 import OutlookIcon from '@bigbinary/neeto-icons/misc/Outlook';
@@ -10,20 +12,162 @@ import Toastr from '@bigbinary/neetoui/Toastr';
 import { prop } from 'ramda';
 import { useTranslation } from 'react-i18next';
 import { useHistory } from 'react-router-dom';
-import { Q as QUERY_KEYS, f as GMAIL_OAUTH_CONNECT_URL, g as OUTLOOK_OAUTH_CONNECT_URL } from './useSparkpostApi-W7XibjIp.js';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState, useEffect } from 'react';
-import { useQueryClient } from '@tanstack/react-query';
-import { u as useFetchGmail, b as useDestroyGmail, a as useFetchOutlook, c as useDestroyOutlook } from './useOutlookIntegrationApi-ZgRWrUQN.js';
-import { i as invalidateAllIntegrationQueries, u as useSparkpostDomain } from './useSparkpostDomain-DDI4pHcZ.js';
+import { i as invalidateAllIntegrationQueries, f as GMAIL_OAUTH_CONNECT_URL, g as OUTLOOK_OAUTH_CONNECT_URL } from './useSparkpostApi-qpRhsK7H.js';
+import Pane from '@bigbinary/neetoui/Pane';
+import Typography from '@bigbinary/neetoui/Typography';
+import Form from '@bigbinary/neetoui/formik/Form';
+import Input from '@bigbinary/neetoui/formik/Input';
+import Radio from '@bigbinary/neetoui/formik/Radio';
+import ActionBlock from '@bigbinary/neetoui/formik/ActionBlock';
+import { c as useCreateSmtp, u as useFetchGmail, d as useDestroyGmail, a as useFetchOutlook, e as useDestroyOutlook, b as useFetchSmtp, f as useDestroySmtp } from './useOutlookIntegrationApi-b_mNVfRE.js';
 import { t } from 'i18next';
+import * as yup from 'yup';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useQueryClient } from '@tanstack/react-query';
+import { u as useSparkpostDomain } from './useSparkpostDomain-CuX-Gl5a.js';
 import Button from '@bigbinary/neetoui/Button';
 import Tag from '@bigbinary/neetoui/Tag';
-import Typography from '@bigbinary/neetoui/Typography';
-import { jsx, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'axios';
 
+var ENCRYPTION_OPTIONS = [{
+  label: "None",
+  value: "none"
+}, {
+  label: "StartTLS",
+  value: "starttls"
+}, {
+  label: "SSL",
+  value: "ssl"
+}];
+var SMTP_ACCOUNT_INITIAL_VALUES = {
+  host: "",
+  port: 587,
+  username: "",
+  password: "",
+  email: "",
+  encryption: "starttls",
+  display_name: ""
+};
+var SMTP_ACCOUNT_VALIDATION_SCHEMA = yup.object().shape({
+  host: yup.string().trim().required(t("neetoEmailDelivery.smtp.setup.requiredField", {
+    field: t("neetoEmailDelivery.smtp.setup.hostLabel")
+  })),
+  port: yup.number().required(t("neetoEmailDelivery.smtp.setup.requiredField", {
+    field: t("neetoEmailDelivery.smtp.setup.portLabel")
+  })),
+  username: yup.string().trim().required(t("neetoEmailDelivery.smtp.setup.requiredField", {
+    field: t("neetoEmailDelivery.smtp.setup.usernameLabel")
+  })),
+  password: yup.string().trim().required(t("neetoEmailDelivery.smtp.setup.requiredField", {
+    field: t("neetoEmailDelivery.smtp.setup.passwordLabel")
+  })),
+  email: yup.string().trim().required(t("neetoEmailDelivery.smtp.setup.requiredField", {
+    field: t("neetoEmailDelivery.smtp.setup.emailLabel")
+  })).email(t("neetoEmailDelivery.smtp.setup.emailInvalid")),
+  displayName: yup.string().trim().required(t("neetoEmailDelivery.smtp.setup.requiredField", {
+    field: t("neetoEmailDelivery.smtp.setup.displayNameLabel")
+  })),
+  encryption: yup.string().trim().required(t("neetoEmailDelivery.smtp.setup.requiredField", {
+    field: t("neetoEmailDelivery.smtp.setup.encryptionLabel")
+  }))
+});
+
+var SmtpSetup = function SmtpSetup(_ref) {
+  var ownerId = _ref.ownerId,
+    onDone = _ref.onDone,
+    onCancel = _ref.onCancel;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useCreateSmtp = useCreateSmtp({
+      ownerId: ownerId
+    }),
+    isCreating = _useCreateSmtp.isPending,
+    createSmtp = _useCreateSmtp.mutate;
+  var handleSubmit = function handleSubmit(values) {
+    createSmtp({
+      smtp_account: values
+    }, {
+      onSuccess: onDone
+    });
+  };
+  return /*#__PURE__*/jsxs(Pane, {
+    isOpen: true,
+    size: "lg",
+    onClose: onCancel,
+    children: [/*#__PURE__*/jsx(Pane.Header, {
+      children: /*#__PURE__*/jsx(Typography, {
+        style: "h2",
+        weight: "semibold",
+        children: t("neetoEmailDelivery.smtp.setup.title")
+      })
+    }), /*#__PURE__*/jsxs(Form, {
+      className: "w-full",
+      formikProps: {
+        initialValues: SMTP_ACCOUNT_INITIAL_VALUES,
+        validationSchema: SMTP_ACCOUNT_VALIDATION_SCHEMA,
+        onSubmit: handleSubmit
+      },
+      children: [/*#__PURE__*/jsx(Pane.Body, {
+        className: "space-y-4",
+        children: /*#__PURE__*/jsxs("div", {
+          className: "flex flex-col gap-6",
+          children: [/*#__PURE__*/jsx(Callout, {
+            style: "warning",
+            children: t("neetoEmailDelivery.smtp.setup.note")
+          }), /*#__PURE__*/jsx(Input, {
+            required: true,
+            label: t("neetoEmailDelivery.smtp.setup.hostLabel"),
+            name: "host"
+          }), /*#__PURE__*/jsx(Input, {
+            required: true,
+            label: t("neetoEmailDelivery.smtp.setup.portLabel"),
+            name: "port",
+            type: "number"
+          }), /*#__PURE__*/jsx(Input, {
+            required: true,
+            label: t("neetoEmailDelivery.smtp.setup.usernameLabel"),
+            name: "username"
+          }), /*#__PURE__*/jsx(Input, {
+            required: true,
+            label: t("neetoEmailDelivery.smtp.setup.passwordLabel"),
+            name: "password",
+            type: "password"
+          }), /*#__PURE__*/jsx(Input, {
+            required: true,
+            label: t("neetoEmailDelivery.smtp.setup.emailLabel"),
+            name: "email",
+            type: "email"
+          }), /*#__PURE__*/jsx(Input, {
+            required: true,
+            label: t("neetoEmailDelivery.smtp.setup.displayNameLabel"),
+            name: "displayName"
+          }), /*#__PURE__*/jsx(Radio, {
+            label: t("neetoEmailDelivery.smtp.setup.encryptionLabel"),
+            name: "encryption",
+            children: ENCRYPTION_OPTIONS.map(function (option) {
+              return /*#__PURE__*/jsx(Radio.Item, {
+                label: option.label,
+                value: option.value
+              }, option.value);
+            })
+          })]
+        })
+      }), /*#__PURE__*/jsx(Pane.Footer, {
+        children: /*#__PURE__*/jsx(ActionBlock, {
+          cancelButtonProps: {
+            onClick: onCancel
+          },
+          isSubmitting: isCreating,
+          submitButtonProps: {
+            label: t("neetoEmailDelivery.smtp.setup.saveAndActivate")
+          }
+        })
+      })]
+    })]
+  });
+};
+
 var useGmail = function useGmail(_ref) {
   var ownerId = _ref.ownerId,
     indexRoute = _ref.indexRoute,
@@ -39,8 +183,7 @@ var useGmail = function useGmail(_ref) {
     }),
     isLoading = _useFetchGmail.isLoading,
     _useFetchGmail$data = _useFetchGmail.data,
-    data = _useFetchGmail$data === void 0 ? {} : _useFetchGmail$data,
-    isGmailFetched = _useFetchGmail.isSuccess;
+    data = _useFetchGmail$data === void 0 ? {} : _useFetchGmail$data;
   var _useDestroyGmail = useDestroyGmail({
       ownerId: ownerId
     }),
@@ -52,25 +195,12 @@ var useGmail = function useGmail(_ref) {
   var onDisconnect = function onDisconnect() {
     destroyIntegration(false, {
       onSuccess: function onSuccess() {
-        showThumbsUpToastr();
         setIsDisconnectAlertOpen(false);
         invalidateAllIntegrationQueries(queryClient, ownerId);
         history.replace(indexRoute);
       }
     });
   };
-  useEffect(function () {
-    if (isGmailFetched) {
-      queryClient.invalidateQueries({
-        predicate: function predicate(query) {
-          var _query$queryKey = _slicedToArray(query.queryKey, 2),
-            key = _query$queryKey[0],
-            id = _query$queryKey[1];
-          return key === QUERY_KEYS.INTEGRATION_GMAIL && id !== ownerId;
-        }
-      });
-    }
-  }, [isGmailFetched, queryClient, ownerId]);
   return {
     data: data,
     isLoading: isLoading,
@@ -100,8 +230,7 @@ var useOutlook = function useOutlook(_ref) {
     }),
     isLoading = _useFetchOutlook.isLoading,
     _useFetchOutlook$data = _useFetchOutlook.data,
-    data = _useFetchOutlook$data === void 0 ? {} : _useFetchOutlook$data,
-    isOutlookFetched = _useFetchOutlook.isSuccess;
+    data = _useFetchOutlook$data === void 0 ? {} : _useFetchOutlook$data;
   var _useDestroyOutlook = useDestroyOutlook({
       ownerId: ownerId
     }),
@@ -113,25 +242,12 @@ var useOutlook = function useOutlook(_ref) {
   var onDisconnect = function onDisconnect() {
     destroyIntegration(false, {
       onSuccess: function onSuccess() {
-        showThumbsUpToastr();
         setIsDisconnectAlertOpen(false);
         invalidateAllIntegrationQueries(queryClient, ownerId);
         history.replace(indexRoute);
       }
     });
   };
-  useEffect(function () {
-    if (isOutlookFetched) {
-      queryClient.invalidateQueries({
-        predicate: function predicate(query) {
-          var _query$queryKey = _slicedToArray(query.queryKey, 2),
-            key = _query$queryKey[0],
-            id = _query$queryKey[1];
-          return key === QUERY_KEYS.INTEGRATION_OUTLOOK && id !== ownerId;
-        }
-      });
-    }
-  }, [isOutlookFetched, queryClient, ownerId]);
   return {
     data: data,
     isLoading: isLoading,
@@ -149,6 +265,30 @@ var useOutlook = function useOutlook(_ref) {
   };
 };
 
+var useSmtp = function useSmtp(_ref) {
+  var ownerId = _ref.ownerId,
+    canManageIntegrations = _ref.canManageIntegrations;
+  var _useFetchSmtp = useFetchSmtp(ownerId, {
+      enabled: canManageIntegrations
+    }),
+    isLoading = _useFetchSmtp.isLoading,
+    _useFetchSmtp$data = _useFetchSmtp.data,
+    data = _useFetchSmtp$data === void 0 ? {} : _useFetchSmtp$data;
+  var _useDestroySmtp = useDestroySmtp({
+      ownerId: ownerId
+    }),
+    isDestroying = _useDestroySmtp.isPending,
+    onDisconnect = _useDestroySmtp.mutate;
+  return {
+    data: data,
+    isConnected: data === null || data === void 0 ? void 0 : data.connected,
+    isLoading: isLoading,
+    isDestroying: isDestroying,
+    onDisconnect: onDisconnect,
+    exists: data === null || data === void 0 ? void 0 : data.exists
+  };
+};
+
 var ERROR_MESSAGES = {
   gmail_permission_not_given: t("neetoEmailDelivery.gmail.permissionNotGiven"),
   outlook_permission_not_given: t("neetoEmailDelivery.outlook.permissionNotGiven"),
@@ -228,6 +368,10 @@ var EmailDeliveryScreen = function EmailDeliveryScreen(_ref) {
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var history = useHistory();
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isSmtpPaneOpen = _useState2[0],
+    setIsSmtpPaneOpen = _useState2[1];
   var _useQueryParams = useQueryParams(),
     error = _useQueryParams.error,
     errorDescription = _useQueryParams.errorDescription;
@@ -254,6 +398,10 @@ var EmailDeliveryScreen = function EmailDeliveryScreen(_ref) {
     ownerId: ownerId,
     canManageIntegrations: canManageIntegrations
   });
+  var smtpIntegration = useSmtp({
+    ownerId: ownerId,
+    canManageIntegrations: canManageIntegrations
+  });
   var _gmailIntegration$dat = gmailIntegration.data,
     gmailData = _gmailIntegration$dat === void 0 ? {} : _gmailIntegration$dat,
     isGmailConnected = gmailIntegration.isConnected,
@@ -277,11 +425,19 @@ var EmailDeliveryScreen = function EmailDeliveryScreen(_ref) {
     onSparkpostDisconnect = sparkpostIntegration.onDisconnect,
     isSparkpostDisconnecting = sparkpostIntegration.isDestroying,
     isSparkpostExists = sparkpostIntegration.exists;
-  var isLoading = isGmailLoading || isOutlookLoading || isSparkpostLoading;
-  var noneExists = !isGmailExists && !isOutlookExists && !isSparkpostExists;
+  var _smtpIntegration$data = smtpIntegration.data,
+    smtpData = _smtpIntegration$data === void 0 ? {} : _smtpIntegration$data,
+    isSmtpConnected = smtpIntegration.isConnected,
+    isSmtpLoading = smtpIntegration.isLoading,
+    isSmtpDisconnecting = smtpIntegration.isDestroying,
+    onSmtpDisconnect = smtpIntegration.onDisconnect,
+    isSmtpExists = smtpIntegration.exists;
+  var isLoading = isGmailLoading || isOutlookLoading || isSparkpostLoading || isSmtpLoading;
+  var noneExists = !isGmailExists && !isOutlookExists && !isSparkpostExists && !isSmtpExists;
   var showGmail = noneExists || isGmailExists;
   var showOutlook = noneExists || isOutlookExists;
   var showSparkpost = noneExists || isSparkpostExists;
+  var showSmtp = noneExists || isSmtpExists;
   var handleGmailConnect = function handleGmailConnect() {
     window.location.href = buildUrl(GMAIL_OAUTH_CONNECT_URL, {
       ownerId: ownerId
@@ -295,9 +451,16 @@ var EmailDeliveryScreen = function EmailDeliveryScreen(_ref) {
   var handleOwnDomainConnect = function handleOwnDomainConnect() {
     history.push(ownDomainSetupRoute);
   };
+  var handleSmtpConnect = function handleSmtpConnect() {
+    setIsSmtpPaneOpen(true);
+  };
+  var handleSmtpPaneClose = function handleSmtpPaneClose() {
+    setIsSmtpPaneOpen(false);
+  };
   var gmailEmail = prop("email", gmailData);
   var outlookEmail = prop("email", outlookData);
   var sparkpostEmail = prop("email", sparkpostData);
+  var smtpEmail = prop("email", smtpData);
   var gmailTitle = t("neetoEmailDelivery.gmail.title");
   var gmailDescription = isGmailConnected ? t("neetoEmailDelivery.sparkpost.emailDelivery.connectedEmail", {
     email: gmailEmail
@@ -310,16 +473,20 @@ var EmailDeliveryScreen = function EmailDeliveryScreen(_ref) {
   var ownDomainDescription = isSparkpostConnected ? t("neetoEmailDelivery.sparkpost.emailDelivery.connectedEmail", {
     email: sparkpostEmail
   }) : t("neetoEmailDelivery.sparkpost.emailDelivery.ownDomainDescription");
+  var smtpTitle = t("neetoEmailDelivery.smtp.title");
+  var smtpDescription = isSmtpConnected ? t("neetoEmailDelivery.sparkpost.emailDelivery.connectedEmail", {
+    email: smtpEmail
+  }) : t("neetoEmailDelivery.smtp.description");
   if (isLoading) {
     return /*#__PURE__*/jsx("div", {
       className: "flex grow items-center justify-center w-full",
       children: /*#__PURE__*/jsx(Spinner, {})
     });
   }
-  var activeMessage = isGmailConnected && t("neetoEmailDelivery.gmail.gmailConfigured") || isOutlookConnected && t("neetoEmailDelivery.outlook.outlookConfigured") || isSparkpostConnected && t("neetoEmailDelivery.sparkpost.ownDomainConfigured");
-  return /*#__PURE__*/jsx("div", {
+  var activeMessage = isGmailConnected && t("neetoEmailDelivery.gmail.gmailConfigured") || isOutlookConnected && t("neetoEmailDelivery.outlook.outlookConfigured") || isSparkpostConnected && t("neetoEmailDelivery.sparkpost.ownDomainConfigured") || isSmtpConnected && t("neetoEmailDelivery.smtp.smtpConfigured");
+  return /*#__PURE__*/jsxs("div", {
     className: "min-h-0 w-full grow",
-    children: /*#__PURE__*/jsxs("div", {
+    children: [/*#__PURE__*/jsxs("div", {
       className: "@container mx-auto space-y-6",
       children: [/*#__PURE__*/jsxs("div", {
         className: "grid grid-cols-1 gap-3 py-1 @lg:grid-cols-2 @lg:gap-6 @3xl:grid-cols-3 @7xl:grid-cols-4",
@@ -351,6 +518,15 @@ var EmailDeliveryScreen = function EmailDeliveryScreen(_ref) {
           title: ownDomainTitle,
           onConnect: handleOwnDomainConnect,
           onDisconnect: onSparkpostDisconnect
+        }), showSmtp && /*#__PURE__*/jsx(IntegrationCard, {
+          connectButtonText: "neetoEmailDelivery.smtp.connectSmtp",
+          description: smtpDescription,
+          icon: MailSend,
+          isConnected: isSmtpConnected,
+          isDisconnecting: isSmtpDisconnecting,
+          title: smtpTitle,
+          onConnect: handleSmtpConnect,
+          onDisconnect: onSmtpDisconnect
         })]
       }), activeMessage && /*#__PURE__*/jsx(Callout, {
         style: "success",
@@ -366,7 +542,11 @@ var EmailDeliveryScreen = function EmailDeliveryScreen(_ref) {
           email: outlookEmail
         })
       })]
-    })
+    }), isSmtpPaneOpen && /*#__PURE__*/jsx(SmtpSetup, {
+      ownerId: ownerId,
+      onCancel: handleSmtpPaneClose,
+      onDone: handleSmtpPaneClose
+    })]
   });
 };