Added first draft Person & Team Actions/Stores. Moved AppObservableStore out of the common folder. Added TeamMembers page stub. Added WECONNECT_NAME_FOR_BROWSER_TAB_TITLE to config-template.

src/App.jsx

@@ -4,16 +4,16 @@ import PropTypes from 'prop-types';
 import React, { Component, Suspense } from 'react';
 import ReactGA from 'react-ga4';
 import TagManager from 'react-gtm-module';
-import { Redirect, Route, Switch, withRouter } from 'react-router-dom';
+import { Route, Switch, withRouter } from 'react-router-dom';
 import styled from 'styled-components';
 import VoterActions from './js/actions/VoterActions';
 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 AppObservableStore, { messageService } from './js/stores/AppObservableStore';
 import { getAndroidSize, getIOSSizeString, hasDynamicIsland, isIOS } from './js/common/utils/cordovaUtils';
 import historyPush from './js/common/utils/historyPush';
-import { isWeVoteMarketingSite, normalizedHref } from './js/common/utils/hrefUtils';
+import { normalizedHref } from './js/common/utils/hrefUtils';
 import initializejQuery from './js/common/utils/initializejQuery';
 import { isAndroid, isCordova, isWebApp } from './js/common/utils/isCordovaOrWebApp';
 import { renderLog } from './js/common/utils/logging';
@@ -25,9 +25,10 @@ import VoterStore from './js/stores/VoterStore';
 
 // Root URL pages
 
-const FAQ = React.lazy(() => import(/* webpackChunkName: 'FAQ' */ './js/pages/More/FAQ'));
+const FAQ = React.lazy(() => import(/* webpackChunkName: 'FAQ' */ './js/pages/FAQ'));
 const Footer = React.lazy(() => import(/* webpackChunkName: 'Footer' */ './js/components/Navigation/Footer'));
 const PageNotFound = React.lazy(() => import(/* webpackChunkName: 'PageNotFound' */ './js/pages/PageNotFound'));
+const TeamMembers = React.lazy(() => import(/* webpackChunkName: 'FAQ' */ './js/pages/TeamMembers'));
 
 // There are just too many "prop spreadings" in the use of Route, if someone can figure out an alternative...
 /* eslint-disable react/jsx-props-no-spreading */
@@ -61,31 +62,26 @@ class App extends Component {
     this.appStateSubscription = messageService.getMessage().subscribe(() => this.onAppObservableStoreChange());
     this.voterStoreListener = VoterStore.addListener(this.onVoterStoreChange.bind(this));
 
-    let { hostname } = window.location;
-    hostname = hostname || '';
+    // let { hostname } = window.location;
+    // hostname = hostname || '';
     initializejQuery(() => {
-      AppObservableStore.siteConfigurationRetrieve(hostname);
+      // AppObservableStore.siteConfigurationRetrieve(hostname);
     });
     // console.log('href in App.js componentDidMount: ', window.location.href);
     // console.log('normalizedHrefPage in App.js componentDidMount: ', normalizedHref());
-    const onWeVoteUS = (hostname && (hostname.toLowerCase() === 'wevote.us'));
-    const onMobileApp = false;
-    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 (isCordova()) {
       const size = isIOS() ?  getIOSSizeString() : getAndroidSize();
       console.log('Cordova:   device model', window.device.model, '  size: ', size);
       console.log('Cordova:   Header, hasDynamicIsland', hasDynamicIsland());
     }
 
-    this.bypass2FA();
+    // this.bypass2FA();
   }
 
   componentDidUpdate (prevProps) {
     if (prevProps.location.search !== this.props.location.search) {
-      this.bypass2FA();
+      // this.bypass2FA();
     }
   }
 
@@ -221,7 +217,7 @@ class App extends Component {
     const voterDeviceId = VoterStore.voterDeviceId();
     if (cid && cid !== voterDeviceId) {
       VoterSessionActions.setVoterDeviceIdCookie(cid);
-      VoterActions.voterRetrieve();
+      // VoterActions.voterRetrieve();
     }
   }
 
