Leveraging the Firebase email trigger extension with JavaScript

Recently, I integrated the email trigger extension for Firebase. Below is the function I am using:

firestore
  .collection("profiledata")
  .doc(user.uid)
  .update({
    accountStatus: "active",
  })
  .then(() => {
    // At this point, I need to insert the Firebase code
    props.history.push("/clients");
  });

However, when I try to include the Firebase code like this:

firestore
  .collection("<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="096e606867657c6a684979606c7b7a66657c7d6066677a276a68">[email protected]</a>")
  .add({
    to: "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="91f2feffe5f0f2e5d1e1f8f4e3e2fefde4e5f8feffe2bff2f0">[email protected]</a>",
    message: {
      subject: "Hello from Firebase!",
      text: "This is the plaintext section of the email body.",
    },
  })
  .then(() => console.log("Queued email for delivery!"));

props.history.push("/clients");

In my IDE, it displays as shown in this image:

https://i.stack.imgur.com/y91eC.png

I'm facing issues while trying to input this code here! Any suggestions on how to resolve this?

javascriptfirebasegoogle-cloud-firestore

Answer №1

Exploring the steps outlined in this insightful piece, you can send emails using a Firebase extension by creating a document in the specified collection under the "Email documents collection" field.

https://i.stack.imgur.com/4WR3S.png

If the designated collection is labeled as mail, similar to the example provided above, follow these instructions:

firestore.collection("profiledata").doc(user.uid)
    .update({
        accountStatus: "active"
    })
    .then(() => {
        return firestore.collection('mail').add({
            to: ['<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="72011d1f171d1c1732170a13ɦ@hotmail.com</a>'],
            message: {
                subject: 'Hello from Firebase!',
                text: 'This is the plaintext section of the email body.',
                html: 'This is the <code>HTML</code> section of the email body.',
            }
        });
    })
    .then(() => {
     
        props.history.push('/clients')

    });

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

List of Nodes with five links

I'm encountering an issue when trying to reference the final node. The expected output is: Linked List with 5 nodes Node Value: Head Node / Next Node Value: Second Node / Last Node Value: null Node Value: Second Node / Next Node Value: Third N ...

javascriptnode.js

The button's onclick function is not triggering with just one click

I am having trouble with a JavaScript function not being called on the first click. I have to click the button multiple times for it to execute. Here are the methods I have attempted so far: <a href="javascript:delete_todo(4);void(0)"><img border ...

javascriptonclick

What sets apart "config" from "defaults" in Sencha Touch?

As a newcomer to Sencha Touch, I have one simple question that's been on my mind... Can someone explain the distinction between "config" and "defaults" in Sencha Touch? ...

javascriptextjslayouttouch

Utilizing React hooks to dynamically toggle a class within a component

While similar questions have been raised previously, none seem to address my specific issue. Most references involve class components that do not align exactly with what I am attempting to achieve. My goal is to toggle two components on and off with a simp ...

javascriptreactjsreact-hookstoggle

Cordova triggers a 500 (Internal Server Error) when making an Ajax request

When I send an ajax request, it works fine in the browser but returns an internal error when sent within a Cordova APK. Upon comparing the headers, I noticed that the only difference is in the ORIGIN: The one not working has origin: file:// POST 500 (In ...

javascriptandroidajaxcordova

Access SCSS variable values in Angular HTML or TypeScript files

So, I've been looking into whether it's feasible to utilize the SCSS variable value within HTML or TS in Angular. For instance: Let's say I have a variable called $mdBreakpoint: 992px; stored inside the _variable.scss file. In my HTML cod ...

javascriptcssangulartypescriptsass

"MongoDB's .find function functions properly in the shell environment, but encounters issues when

As a newcomer to Node Express Mongo, I decided to venture into creating my own website after following tutorials. The page I'm working on is a login page. While other people's code has worked for me, my attempt didn't go as planned. Even con ...

