Skip to content
Snippets Groups Projects
Commit 9ed1a70c authored by Sebastian Mihalache's avatar Sebastian Mihalache
Browse files

fix(email-templating): update readme lists

parent 6c16333b
No related branches found
No related tags found
2 merge requests!58Sprint #20 - Goal - Reviewers submit report,!56Hin 975 publish email templating
# Email Template # Email Templating
## About ## About
The `email-template` component contains an `Email` class with two instance methods: `getBody` for retrieving the email body (html and text) and `sendEmail` for sending the email using the `send-email` component from PubSweet. The `email-templating` component contains an `Email` class with two main instance methods: `getNotificationBody` for retrieving the email body (html and text) and `sendEmail` for sending the email using the `send-email` component from PubSweet.
1. `getBody({ body = {}, isReviewerInvitation = false })`: 1. `getNotificationBody({ emailBodyProps = {} )` accepts one parameter object with should contain the following properties:
* accepts two parameters: * `paragraph`: the main text part of the email body which informs the recipient
* the `body` object, which for simple notifications should have only two properties: `paragraph` and `hasLink` * `hasLink`: a boolean which indicates if the email body contains a CTA (big button) or not
* the `isReviewerInvitation` boolean to indicate wether or not you need to send a Reviewer Invitation, which uses a more complex template * `hasIntro`: a boolean which indicates if the email body contains the "Dear Dr. John" introduction or not.
* returns the HTML and text parts of the email which can then be used to send it * `hasSignature`: a boolean which indicates if the email body contains a typical "Kind regards," signature or not
This function returns the HTML and text parts of the email which can then be used to send it.
1. `sendEmail({ text, html })`: 1. `sendEmail({ text, html })`:
* accepts the text and HTML parts of an email and then uses the `send-email` component from PubSweet to actually send the email. * accepts the text and HTML parts of an email and then uses the `send-email` component from PubSweet to actually send the email.
The `Email` class also provides a `constructor` whose properties will be used when sending the email: The `Email` class also provides a `constructor` whose properties will be used when sending the email:
1. `type`: a String that can be either `user` or `system` which can be used in the unsubscribe process 1. `type`: a String that can be either `user` or `system` which can be used in the unsubscribe process
2. `fromEmail`: a String indicating the from name and from email address: `Coko <team@coko.foundation>`
1. `toUser`: an Object with two properties: `email` and `name`. The `name` property will be used when addressing the recipient in the email content - for example: "Dear Dr. Rachel Smith". 1. `toUser`: an Object with two properties: `email` and `name`. The `name` property will be used when addressing the recipient in the email content - for example: "Dear Dr. Rachel Smith".
1. `content`: an Object which contains data about the email: 1. `content`: an Object which contains properties about the email:
1. `subject` 1. `subject`
1. `signatureName` 1. `signatureName` - the name which will appear in the signature
1. `ctaLink` - the URL which will be placed in the button 1. `ctaLink` - the URL which will be placed in the button
1. `ctaText` - the text which appears on the button 1. `ctaText` - the text which appears on the button
1. `unsubscribeLink` 1. `unsubscribeLink`
2. `signatureJournal` - the journal or company name which will appear in the signature
## Usage ## Usage
1. **Notifications** 1. **Config**
These are the most basic emails, which contain at least a piece of text, called a `Paragraph` and may or may not contain an `Action Button`. The `paragraph` and `hasLink` are passed to the `getBody()` function as properties of the `body` parameter.
In order to use this component, you need the to add the following data in your main config file:
```javascript
journal: {
name: 'Coko Foundation',
staffEmail: 'Coko <team@coko.foundation>',
logo: 'https://coko.foundation/wp-content/uploads/2017/11/logo-coko.png',
ctaColor: '#EE2B77', // the color of the email button
logoLink: 'https://coko.foundation/',
publisher: 'Coko Foundation', // this will appear in the email footer
privacy: '', // a text containing information about the privacy policy that will appear in the email footer
address: '2973 16th St., Suite 300, San Francisco, CA 94103', // the address in the footer
},
```
1. **Dependencies**
* [Pubsweet's Send Email](https://www.npmjs.com/package/@pubsweet/component-send-email)
* [Configure your Node.js Applications](https://www.npmjs.com/package/config)
* [Handlebars.js](https://www.npmjs.com/package/handlebars)
2. **Notifications**
These are the most basic emails, which contain at least a piece of text, called a paragraph, and may or may not contain an intro, an action button and a signature.
![notification](https://gitlab.coko.foundation/xpub/xpub-faraday/uploads/27cb6acc8ff4a07758f55e5ea0504d28/notification.png) ![notification](https://gitlab.coko.foundation/xpub/xpub-faraday/uploads/27cb6acc8ff4a07758f55e5ea0504d28/notification.png)
```javascript ```javascript
const emailTemplate = require('@pubsweet/component-email-template') const emailTemplate = require('@pubsweet/component-email-template')
const config = require('config')
const { name: journalName, fromEmail: staffEmail } = config.get('journal')
const sendNotifications = ({ user, editor, collection, fragment }) => { const sendNotifications = ({ user, editor, collection, fragment }) => {
const email = new emailTemplate({ const email = new emailTemplate({
type: 'user', type: 'user',
fromEmail,
toUser: { toUser: {
email: user.email, email: user.email,
name: `${user.firstName} ${user.lastName}`, name: `${user.lastName}`,
}, },
content: { content: {
subject: `${collection.customId}: Manuscript Update`, ctaText: 'MANUSCRIPT DETAILS',
signatureJournal: journalName,
signatureName: `${editor.name}`, signatureName: `${editor.name}`,
subject: `${collection.customId}: Manuscript Update`,
unsubscribeLink: `http://localhost:3000/unsubscribe/${user.id}`,
ctaLink: `http://localhost:3000/projects/${collection.id}/versions/${ ctaLink: `http://localhost:3000/projects/${collection.id}/versions/${
fragment.id fragment.id
}/details`, }/details`,
ctaText: 'MANUSCRIPT DETAILS',
unsubscribeLink: `http://localhost:3000/unsubscribe/${user.id}`,
}, },
}) })
const paragraph = `We are please to inform you that the manuscript has passed the technical check process and is now submitted. Please click the link below to access the manuscript.` const paragraph = `We are please to inform you that the manuscript has passed the technical check process and is now submitted. Please click the link below to access the manuscript.`
const { html, text } = email.getBody({ paragraph, hasLink: true }) const { html, text } = email.getNotificationBody({ emailBodyProps: { paragraph, hasLink: true, hasIntro: true, hasSignature: true }})
email.sendEmail({ html, text }) email.sendEmail({ html, text })
} }
``` ```
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment