Add WYSIWYG editor to the Email Pesion tool

SumOfUs · Apr 12, 2018 · 74cf8f2 · 74cf8f2
1 parent ddd1382
commit 74cf8f2
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 11 deletions.
diff --git a/.flowconfig b/.flowconfig
@@ -2,6 +2,7 @@
 <PROJECT_ROOT>/node_modules/fbjs/.*
 <PROJECT_ROOT>/node_modules/eslint-plugin-jsx-a11y/.*
 <PROJECT_ROOT>/vendor/bundle/.*
+<PROJECT_ROOT>/node_modules/draft-js/.*
 
 [include]
 

diff --git a/app/javascript/components/EmailEditor/EmailEditor.js b/app/javascript/components/EmailEditor/EmailEditor.js
@@ -1,4 +1,4 @@
-// @flow
+// @flow weak
 import React, { Component } from 'react';
 import Input from '../SweetInput/SweetInput';
 import FormGroup from '../Form/FormGroup';
@@ -21,7 +21,6 @@ import './EmailEditor.scss';
 export type EmailProps = {
   subject: string,
   body: string,
-  emailBody: string,
 };
 
 type Props = {

diff --git a/app/views/plugins/email_pensions/_form.slim b/app/views/plugins/email_pensions/_form.slim
@@ -25,14 +25,22 @@
 
       = render 'plugins/shared/subject_editor', name: name, f: f, plugin: plugin
 
-      .form-group
-        = f.label(:email_body_header, t('plugins.email_tool.email_header'))
-        = f.text_area :email_body_header, class: 'form-control height-short'
+      .email-body-section
+        .form-group
+          = f.label(:email_body_header, t('plugins.email_tool.email_header'))
+          = f.text_area :email_body_header, class: 'wysiwyg form-control height-short'
 
-      .form-group
-        = f.label(:email_body, t('plugins.email_tool.email_body'))
-        = f.text_area :email_body, class: 'form-control height-large'
+        .form-group
+          = f.label(:email_body, t('plugins.email_tool.email_body'))
+          = f.text_area :email_body, class: 'wysiwyg form-control height-large'
 
-      .form-group
-        = f.label(:email_body_footer, t('plugins.email_tool.email_footer'))
-        = f.text_area :email_body_footer, class: 'form-control height-short'
+        .form-group
+          = f.label(:email_body_footer, t('plugins.email_tool.email_footer'))
+          = f.text_area :email_body_footer, class: 'wysiwyg form-control height-short'
+
+javascript:
+  $(function () {
+    $('.email-body-section .wysiwyg').each(function (index, el) {
+      $.publish("wysiwyg:setup", el.id);
+    });
+  });