@@ -233,17 +229,16 @@ class App extends Component {
 
   render () {
     renderLog('App');
-    const { hideHeader, showReadyLight, enableFullStory } = this.state;
-    const isNotWeVoteMarketingSite = !isWeVoteMarketingSite();
+    const { hideHeader } = this.state;
     // const firstVisit = !cookies.getItem('voter_device_id');
-    const loadingPageHtml = (
-      <div id="loading-screen">
-        <div style={{ display: 'flex', position: 'fixed', height: '100vh', width: '100vw', top: 0, left: 0, backgroundColor: '#fff', justifyContent: 'center', alignItems: 'center', fontSize: '20px', color: '#2E3C5D', flexDirection: 'column', fontFamily: '\'Source Sans Pro\', sans-serif', textAlign: 'center' }}>
-          <h1 style={{ fontFamily: '\'Source Sans Pro\', sans-serif', fontSize: '32px', fontWeight: 'normal', color: '#2E3C5D' }}>Loading your ballot...</h1>
-          <div style={{ margin: '0 15px', textAlign: 'center' }}>Thank you for being a voter!</div>
-        </div>
-      </div>
-    );
+    // const loadingPageHtml = (
+    //   <div id="loading-screen">
+    //     <div style={{ display: 'flex', position: 'fixed', height: '100vh', width: '100vw', top: 0, left: 0, backgroundColor: '#fff', justifyContent: 'center', alignItems: 'center', fontSize: '20px', color: '#2E3C5D', flexDirection: 'column', fontFamily: '\'Source Sans Pro\', sans-serif', textAlign: 'center' }}>
+    //       <h1 style={{ fontFamily: '\'Source Sans Pro\', sans-serif', fontSize: '32px', fontWeight: 'normal', color: '#2E3C5D' }}>Loading your ballot...</h1>
+    //       <div style={{ margin: '0 15px', textAlign: 'center' }}>Thank you for being a voter!</div>
+    //     </div>
+    //   </div>
+    // );
 
     if (isWebApp()) {
       // console.log('WebApp: href in App.js render: ', window.location.href);
@@ -275,6 +270,7 @@ class App extends Component {
               <Suspense fallback={<LoadingWheelComp />}>
                 <Switch>
                   <Route path="/faq" exact><FAQ /></Route>
+                  <Route path="/team-members/:teamId" exact component={TeamMembers} />
 
                   <Route path="*" component={PageNotFound} />
                 </Switch>

src/js/actions/PersonActions.js

@@ -0,0 +1,14 @@
+import Dispatcher from '../common/dispatcher/Dispatcher';
+
+export default {
+  personRetrieve (personId = '') {
+    // console.log('PersonActions, personRetrieve personId:', personId);
+    if (personId) {
+      Dispatcher.loadEndpoint('person-retrieve', {
+        personId,
+      });
+    } else {
+      Dispatcher.loadEndpoint('person-retrieve');
+    }
+  },
+};

src/js/actions/TeamActions.js

@@ -0,0 +1,14 @@
+import Dispatcher from '../common/dispatcher/Dispatcher';
+
+export default {
+  teamRetrieve (teamId = '') {
+    // console.log('TeamActions, teamRetrieve teamId:', teamId);
+    if (teamId) {
+      Dispatcher.loadEndpoint('team-retrieve', {
+        teamId,
+      });
+    } else {
+      Dispatcher.loadEndpoint('team-retrieve');
+    }
+  },
+};

src/js/actions/VoterActions.js

@@ -1,6 +1,6 @@
 import Dispatcher from '../common/dispatcher/Dispatcher';
 import { isCordova } from '../common/utils/isCordovaOrWebApp'; // eslint-disable-line import/no-cycle
-import AppObservableStore from '../common/stores/AppObservableStore'; // eslint-disable-line import/no-cycle
+import AppObservableStore from '../stores/AppObservableStore'; // eslint-disable-line import/no-cycle
 import arrayContains from '../common/utils/arrayContains';
 
 export default {
@@ -494,5 +494,4 @@ export default {
       firebase_fcm_token: firebaseFCMToken,
     });
   },
-
 };

src/js/actions/VoterSessionActions.js

@@ -1,6 +1,6 @@
 import Dispatcher from '../common/dispatcher/Dispatcher';
 // eslint-disable-next-line import/no-cycle
-import AppObservableStore from '../common/stores/AppObservableStore';
+import AppObservableStore from '../stores/AppObservableStore';
 import Cookies from '../common/utils/js-cookie/Cookies';
 import stringContains from '../common/utils/stringContains';
 

src/js/common/components/Widgets/WeVoteRouter.jsx

@@ -1,7 +1,7 @@
 import ReactGA from 'react-ga4';
 import { BrowserRouter } from 'react-router-dom';
 import webAppConfig from '../../../config';
-import AppObservableStore from '../../stores/AppObservableStore';
+import AppObservableStore from '../../../stores/AppObservableStore';
 import { normalizedHrefPage } from '../../utils/hrefUtils';
 
 // https://stackoverflow.com/questions/34093913/how-to-debug-react-router

src/js/components/Navigation/Footer.jsx

@@ -4,7 +4,7 @@ import styled from 'styled-components';
 import { normalizedHref } from '../../common/utils/hrefUtils';
 import { isWebApp } from '../../common/utils/isCordovaOrWebApp';
 import { handleResize } from '../../common/utils/isMobileScreenSize';
-import AppObservableStore, { messageService } from '../../common/stores/AppObservableStore';
+import AppObservableStore, { messageService } from '../../stores/AppObservableStore';
 import { getApplicationViewBooleans } from '../../utils/applicationUtils';
 // importRemoveCordovaListenersToken2  -- Do not remove this line!
 

src/js/components/Navigation/Header.jsx

@@ -2,7 +2,7 @@ import PropTypes from 'prop-types';
 import React, { Component, Suspense } from 'react';
 // import styled from 'styled-components';
 import VoterActions from '../../actions/VoterActions';
-import AppObservableStore, { messageService } from '../../common/stores/AppObservableStore';
+import AppObservableStore, { messageService } from '../../stores/AppObservableStore';
 import apiCalming from '../../common/utils/apiCalming';
 import { normalizedHref } from '../../common/utils/hrefUtils';
 import { isCordova } from '../../common/utils/isCordovaOrWebApp';
@@ -36,7 +36,7 @@ export default class Header extends Component {
     //   dumpCssFromId('header-container');
     // }
     if (VoterStore.getVoterWeVoteId() === '' && apiCalming('voterRetrieve', 500)) {
-      VoterActions.voterRetrieve();
+      // VoterActions.voterRetrieve();
     }
   }
 

src/js/components/Style/pageLayoutStyles.js

@@ -1,7 +1,7 @@
 import { AppBar } from '@mui/material';
 import styled from 'styled-components';
 import standardBoxShadow from '../../common/components/Style/standardBoxShadow';
-import AppObservableStore from '../../common/stores/AppObservableStore';
+import AppObservableStore from '../../stores/AppObservableStore';
 import { hasDynamicIsland, hasIPhoneNotch, isAndroidSizeMD, isAndroidSizeWide, isAndroidSizeXL, isIOS, isIOSAppOnMac, isIPad, isIPad11in, isIPadMini, isIPhone14Pro, isIPhone4p7in, isIPhone5p5inEarly, isIPhone5p5inMini, isIPhone6p1in, isIPhone6p5in } from '../../common/utils/cordovaUtils';
 import { normalizedHrefPage } from '../../common/utils/hrefUtils';
 import { isAndroid, isCordova, isWebApp } from '../../common/utils/isCordovaOrWebApp';

src/js/config-template.js

@@ -1,6 +1,7 @@
 /* eslint-disable */
 // Note that we import these values where needed as "webAppConfig"
 module.exports = {
+  WECONNECT_NAME_FOR_BROWSER_TAB_TITLE: 'WeConnect',
   WECONNECT_URL_PROTOCOL: 'http://', // 'http://' for local dev (if not using SSL), or 'https://' for live server
   WECONNECT_HOSTNAME: 'localhost:4000', // Don't add 'http...' here.  Live server: 'WeVote.US', Quality: 'quality.WeVote.US', developers: 'localhost:4000'
   WECONNECT_IMAGE_PATH_FOR_CORDOVA: 'https://wevote.us',   // If you are not working with Cordova, you don't need to change this
@@ -68,4 +69,6 @@ module.exports = {
   GOOGLE_ANALYTICS_TRACKING_ID: '',
   GOOGLE_MAPS_API_KEY: '',
   GOOGLE_RECAPTCHA_KEY: '',
+  OPEN_REPLAY_PROJECT_KEY: '',
+  OPEN_REPLAY_INGEST_POINT: 'https://openreplay.wevote.us/ingest',
 };

src/js/pages/More/FAQ.jsx → src/js/pages/FAQ.jsx

@@ -1,10 +1,10 @@
 import React, { Component } from 'react';
 import { Helmet } from 'react-helmet-async';
 import styled from 'styled-components';
-import FAQBody from '../../common/components/FAQBody';
-import { isCordova } from '../../common/utils/isCordovaOrWebApp';
-import { renderLog } from '../../common/utils/logging';
-import { PageContentContainer } from '../../components/Style/pageLayoutStyles';
+import FAQBody from '../common/components/FAQBody';
+import { isCordova } from '../common/utils/isCordovaOrWebApp';
+import { renderLog } from '../common/utils/logging';
+import { PageContentContainer } from '../components/Style/pageLayoutStyles';
 
 export default class FAQ extends Component {
   static getProps () {
@@ -21,7 +21,7 @@ export default class FAQ extends Component {
       <div>
         <Helmet>
           <title>FAQ - WeVote</title>
-          <link rel="canonical" href="https://wevote.us/more/faq" />
+          <link rel="canonical" href="https://wevote.us/faq" />
         </Helmet>
         <PageContentContainer>
           <ContainerFluidWrapper className="container-fluid card">

src/js/pages/TeamMembers.jsx

@@ -0,0 +1,91 @@
+import React from 'react';
+import { Helmet } from 'react-helmet-async';
+import styled from 'styled-components';
+import PropTypes from 'prop-types';
+import { withStyles } from '@mui/styles';
+import AppObservableStore, { messageService } from '../stores/AppObservableStore';
+import TeamActions from '../actions/TeamActions';
+import TeamStore from '../stores/TeamStore';
+import { PageContentContainer } from '../components/Style/pageLayoutStyles';
+import webAppConfig from '../config';
+
+
+const TeamMembers = ({ match }) => {  //  classes, teamId
+  const [teamId, setTeamId] = React.useState(-1);
+  const [teamMemberList, setTeamMemberList] = React.useState([]);
+  const [teamMemberCount, setTeamMemberCount] = React.useState(0);
+
+  const onAppObservableStoreChange = () => {
+  };
+
+  const onTeamStoreChange = () => {
+    const teamMemberListTemp = TeamStore.getTeamMemberList(teamId);
+    setTeamMemberList(teamMemberListTemp);
+    setTeamMemberCount(teamMemberListTemp.length);
+  };
+
+  React.useEffect(() => {
+    const { params: {
+      teamId: teamIdIncoming,
+    } } = match;
+    setTeamId(teamIdIncoming);
+
+    console.log('Fetching team members for:', teamIdIncoming);
+    const appStateSubscription = messageService.getMessage().subscribe(() => onAppObservableStoreChange());
+    onAppObservableStoreChange();
+    const teamStoreListener = TeamStore.addListener(onTeamStoreChange);
+    onTeamStoreChange();
+
+    TeamActions.teamRetrieve(teamIdIncoming);
+
+    return () => {
+      appStateSubscription.unsubscribe();
+      teamStoreListener.remove();
+    };
+  }, []);
+
+  const pigsCanFly = false;
+  return (
+    <div>
+      <Helmet>
+        <title>
+          Team Members -
+          {' '}
+          {webAppConfig.WECONNECT_NAME_FOR_BROWSER_TAB_TITLE}
+        </title>
+        <link rel="canonical" href={`${webAppConfig.WECONNECT_URL_FOR_SEO}/team-members`} />
+      </Helmet>
+      <PageContentContainer>
+        Team Members (
+        {teamMemberCount}
+        )
+        {pigsCanFly && (
+          <SearchBarWrapper>Team Members will fly here</SearchBarWrapper>
+        )}
+      </PageContentContainer>
+    </div>
+  );
+};
+TeamMembers.propTypes = {
+  classes: PropTypes.object.isRequired,
+  // teamId: PropTypes.number.isRequired,
+  match: PropTypes.object.isRequired,
+};
+
+const styles = () => ({
+  buttonDesktop: {
+    padding: '2px 16px',
+    borderRadius: 5,
+  },
+  searchButton: {
+    borderRadius: 50,
+  },
+});
+
+const SearchBarWrapper = styled('div')`
+  // margin-top: 14px;
+  // margin-bottom: 8px;
+  width: 100%;
+`;
+
+export default withStyles(styles)(TeamMembers);

src/js/common/stores/AppObservableStore.js → src/js/stores/AppObservableStore.js

@@ -1,10 +1,10 @@
 import { Subject } from 'rxjs';
-import VoterActions from '../../actions/VoterActions'; // eslint-disable-line import/no-cycle
-import stringContains from '../utils/stringContains';
-import webAppConfig from '../../config';
-import VoterStore from '../../stores/VoterStore'; // eslint-disable-line import/no-cycle
-import { dumpObjProps } from '../../utils/appleSiliconUtils';
-import $ajax from '../../utils/service';
+import VoterActions from '../actions/VoterActions'; // eslint-disable-line import/no-cycle
+import stringContains from '../common/utils/stringContains';
+import webAppConfig from '../config';
+import VoterStore from './VoterStore'; // eslint-disable-line import/no-cycle
+import { dumpObjProps } from '../utils/appleSiliconUtils';
+import $ajax from '../utils/service';
 
 const subject = new Subject();