No tooltips in mobile or Cordova, for Jira issue 174

Resolves https://wevoteusa.atlassian.net/browse/WV-174 Removes sign in with Facebook from Cordova Android (temporary).
wevote · Dec 5, 2023 · b60c98e · b60c98e
1 parent 4968398
commit b60c98e
Show file tree

Hide file tree

Showing 24 changed files with 344 additions and 359 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/App.jsx b/src/App.jsx
@@ -12,7 +12,7 @@ import VoterSessionActions from './js/actions/VoterSessionActions';
 import muiTheme from './js/common/components/Style/muiTheme';
 import LoadingWheelComp from './js/common/components/Widgets/LoadingWheelComp';
 import AppObservableStore, { messageService } from './js/common/stores/AppObservableStore';
-import { getAndroidSize, getIOSSizeString, hasDynamicIsland, isIOS } from './js/common/utils/cordovaUtils';
+import { getAndroidSize, getIOSSizeString, hasDynamicIsland, isAndroid, isIOS } from './js/common/utils/cordovaUtils';
 import historyPush from './js/common/utils/historyPush';
 import { isWeVoteMarketingSite, normalizedHref } from './js/common/utils/hrefUtils';
 import initializejQuery from './js/common/utils/initializejQuery';
@@ -177,6 +177,9 @@ class App extends Component {
         }, 3000);
       }
     }