javascriptnode.jsmongodbexpress

Extract information from a JSON string and present it on the screen

I am a complete novice when it comes to D3 (with very little experience in JS). Here are the lines of code I am working with: <script type='text/javascript'> data ='{"mpg":21,"cyl":6,"disp":160,"hp":110,"drat":3.9,"wt":2.62,"qsec":16. ...

javascriptjsonrd3.js

A tool that enhances the visibility and readability of web languages such as HTML, PHP, and CSS

Looking to organize my own code examples, I need a way to display my code with syntax highlighting. Similar to how Symfony framework showcases it on their website: http://prntscr.com/bqrmzk. I'm wondering if there is a JavaScript framework that can a ...

javascriptphphtmlcssgenerator

Bring in d3 along with d3-force-attract

Recently, I have installed D3 along with d3-force-attract. npm install @types/d3 -S npm install -S d3-force-attract I am currently facing an issue with importing d3 force attract as it is not recognized as a typescript module, unlike d3 itself. The inco ...

javascripttypescriptd3.js

Can I programmatically retrieve a comprehensive list of all global HTML attributes available?

Exploring the extensive list of global HTML attributes can be overwhelming, especially when considering how it continues to evolve with browser updates. Can JavaScript be leveraged to dynamically generate a complete list of these attributes without the ne ...

javascripthtml

Exploring secure routes in Node.js with test cases using Mocha and Chai?

The function verifies whether the route is accessible or not function checkSessionCookieValidity(req, res, next) { if (!isValid(req.session)) { return res.status(401).json({ isLoggedIn: false }); } return next ...

javascriptnode.jsexpressmocha.jschai

Is it possible to apply the DRY Concept to this React JS code?

https://i.stack.imgur.com/jcEoA.png import React from "react"; import { Chip, Box } from '@mui/material'; const Browse = () => { const [chip, setChip] = React.useState("all" ...

javascriptreactjsmaterial-uiweb-deploymentdry

Exploring nested optgroup functionality in React.js

Within my code, I am utilizing a nested optgroup: <select> <optgroup label="A"> <optgroup label="B"> <option>C</option> <option>D</option> <option>G</option> </optg ...

javascriptreactjs

showing information on webpage 2 received via query parameters from webpage 1

Hello, I am trying to input text into a textarea and then send the data through a query string to another webpage. My goal is to display the data on the second webpage. I have written the following code, but it doesn't seem to be working. I've ch ...

javascripthtmljquerycssquery-string

What is causing my button to act in this way?

Initially, the website redirects to an undefined URL and then to test.com. I am looking for a way to implement a redirection sequence from to and finally to <head> <script type="text/javascript"> <!-- function popup(url ...

javascripthtmlfunctionpopup

Failed to retrieve the requested item using fetch, encountering a NetworkError

My API is being accessed to retrieve data using this code snippet. It sends the email and password to the API: onSubmitSignIn = () => { fetch('http://localhost:3001/signin', { method: 'post', headers: {'Content-Type&ap ...

javascriptnode.jsjsonfetch-api

Fixing 500 (Internal Server Error) in Vue.js and Laravel: The Ultimate Guide

Working on a university project using Vue.js and Laravel, I need assistance with sending information to the API. I'm trying to use axios for the POST request, but it's giving me an error: 500 (Internal Server Error). I can't seem to identif ...

javascriptphplaravelvue.js

React HTML ignore line break variable is a feature that allows developers to

Can you help me with adding a line break between two variables that will be displayed properly in my HTML output? I'm trying to create an object with a single description attribute using two text variables, and I need them to be separated by a line b ...

javascriptreactjs

Use jQuery to swap out two div classes within a table cell (TD) if they are

Although I'm making progress, I must confess that jQuery and CSS are not my strong suits. The objective: To create a dynamic div within a table data cell for a calendar feature. The content of the div varies based on the date range input. A filled d ...

javascriptjqueryhtmlcss