Plugin

High level overview

This plugin was made because SendGrid started requiring verified senders in April 2020 in order to send any messages at all, which made the setup flow much more complex.

Demo

See this page for a demo of the email functionality. The workflows related to sender verification are run on page load, and their results can be seen by opening the browser console.

Editor: https://bubble.io/page?type=page&name=sendgrid2&id=chris-sandbox&tab=tabs-1

Run mode (username: username password: password) https://chris-sandbox.bubbleapps.io/version-test/sendgrid2?debug_mode=true

Instructions

Follow these steps to set up the plugin:

1. Add the plugin to your app (as of November 3 2020 it is private, but should be public within a week or two).

2. Add your Sendgrid API key to the Sendgrid plugin settings. It should look like this:

If you are using the same API key for both development and production you only need to add the API key to the Production field

3. Set up a verified sender (using the plugin actions described below) Learn more about Sender Verification here.

4. Send emails!

If you need to create any actions in the API connector to supplement the actions below, you can use this plugin version's calls as a template: https://bubble.io/plugin_editor?id=1590598131000x245116675862298620&version=1.7.0&tab=tabs-3

Specific API calls

The following calls are included in the plugin:

1. Send email actions

   1. Send basic email

      1. Use AirDev's default HTML template to send an email. Includes optional fields like a button, a logo, and a signature. A plaintext fallback email will be sent alongside the original, mostly to improve the spam score (but also for recipients that reject HTML emails for security reasons).

   2. Send custom email

      1. Allows users to define the entire HTML body of the email. Other fields like to, cc, attachments, and subject are defined via the plugin action (not included in the HTML body). A plaintext fallback email will NOT be sent alongside the original. If desired, the plaintext fallback can be added to this action.

   3. Send email (legacy)

      1. For when a user wants to include the whole JSON body that will be sent to SendGrid. This mimics the approach previously used by our Canvas apps in the API Connector

2. Sender verification actions

   1. Get all verified sender emails

      1. Return a text list of all emails of verified senders. NOTE: this includes emails that have begun the verification process but have not completed it. Use the "Get verified sender request ID" action to check if a user has verified their email.

   2. Get verified sender request ID

      1. Input an email and return the request ID for that specific email. Also returns a "verified" yes/no value to show whether that email has been verified with sendgrid.

   3. Send verified sender request

      1. Send a verified sender request to one email. They will receive an email at this address, and in order to verify it with sendgrid, they must open that email in a browser where they are logged in to the specific sendgrid account that is used for this application. (In other words, if the user is logged into a different sendgrid account than the one used for the API keys for this app, this will not work.)

   4. Resend verified sender request

      1. If a user reports that they cannot access their sendgrid request, or the time period passed in which they needed to verify their email, you can resend the verified sender request. The input parameter is NOT the user's email address: it is the verified sender request ID, which must be gotten from the "Get verified sender request ID" action.

3. Other actions

   1. Get mail settings

      1. Used to check whether a user has their API key properly set up. If it's set up correctly, this call should return "success" as "yes".

Be sure to set up error handling for the send email actions. Since backend workflow error handling is not possible on Bubble (as of March 2021), the workflow will not throw a workflow error, but instead has a response "error" text field that will contain an error message and a response "success" yes/no field that tells whether the workflow was successful.

Above: Example of visual/front-end error handling. Consider sending an email to admins or creating an "Error" data type to record failed send email workflows.