+    if (isAndroid()) {         // December 12, 2023: All sorts of problems with sign-in with Facebook on Android, so disabling it here
+      webAppConfig.ENABLE_FACEBOOK = false;   // This overrides the config setting for the entire Android app
+    }
     if (webAppConfig.ENABLE_FACEBOOK) {
       setTimeout(() => {
         // Suspect that this isn't correct anymore: "We need to start this initialization early since there is a delay getting the FB object in place"
@@ -705,7 +708,7 @@ const WeVoteBody = styled('div')`
   height: 100vw;
   position: relative;
   z-index: 0;
-  ${() => console.log('-----------------------------')}
+  // this debug technique works!  ${() => console.log('-----------------------------')}
 `;
 
 App.propTypes = {

diff --git a/src/js/common/components/Campaign/CampaignShareChunk.jsx b/src/js/common/components/Campaign/CampaignShareChunk.jsx
@@ -3,14 +3,14 @@ import withStyles from '@mui/styles/withStyles';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import styled from 'styled-components';
+import webAppConfig from '../../../config';
 import historyPush from '../../utils/historyPush';
 import { renderLog } from '../../utils/logging';
 import ShareByCopyLink from '../CampaignShare/ShareByCopyLink';
 import ShareByEmailButton from '../CampaignShare/ShareByEmailButton';
 import ShareOnFacebookButton from '../CampaignShare/ShareOnFacebookButton';
 import ShareOnTwitterButton from '../CampaignShare/ShareOnTwitterButton';
 import { CampaignSupportDesktopButtonPanel, CampaignSupportDesktopButtonWrapper, CampaignSupportMobileButtonPanel, CampaignSupportMobileButtonWrapper, CampaignSupportSection, CampaignSupportSectionWrapper } from '../Style/CampaignSupportStyles';
-import webAppConfig from '../../../config';
 
 const futureFeaturesDisabled = true;
 const nextReleaseFeaturesEnabled = webAppConfig.ENABLE_NEXT_RELEASE_FEATURES === undefined ? false : webAppConfig.ENABLE_NEXT_RELEASE_FEATURES;
@@ -130,16 +130,20 @@ class CampaignShareChunk extends Component {
                 </CampaignSupportDesktopButtonPanel>
               </CampaignSupportDesktopButtonWrapper>
             )}
-            <CampaignSupportDesktopButtonWrapper className="u-show-desktop-tablet">
-              <CampaignSupportDesktopButtonPanel>
-                <ShareOnFacebookButton campaignXNewsItemWeVoteId={campaignXNewsItemWeVoteId} campaignXWeVoteId={campaignXWeVoteId} darkButton={!darkButtonsOff} />
-              </CampaignSupportDesktopButtonPanel>
-            </CampaignSupportDesktopButtonWrapper>
-            <CampaignSupportMobileButtonWrapper className="u-show-mobile">
-              <CampaignSupportMobileButtonPanel>
-                <ShareOnFacebookButton campaignXNewsItemWeVoteId={campaignXNewsItemWeVoteId} campaignXWeVoteId={campaignXWeVoteId} mobileMode />
-              </CampaignSupportMobileButtonPanel>
-            </CampaignSupportMobileButtonWrapper>
+            {webAppConfig.ENABLE_FACEBOOK && (
+              <>
+                <CampaignSupportDesktopButtonWrapper className="u-show-desktop-tablet">
+                  <CampaignSupportDesktopButtonPanel>
+                    <ShareOnFacebookButton campaignXNewsItemWeVoteId={campaignXNewsItemWeVoteId} campaignXWeVoteId={campaignXWeVoteId} darkButton={!darkButtonsOff} />
+                  </CampaignSupportDesktopButtonPanel>
+                </CampaignSupportDesktopButtonWrapper>
+                <CampaignSupportMobileButtonWrapper className="u-show-mobile">
+                  <CampaignSupportMobileButtonPanel>
+                    <ShareOnFacebookButton campaignXNewsItemWeVoteId={campaignXNewsItemWeVoteId} campaignXWeVoteId={campaignXWeVoteId} mobileMode />
+                  </CampaignSupportMobileButtonPanel>
+                </CampaignSupportMobileButtonWrapper>
+              </>
+            )}
             <CampaignSupportDesktopButtonWrapper className="u-show-desktop-tablet">
               <CampaignSupportDesktopButtonPanel>
                 <ShareOnTwitterButton campaignXNewsItemWeVoteId={campaignXNewsItemWeVoteId} campaignXWeVoteId={campaignXWeVoteId} />

diff --git a/src/js/common/components/Donation/DonationList.jsx b/src/js/common/components/Donation/DonationList.jsx
@@ -7,6 +7,7 @@ import styled from 'styled-components';
 import VoterStore from '../../../stores/VoterStore';
 import DonateActions from '../../actions/DonateActions';
 import DonateStore from '../../stores/DonateStore';
+import isMobileScreenSize from '../../utils/isMobileScreenSize';
 import { renderLog } from '../../utils/logging';
 import DonationCancelOrRefund from './DonationCancelOrRefund';
 
@@ -178,7 +179,9 @@ class DonationList extends Component {
                   <StyledTableCellAll align="right">{`$${row.amount}`}</StyledTableCellAll>
                   <StyledTableCellTablet align="center">{row.lastCharged}</StyledTableCellTablet>
                   <StyledTableCellTablet align="center">
-                    <Tooltip title={row.subscriptionId || 'Toolman Taylor'} placement="right"><span>{row.brand}</span></Tooltip>
+                    {isMobileScreenSize() ? (<span />) : (
+                      <Tooltip title={row.subscriptionId || 'Toolman Taylor'} placement="right"><span>{row.brand}</span></Tooltip>
+                    )}
                   </StyledTableCellTablet>
                   <StyledTableCellDesktop align="center">{row.last4}</StyledTableCellDesktop>
                   <StyledTableCellDesktop align="center">{row.expires}</StyledTableCellDesktop>

diff --git a/src/js/common/components/SignIn/SignInOptionsPanel.jsx b/src/js/common/components/SignIn/SignInOptionsPanel.jsx
@@ -14,6 +14,7 @@ import VoterEmailAddressEntry from '../../../components/Settings/VoterEmailAddre
 import VoterPhoneVerificationEntry from '../../../components/Settings/VoterPhoneVerificationEntry';
 import TwitterSignIn from '../../../components/Twitter/TwitterSignIn';
 import BrowserPushMessage from '../../../components/Widgets/BrowserPushMessage';
+import webAppConfig from '../../../config';
 import FacebookStore from '../../../stores/FacebookStore';
 import VoterStore from '../../../stores/VoterStore';
 import initializeAppleSDK from '../../../utils/initializeAppleSDK';
@@ -285,7 +286,7 @@ export default class SignInOptionsPanel extends Component {
     } = this.state;
     this.setState({
       hideAppleSignInButton: isInternetExplorer || isAndroid(),
-      hideFacebookSignInButton: false,
+      hideFacebookSignInButton: !webAppConfig.ENABLE_FACEBOOK,  // December 12, 2023: All sorts of problems with sign-in with Facebook on Android
       hideTwitterSignInButton: false,
       hideVoterEmailAddressEntry: false,
       hideVoterPhoneEntry: false,
@@ -477,7 +478,7 @@ export default class SignInOptionsPanel extends Component {
                   )}
                 </div>
                 <div className="u-stack--md" style={isAndroid() ? { paddingBottom: '10px', paddingTop: '10px' } : {}}>
-                  { !hideFacebookSignInButton && !voterIsSignedInFacebook && isOnFacebookSupportedDomainUrl && (
+                  { !hideFacebookSignInButton && !voterIsSignedInFacebook && isOnFacebookSupportedDomainUrl && webAppConfig.ENABLE_FACEBOOK && (
                     <span>
                       <FacebookSignIn
                         closeSignInModal={this.closeSignInModalLocal}

diff --git a/src/js/common/components/Widgets/ToolBar.jsx b/src/js/common/components/Widgets/ToolBar.jsx
@@ -4,6 +4,7 @@ import { styled as muiStyled } from '@mui/styles';
 import withStyles from '@mui/styles/withStyles';
 import React, { Suspense } from 'react';
 import styled from 'styled-components';
+import isMobileScreenSize from '../../utils/isMobileScreenSize';
 import { renderLog } from '../../utils/logging';
 import normalizedImagePath from '../../utils/normalizedImagePath';
 
@@ -24,7 +25,7 @@ function ToolBar (params) {
             className="u-no-underline"
             url="https://twitter.com/WeVote"
             target="_blank"
-            body={(
+            body={isMobileScreenSize() ? (<span />) : (
               <Tooltip title="Twitter">
                 <IconButton size="large">
                   <TwitterStyled />
@@ -40,7 +41,7 @@ function ToolBar (params) {
             className="u-no-underline"
             url="https://www.facebook.com/WeVoteUSA"
             target="_blank"
-            body={(
+            body={isMobileScreenSize() ? (<span />) : (
               <Tooltip title="Facebook">
                 <IconButton size="large">
                   <FacebookStyled />
@@ -56,7 +57,7 @@ function ToolBar (params) {
             className="u-no-underline"
             url="https://www.instagram.com/WeVote"
             target="_blank"
-            body={(
+            body={isMobileScreenSize() ? (<span />) : (
               <Tooltip title="Instagram">
                 <IconButton size="large">
                   <InstagramStyled />
@@ -70,9 +71,9 @@ function ToolBar (params) {
           <OpenExternalWebSite
             linkIdAttribute="eepurl"
             className="u-no-underline"
-            url="http://eepurl.com/cx_frP"
+            url="https://eepurl.com/cx_frP"
             target="_blank"
-            body={(
+            body={isMobileScreenSize() ? (<span />) : (
               <Tooltip title="Newsletter">
                 <IconButton size="large">
                   <MailStyled />
@@ -89,7 +90,7 @@ function ToolBar (params) {
               className="u-no-underline"
               url="https://github.com/WeVote"
               target="_blank"
-              body={(
+              body={isMobileScreenSize() ? (<span />) : (
                 <Tooltip title="Github">
                   <IconButton size="large">
                     <GitHubStyled />
@@ -105,7 +106,7 @@ function ToolBar (params) {
             className="u-no-underline"
             url="https://blog.wevote.us/"
             target="_blank"
-            body={(
+            body={isMobileScreenSize() ? (<span />) : (
               <Tooltip title="Blog">
                 <IconButton size="large">
                   <img src={normalizedImagePath('/img/global/svg-icons/wordpress-logo.svg')}

diff --git a/src/js/components/Ballot/MeasureItemCompressed.jsx b/src/js/components/Ballot/MeasureItemCompressed.jsx
@@ -8,6 +8,7 @@ import styled from 'styled-components';
 import MeasureActions from '../../actions/MeasureActions';
 import extractNumber from '../../common/utils/extractNumber';
 import historyPush from '../../common/utils/historyPush';
+import isMobileScreenSize from '../../common/utils/isMobileScreenSize';
 import { renderLog } from '../../common/utils/logging';
 import shortenText from '../../common/utils/shortenText';
 import toTitleCase from '../../common/utils/toTitleCase';
@@ -218,7 +219,7 @@ class MeasureItemCompressed extends Component {
     }
     const measureSubtitleCapitalized = toTitleCase(measureSubtitle);
     ballotItemDisplayName = toTitleCase(ballotItemDisplayName);
-    const scoreExplanationTooltip = (
+    const scoreExplanationTooltip = isMobileScreenSize() ? (<span />) : (
       <Tooltip className="u-z-index-9020" id={`scoreDescription-${measureWeVoteId}`}>
         A positive personalized score
         {ballotDisplay[0] && (

diff --git a/src/js/components/Ballot/OfficeItemCompressed.jsx b/src/js/components/Ballot/OfficeItemCompressed.jsx
@@ -10,6 +10,7 @@ import { BallotHorizontallyScrollingContainer, BallotScrollingInnerWrapper, Ball
 import signInModalGlobalState from '../../common/components/Widgets/signInModalGlobalState';
 import AppObservableStore from '../../common/stores/AppObservableStore';
 import historyPush from '../../common/utils/historyPush';
+import isMobileScreenSize from '../../common/utils/isMobileScreenSize';
 import { renderLog } from '../../common/utils/logging';
 import normalizedImagePath from '../../common/utils/normalizedImagePath';
 import toTitleCase from '../../common/utils/toTitleCase';
@@ -300,8 +301,7 @@ class OfficeItemCompressed extends Component {
             const avatarCompressed = 'card-main__avatar-compressed';
             const avatarBackgroundImage = normalizedImagePath('../img/global/svg-icons/avatar-generic.svg');
             const uniqueKey = `candidate_preview-${oneCandidate.we_vote_id}-${window.performance.now()}`;
-            // console.log('ScrollingInnerWrapper: ', uniqueKey);
-            const scoreExplanationTooltip = (
+            const scoreExplanationTooltip = isMobileScreenSize() ? (<span />) : (
               <Tooltip className="u-z-index-9020" id={`scoreDescription-${oneCandidate.we_vote_id}`}>
                 Your personalized score
                 {oneCandidate.ballot_item_display_name && (

diff --git a/src/js/components/Facebook/FacebookSignedInData.js b/src/js/components/Facebook/FacebookSignedInData.js
@@ -1,8 +1,8 @@
 // eslint-disable-next-line import/no-cycle
+import signInModalGlobalState from '../../common/components/Widgets/signInModalGlobalState';
 import { isWebApp } from '../../common/utils/isCordovaOrWebApp';
 import { oAuthLog } from '../../common/utils/logging';
 import facebookApi from '../../utils/facebookApi';
-import signInModalGlobalState from '../../common/components/Widgets/signInModalGlobalState';
 
 const fbData = {
   connected: false,
@@ -199,7 +199,7 @@ export default {
           this.login2022Response(resolve, response);
         },
         (responseFail) => {
-          console.log('Failure to sign in to Facebook', responseFail);
+          console.log('Failure to sign in to Facebook', JSON.stringify(responseFail));
         });
       }
     });

diff --git a/src/js/components/Friends/FriendDetails.jsx b/src/js/components/Friends/FriendDetails.jsx
@@ -4,6 +4,7 @@ import React, { Component, Suspense } from 'react';
 import OverlayTrigger from 'react-bootstrap/OverlayTrigger';
 import Tooltip from 'react-bootstrap/Tooltip';
 import styled from 'styled-components';
+import isMobileScreenSize from '../../common/utils/isMobileScreenSize';
 import { FriendDetailsLine, FriendDetailsWrapper, FriendName, InviteToWeVoteLine } from '../Style/friendStyles';
 import abbreviateNumber from '../../common/utils/abbreviateNumber';
 import { renderLog } from '../../common/utils/logging';
@@ -57,7 +58,7 @@ class FriendDetails extends Component {
     let mutualFriendImageHtmlArray = <></>;
     if (mutualFriendPreviewList) {
       const mutualFriendPreviewListSorted = mutualFriendPreviewList.sort(this.orderByPhotoExists);
-      mutualFriendsTooltip = (
+      mutualFriendsTooltip = isMobileScreenSize() ? (<span />) : (
         <Tooltip className="u-z-index-9020" id="mutualFriendsTooltip">
           <div>
             {mutualFriendPreviewListSorted.map((mutualFriend) => {

diff --git a/src/js/components/Navigation/HeaderBackToVoterGuides.jsx b/src/js/components/Navigation/HeaderBackToVoterGuides.jsx
@@ -257,7 +257,7 @@ class HeaderBackToVoterGuides extends Component {
     const electionName = BallotStore.currentBallotElectionName;
     // const atLeastOnePositionFoundForThisElection = positionListForOneElection && positionListForOneElection.length !== 0;
 
-    const changeElectionButtonHtml = (
+    const changeElectionButtonHtml = isMobileScreenSize() ? (<span />) : (
       <Tooltip title="Change Election" aria-label="Change Election" classes={{ tooltipPlacementBottom: classes.tooltipPlacementBottom }}>
         <span>
           <IconButton

diff --git a/src/js/components/Ready/ReadyInformationDisclaimer.jsx b/src/js/components/Ready/ReadyInformationDisclaimer.jsx
@@ -5,6 +5,7 @@ import { OverlayTrigger } from 'react-bootstrap'; // TODO APRIL 2021:  Replace w
 import Popover from 'react-bootstrap/Popover';
 import { isAndroid, isIOS } from '../../common/utils/cordovaUtils';
 import { isWebApp } from '../../common/utils/isCordovaOrWebApp';
+import isMobileScreenSize from '../../common/utils/isMobileScreenSize';
 import { renderLog } from '../../common/utils/logging';
 
 
@@ -43,7 +44,7 @@ class ReadyInformationDisclaimer extends React.Component {
           trigger="click"
           key="top"
           placement="top"
-          overlay={(
+          overlay={isMobileScreenSize() ? (<span />) : (
             <Popover id="popover-positioned-top">
               <Popover.Content>
                 <strong>

diff --git a/src/js/components/Share/ShareButtonFooter.jsx b/src/js/components/Share/ShareButtonFooter.jsx
@@ -8,21 +8,22 @@ import AnalyticsActions from '../../actions/AnalyticsActions';
 import FriendActions from '../../actions/FriendActions';
 import VoterActions from '../../actions/VoterActions';
 import ShareActions from '../../common/actions/ShareActions';
+import { openSnackbar } from '../../common/components/Widgets/SnackNotifier';
+import AppObservableStore, { messageService } from '../../common/stores/AppObservableStore';
 import ShareStore from '../../common/stores/ShareStore';
 import apiCalming from '../../common/utils/apiCalming';
 import { hasDynamicIsland, hasIPhoneNotch, isAndroid } from '../../common/utils/cordovaUtils';
 import { isCordova, isWebApp } from '../../common/utils/isCordovaOrWebApp';
 import { renderLog } from '../../common/utils/logging';
 import stringContains from '../../common/utils/stringContains';
-import AppObservableStore, { messageService } from '../../common/stores/AppObservableStore';
+import webAppConfig from '../../config';
 import FriendStore from '../../stores/FriendStore';
 import VoterStore from '../../stores/VoterStore';
 import { getApplicationViewBooleans } from '../../utils/applicationUtils';
 import { shareBottomOffset } from '../../utils/cordovaOffsets';
 import createMessageToFriendDefaults from '../../utils/createMessageToFriendDefaults';
 import sortFriendListByMutualFriends from '../../utils/friendFunctions';
 import isMobile from '../../utils/isMobile';
-import { openSnackbar } from '../../common/components/Widgets/SnackNotifier';
 import { CopyLink, getKindOfShareFromURL, getWhatAndHowMuchToShareDefault, saveActionShareAnalytics, ShareFacebook, SharePreviewFriends, shareStyles, ShareTwitter, ShareWeVoteFriends } from './shareButtonCommon'; // cordovaSocialSharingByEmail // cordovaSocialSharingByEmail
 import ShareModalOption from './ShareModalOption';
 import { generateShareLinks } from './ShareModalText';
@@ -397,7 +398,9 @@ class ShareButtonFooter extends Component {
                 <ShareWeVoteFriends onClickFunction={() => this.saveActionShareButtonFriends()} />
                 {(!(isMobile() && navigator.share) || isCordova()) && (
                   <>
-                    <ShareFacebook titleText={titleText} saveActionShareButtonFacebook={this.saveActionShareButtonFacebook} linkToBeShared={linkToBeShared} />
+                    {webAppConfig.ENABLE_FACEBOOK && (
+                      <ShareFacebook titleText={titleText} saveActionShareButtonFacebook={this.saveActionShareButtonFacebook} linkToBeShared={linkToBeShared} />
+                    )}
                     <ShareTwitter titleText={titleText} saveActionShareButtonTwitter={this.saveActionShareButtonTwitter} saveActionShareButtonCopy={this.saveActionShareButtonCopy} linkToBeSharedTwitter={linkToBeSharedUrlEncoded} linkToBeSharedCopy={linkToBeShared} />
                   </>
                 )}