Merge pull request wevote#3751 from SailingSteve/steveWebAppOct6-5pm

Sending of emails running again in Cordova iOS
josephevans · Oct 9, 2023 · 8358d19 · 8358d19
2 parents 2a9e5f7 + a902372
commit 8358d19
Show file tree

Hide file tree

Showing 20 changed files with 216 additions and 168 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -136,7 +136,7 @@
     "react-phone-number-input": "^3.1.11",
     "react-player": "^2.9.0",
     "react-router-dom": "~5.2.0",
-    "react-share": "^4.4.0",
+    "react-share": "^4.4.1",
     "react-slick": "^0.28.1",
     "react-svg": "^14.1.9",
     "react-text-truncate": "^0.17.0",

diff --git a/src/js/common/components/Campaign/CampaignShareChunk.jsx b/src/js/common/components/Campaign/CampaignShareChunk.jsx
@@ -50,7 +50,7 @@ class CampaignShareChunk extends Component {
     renderLog('CampaignShareChunk');  // Set LOG_RENDER_EVENTS to log all renders
     const {
       campaignXNewsItemWeVoteId, campaignXWeVoteId, classes, darkButtonsOff,
-      privatePublicIntroductionsOff,
+      privatePublicIntroductionsOff, politicianName,
     } = this.props;
     return (
       <div>
@@ -98,12 +98,12 @@ class CampaignShareChunk extends Component {
             )}
             <CampaignSupportDesktopButtonWrapper className="u-show-desktop-tablet">
               <CampaignSupportDesktopButtonPanel>
-                <ShareByEmailButton campaignXNewsItemWeVoteId={campaignXNewsItemWeVoteId} campaignXWeVoteId={campaignXWeVoteId} />
+                <ShareByEmailButton campaignXNewsItemWeVoteId={campaignXNewsItemWeVoteId} campaignXWeVoteId={campaignXWeVoteId} politicianName={politicianName} />
               </CampaignSupportDesktopButtonPanel>
             </CampaignSupportDesktopButtonWrapper>
             <CampaignSupportMobileButtonWrapper className="u-show-mobile">
               <CampaignSupportMobileButtonPanel>
-                <ShareByEmailButton campaignXNewsItemWeVoteId={campaignXNewsItemWeVoteId} campaignXWeVoteId={campaignXWeVoteId} mobileMode />
+                <ShareByEmailButton campaignXNewsItemWeVoteId={campaignXNewsItemWeVoteId} campaignXWeVoteId={campaignXWeVoteId} politicianName={politicianName} mobileMode />
               </CampaignSupportMobileButtonPanel>
             </CampaignSupportMobileButtonWrapper>
             <CampaignSupportDesktopButtonWrapper className="u-show-desktop-tablet">
@@ -162,6 +162,7 @@ CampaignShareChunk.propTypes = {
   campaignXWeVoteId: PropTypes.string,
   classes: PropTypes.object,
   darkButtonsOff: PropTypes.bool,
+  politicianName: PropTypes.string,
   privatePublicIntroductionsOff: PropTypes.bool,
 };
 

diff --git a/src/js/common/components/CampaignShare/ShareByCopyLink.jsx b/src/js/common/components/CampaignShare/ShareByCopyLink.jsx
@@ -8,7 +8,6 @@ import CampaignSupporterActions from '../../actions/CampaignSupporterActions';
 import { renderLog } from '../../utils/logging';
 import AppObservableStore, { messageService } from '../../stores/AppObservableStore';
 import CampaignStore from '../../stores/CampaignStore';
-import { openSnackbar } from '../Widgets/SnackNotifier';
 import { generateSharingLink } from './shareButtonCommon';
 
 class ShareByCopyLink extends Component {
@@ -90,7 +89,7 @@ class ShareByCopyLink extends Component {
   copyLink () {
     // console.log('ShareByCopyLink copyLink');
     CampaignSupporterActions.shareButtonClicked(true);
-    openSnackbar({ message: 'Copied!' });
+    // openSnackbar({ message: 'Copied!' });
     this.setState({
       copyLinkCopied: true,
     });

diff --git a/src/js/common/components/CampaignShare/ShareByEmailButton.jsx b/src/js/common/components/CampaignShare/ShareByEmailButton.jsx
@@ -4,11 +4,11 @@ import React, { Component } from 'react';
 import { EmailShareButton } from 'react-share';
 import styled from 'styled-components';
 import CampaignSupporterActions from '../../actions/CampaignSupporterActions';
+import CampaignStore from '../../stores/CampaignStore';
 import { isAndroid } from '../../utils/cordovaUtils';
 import { isCordova } from '../../utils/isCordovaOrWebApp';
 import { renderLog } from '../../utils/logging';
 import politicianListToSentenceString from '../../utils/politicianListToSentenceString';
-import CampaignStore from '../../stores/CampaignStore';
 import { cordovaSocialSharingByEmail, generateQuoteForSharing, generateSharingLink } from './shareButtonCommon';
 
 class ShareByEmailButton extends Component {
@@ -81,27 +81,27 @@ class ShareByEmailButton extends Component {
     if (isCordova()) {
       console.log(`ShareByEmailButton window.location.href: ${window.location.href}`);
     }
-    const { darkButton, mobileMode } = this.props;
+    const { darkButton, mobileMode, politicianName } = this.props;
     const { campaignX, numberOfPoliticians, politicianListSentenceString } = this.state;
     const {
       campaign_title: campaignTitle,
     } = campaignX;
     let linkToBeShared = this.generateFullCampaignLink();
-    linkToBeShared = linkToBeShared.replace('https://file:/', 'https://campaigns.wevote.us/');  // Cordova
+    linkToBeShared = linkToBeShared.replace('https://file:/', 'https://campaigns.wevote.us/');  // Cordova, this must have once been exclusively in the Campaigns app???
+    linkToBeShared = linkToBeShared.replace('https://localhost/', 'https://wevote.us/');        // Cordova
     const quoteForSharing = generateQuoteForSharing(campaignTitle, numberOfPoliticians, politicianListSentenceString);
     // console.log('quoteForSharing:', quoteForSharing);
-    const quoteForSharingEncoded = encodeURI(quoteForSharing);
-    let subjectForSharing = `Vote for${politicianListSentenceString}`;
+    const pol = politicianListSentenceString && politicianListSentenceString.length ? politicianListSentenceString : politicianName;
+    let subjectForSharing = `Vote for ${pol}`;
     if (subjectForSharing) {
       subjectForSharing = subjectForSharing.trim();
     }
-    const subjectForSharingEncoded = encodeURI(subjectForSharing);
     // console.log('subjectForSharing:', subjectForSharing);
     return (
       <Wrapper>
         <div id="androidEmail"
-             onClick={() => isAndroid() &&
-               cordovaSocialSharingByEmail(subjectForSharingEncoded, quoteForSharingEncoded)}
+             onClick={() => (isCordova()) &&
+               cordovaSocialSharingByEmail(subjectForSharing, quoteForSharing, politicianName)}
         >
           <EmailShareButton
             className={mobileMode ? 'material_ui_button_mobile' : ''}
@@ -132,6 +132,7 @@ ShareByEmailButton.propTypes = {
   campaignXWeVoteId: PropTypes.string,
   darkButton: PropTypes.bool,
   mobileMode: PropTypes.bool,
+  politicianName: PropTypes.string,
 };
 
 const styles = () => ({

diff --git a/src/js/common/components/CampaignShare/shareButtonCommon.jsx b/src/js/common/components/CampaignShare/shareButtonCommon.jsx
@@ -1,4 +1,4 @@
-import { cordovaOpenSafariView } from '../../utils/cordovaUtils';
+import { cordovaOpenSafariView, isAndroid } from '../../utils/cordovaUtils';
 import { openSnackbar } from '../Widgets/SnackNotifier';
 
 export function androidFacebookClickHandler (linkToBeShared, quoteForSharingEncoded) {
@@ -78,20 +78,36 @@ function onEmailSendError (error) {
   }
 }
 
-export function cordovaSocialSharingByEmail (subject, messageBody, handleClose = null) {
+export function cordovaSocialSharingByEmail (subject, body, handleClose = null) {
   close = handleClose;
-  console.log('cordovaSocialSharingByEmail ', subject, messageBody);
+  console.log('cordovaSocialSharingByEmail ', subject, body);
   // window.plugins.socialsharing.canShareViaEmail((e) => {console.log("canShareViaEmail 1: " + e)}, (e) => {console.log("canShareViaEmail 2: " + e)});
   // const { plugins: { socialsharing: { shareViaEmail } } } = window;
-  const soc = window.plugins.socialsharing;
-  soc.shareViaEmail(
-    messageBody,               // can contain HTML tags, but support on Android is rather limited:  http://stackoverflow.com/questions/15136480/how-to-send-html-content-with-image-through-android-default-email-client
-    subject,
-    null,               // TO: must be null or an array
-    null,               // CC: must be null or an array
-    null,               // BCC: must be null or an array
-    null,               // FILES: can be null, a string, or an array
-    onEmailSendSuccess, // called when sharing worked, but also when the user cancelled sharing via email. On iOS, the callbacks' boolean result parameter is true when sharing worked, false if cancelled. On Android, this parameter is always true so it can't be used). See section "Notes about the successCallback" below.
-    onEmailSendError,   // called when sh*t hits the fan
-  );
+  if (isAndroid()) {
+    const soc = window.plugins.socialsharing;
+    soc.shareViaEmail(
+      body,               // can contain HTML tags, but support on Android is rather limited:  http://stackoverflow.com/questions/15136480/how-to-send-html-content-with-image-through-android-default-email-client
+      subject,
+      null,               // TO: must be null or an array
+      null,               // CC: must be null or an array
+      null,               // BCC: must be null or an array
+      null,               // FILES: can be null, a string, or an array
+      onEmailSendSuccess, // called when sharing worked, but also when the user cancelled sharing via email. On iOS, the callbacks' boolean result parameter is true when sharing worked, false if cancelled. On Android, this parameter is always true so it can't be used). See section "Notes about the successCallback" below.
+      onEmailSendError,   // called when sh*t hits the fan
+    );
+  } else {
+    const { cordova } = window;
+    /* eslint-disable key-spacing */
+    console.log('before open cordova.plugins.email.open ', subject);
+    cordova.plugins.email.open({
+      from:         'We Vote',          // sending email account (iOS only)
+      to:           '',                 // email addresses for TO field
+      cc:           [],                 // email addresses for CC field
+      bcc:          [],                 // email addresses for BCC field
+      attachments:  [],                 // file paths or base64 data streams
+      subject,                          // subject of the email
+      body,                             // email body
+      isHtml:       true,               // indicates if the body is HTML or plain text (primarily iOS)
+    }, handleClose);
+  }
 }
diff --git a/src/js/common/components/CampaignSupport/CampaignDetailsActionSideBox.jsx b/src/js/common/components/CampaignSupport/CampaignDetailsActionSideBox.jsx
@@ -188,7 +188,7 @@ class CampaignDetailsActionSideBox extends Component {
 
   render () {
     renderLog('CampaignDetailsActionSideBox');  // Set LOG_RENDER_EVENTS to log all renders
-    const { campaignSEOFriendlyPath, campaignXWeVoteId, classes, inDraftMode } = this.props;
+    const { campaignSEOFriendlyPath, campaignXWeVoteId, classes, inDraftMode, politicianName } = this.props;
     // console.log('CampaignDetailsActionSideBox render campaignXWeVoteId:', campaignXWeVoteId, ', campaignSEOFriendlyPath:', campaignSEOFriendlyPath);
     if (!campaignSEOFriendlyPath && !campaignXWeVoteId) {
       // console.log('CampaignDetailsActionSideBox render voter NOT found');
@@ -252,6 +252,7 @@ class CampaignDetailsActionSideBox extends Component {
                   <CampaignShareChunk
                     campaignSEOFriendlyPath={campaignSEOFriendlyPath}
                     campaignXWeVoteId={campaignXWeVoteId}
+                    politicianName={politicianName}
                     darkButtonsOff
                     privatePublicIntroductionsOff
                   />
@@ -316,6 +317,7 @@ class CampaignDetailsActionSideBox extends Component {
               <CampaignShareChunk
                 campaignSEOFriendlyPath={campaignSEOFriendlyPath}
                 campaignXWeVoteId={campaignXWeVoteId}
+                politicianName={politicianName}
                 darkButtonsOff
                 privatePublicIntroductionsOff
               />
@@ -333,6 +335,7 @@ CampaignDetailsActionSideBox.propTypes = {
   functionToUseToKeepHelping: PropTypes.func.isRequired,
   functionToUseWhenProfileComplete: PropTypes.func.isRequired,
   inDraftMode: PropTypes.bool,
+  politicianName: PropTypes.string,
 };
 
 const styles = (theme) => ({

diff --git a/src/js/common/components/Style/CampaignDetailsStyles.jsx b/src/js/common/components/Style/CampaignDetailsStyles.jsx
@@ -284,7 +284,7 @@ export const SupportButtonFooterWrapperAboveFooterButtons = styled('div')`
     if (isAndroid()) return '68px';
     return '88px';
   }};
-  display: block;
+  display: ${() => (isCordova() ? 'none' : 'block')};
 `;
 
 export const SupportButtonPanel = styled('div')`

diff --git a/src/js/common/pages/Campaign/CampaignDetailsPage.jsx b/src/js/common/pages/Campaign/CampaignDetailsPage.jsx
@@ -594,6 +594,7 @@ class CampaignDetailsPage extends Component {
                     finalElectionDateInPast={finalElectionDateInPast}
                     functionToUseToKeepHelping={this.functionToUseToKeepHelping}
                     functionToUseWhenProfileComplete={this.functionToUseWhenProfileComplete}
+                    politicianName={campaignTitle}
                   />
                 </Suspense>
               </ColumnOneThird>

diff --git a/src/js/common/pages/Campaign/CampaignNewsItemDetailsPage.jsx b/src/js/common/pages/Campaign/CampaignNewsItemDetailsPage.jsx
@@ -717,6 +717,7 @@ class CampaignNewsItemDetailsPage extends Component {
                     functionToUseToKeepHelping={this.functionToUseToKeepHelping}
                     functionToUseWhenProfileComplete={this.functionToUseWhenProfileComplete}
                     inDraftMode={inDraftMode}
+                    politicianName={campaignTitle}
                   />
                 </Suspense>
               </ColumnOneThird>

diff --git a/src/js/common/pages/CampaignSupport/CampaignSupportShare.jsx b/src/js/common/pages/CampaignSupport/CampaignSupportShare.jsx
@@ -299,12 +299,12 @@ class CampaignSupportShare extends Component {
                     )}
                     <CampaignSupportDesktopButtonWrapper className="u-show-desktop-tablet">
                       <CampaignSupportDesktopButtonPanel>
-                        <ShareByEmailButton campaignXWeVoteId={campaignXWeVoteId} />
+                        <ShareByEmailButton campaignXWeVoteId={campaignXWeVoteId} politicianName={campaignTitle} />
                       </CampaignSupportDesktopButtonPanel>
                     </CampaignSupportDesktopButtonWrapper>
                     <CampaignSupportMobileButtonWrapper className="u-show-mobile">
                       <CampaignSupportMobileButtonPanel>
-                        <ShareByEmailButton campaignXWeVoteId={campaignXWeVoteId} darkButton mobileMode />
+                        <ShareByEmailButton campaignXWeVoteId={campaignXWeVoteId} politicianName={campaignTitle} darkButton mobileMode />
                       </CampaignSupportMobileButtonPanel>
                     </CampaignSupportMobileButtonWrapper>
                     <CampaignSupportDesktopButtonWrapper className="u-show-desktop-tablet">
@@ -324,6 +324,7 @@ class CampaignSupportShare extends Component {
                   <CampaignShareChunk
                     campaignSEOFriendlyPath={campaignSEOFriendlyPath}
                     campaignXWeVoteId={campaignXWeVoteId}
+                    politicianName={campaignTitle}
                   />
                 </>
               )}