Integration Fixes

src/components/EmailNotifications/EmailNotificationsManager.js

@@ -12,6 +12,7 @@ import StatusInfo from './StatusInfo'
 import SignatureRequest from '../SignatureRequest'
 import UnlockNotifications from '../GlobalPreferences/Notifications/UnlockNotifications'
 import VerifyEmailAddress from './VerifyEmailAddress'
+import VerifyEmailAddressPreferences from '../GlobalPreferences/Notifications/VerifyEmailAddressPreferences'
 
 import { actions } from './actions'
 
@@ -44,6 +45,7 @@ import {
   UNLOCK_NOTIFICATIONS_SCREEN,
   VERIFICATION_ERROR_SCREEN,
   VERIFICATION_SUCCESS_SCREEN,
+  VERIFY_EMAIL_ADDRESS_PREFERENCES,
   VERIFY_YOUR_EMAIL_SCREEN,
 } from './constants'
 
@@ -89,6 +91,7 @@ const EmailNotificationsManager = React.memo(
           ? EMAIL_NOTIFICATIONS_EXISTING_EMAIL_SCREEN
           : EMAIL_NOTIFICATIONS_FORM_SCREEN)
     )
+
     const [subscriptionProgress, setSubscriptionProgress] = useState({
       ...DEFAULT_SUBSCRIPTION_PROGRESS,
       email,
@@ -595,6 +598,14 @@ const EmailNotificationsManager = React.memo(
               />
             )
           }
+          if (screenId === VERIFY_EMAIL_ADDRESS_PREFERENCES) {
+            return (
+              <VerifyEmailAddressPreferences
+                email={subscriptionProgress.email}
+                onResend={() => {}}
+              />
+            )
+          }
         })()}
       </WrappedContainer>
     )

src/components/GlobalPreferences/GlobalPreferences.js

@@ -13,7 +13,7 @@ import {
 import { Transition, animated } from 'react-spring/renderprops'
 import { useEsc } from '../../hooks/useKeyboardArrows'
 import Network from './Network/Network'
-import NotificationsPreferencesLoader from './Notifications/NotificationsPreferencesLoader'
+import NotificationsManager from './Notifications/NotificationsManager'
 
 const SECTIONS = new Map([
   ['network', 'Network'],
@@ -27,13 +27,7 @@ const NOTIFICATIONS_INDEX = 1
 
 const AnimatedDiv = animated.div
 
-function GlobalPreferences({
-  compact,
-  onClose,
-  onNavigation,
-  sectionIndex,
-  queryParms,
-}) {
+function GlobalPreferences({ compact, onClose, onNavigation, sectionIndex }) {
   useEsc(onClose)
 
   const container = useRef()
@@ -43,7 +37,6 @@ function GlobalPreferences({
     }
   }, [])
 
-  const { address, token } = queryParms || {}
   return (
     <div ref={container} tabIndex="0" css="outline: 0">
       <Layout css="z-index: 2">
@@ -62,9 +55,7 @@ function GlobalPreferences({
           />
 
           {sectionIndex === NETWORK_INDEX && <Network />}
-          {sectionIndex === NOTIFICATIONS_INDEX && (
-            <NotificationsPreferencesLoader address={address} token={token} />
-          )}
+          {sectionIndex === NOTIFICATIONS_INDEX && <NotificationsManager />}
         </React.Fragment>
       </Layout>
     </div>
@@ -121,12 +112,7 @@ function Close({ compact, onClick }) {
   )
 }
 
-function AnimatedGlobalPreferences({
-  path,
-  onScreenChange,
-  onClose,
-  queryParms,
-}) {
+function AnimatedGlobalPreferences({ path, onScreenChange, onClose }) {
   const { sectionIndex, handleNavigation } = useGlobalPreferences({
     path,
     onScreenChange,
@@ -180,7 +166,6 @@ function AnimatedGlobalPreferences({
               compact={compact}
               sectionIndex={sectionIndex}
               onNavigation={handleNavigation}
-              queryParms={queryParms}
             />
           </AnimatedDiv>
         ))

src/components/GlobalPreferences/Notifications/NotificationsManager.js

@@ -1,86 +1,107 @@
 import React, { useEffect, useState } from 'react'
+import { useLocation } from 'react-router-dom'
+import { useWallet } from '../../../providers/Wallet'
 import {
   verifyJurorEmail,
   getJurorEmail,
 } from '../../../services/servicesRequests'
-
+import { useSubscriptionDetails } from '../../../hooks/useEmailNotifications'
 import EmailNotificationsManager from '../../EmailNotifications/EmailNotificationsManager'
 import {
   EMAIL_NOTIFICATIONS_FORM_SCREEN,
   NOTIFICATIONS_PREFERENCES_SCREEN,
   UNLOCK_NOTIFICATIONS_SCREEN,
   VERIFICATION_ERROR_SCREEN,
   VERIFICATION_SUCCESS_SCREEN,
+  VERIFY_EMAIL_ADDRESS_PREFERENCES,
 } from '../../EmailNotifications/constants'
 
-const NotificationsManager = React.memo(function NotificationsManager({
-  account,
-  emailExists,
-  emailVerified,
-  notificationsDisabled,
-  paramAddress,
-  token,
-}) {
+const NotificationsManager = React.memo(function NotificationsManager() {
+  const { account } = useWallet()
+  const { search } = useLocation()
+  const [startingScreenId, setStartingScreenId] = useState()
   const [jurorNeedsSignature, setJurorNeedsSignature] = useState()
   const [jurorEmail, setJurorEmail] = useState('')
-  const [fetching, setFetching] = useState(true)
-  const [verificationError, setVerificationError] = useState(false)
+
+  const {
+    emailExists,
+    emailVerified,
+    notificationsDisabled,
+    fetching: fetchingSubscriptionData,
+  } = useSubscriptionDetails(account)
+
+  const searchParams = new URLSearchParams(search)
+  const address = searchParams.get('address')
+  const token = searchParams.get('token')
 
   useEffect(() => {
     let cancelled = false
 
-    if (!token && !paramAddress) {
+    if (!token || !address) {
       return
     }
     const verifyEmailAddress = async () => {
-      const { verified } = await verifyJurorEmail(paramAddress, token)
+      const { error } = await verifyJurorEmail(address, token)
 
       if (!cancelled) {
-        if (!verified) {
-          setVerificationError(true)
+        if (error) {
+          return setStartingScreenId(VERIFICATION_ERROR_SCREEN)
         }
+        return setStartingScreenId(VERIFICATION_SUCCESS_SCREEN)
       }
     }
 
     verifyEmailAddress()
     return () => {
       cancelled = true
     }
-  }, [account, paramAddress, token])
+  }, [account, address, token])
 
   useEffect(() => {
     let cancelled = false
     const getEmail = async () => {
+      if (address || token) {
+        return
+      }
+
       if (!account) {
-        setFetching(false)
+        return setStartingScreenId(UNLOCK_NOTIFICATIONS_SCREEN)
+      }
+
+      if (fetchingSubscriptionData) {
+        // TODO - FETCHING SCREEN
         return
       }
 
       if (!cancelled) {
         const { needsSignature, email } = await getJurorEmail(account)
+
         setJurorNeedsSignature(needsSignature)
         setJurorEmail(email)
-        setFetching(false)
+
+        if (!emailVerified && emailExists) {
+          return setStartingScreenId(VERIFY_EMAIL_ADDRESS_PREFERENCES)
+        }
+        if (account && emailVerified && needsSignature) {
+          return setStartingScreenId(UNLOCK_NOTIFICATIONS_SCREEN)
+        }
+
+        if (account && !emailVerified && !notificationsDisabled) {
+          return setStartingScreenId(EMAIL_NOTIFICATIONS_FORM_SCREEN)
+        }
+        if (account && emailVerified && !needsSignature) {
+          return setStartingScreenId(NOTIFICATIONS_PREFERENCES_SCREEN)
+        }
       }
     }
     getEmail()
     return () => {
       cancelled = true
     }
-  }, [account])
-
-  const startingScreenId = getStartingScreen(
-    account,
-    emailExists,
-    emailVerified,
-    notificationsDisabled,
-    jurorNeedsSignature,
-    token,
-    verificationError
-  )
+  }, [address, account, emailExists, emailVerified, notificationsDisabled, fetchingSubscriptionData, token])
 
   return (
-    !fetching && (
+    startingScreenId && (
       <EmailNotificationsManager
         needsUnlockSettings={jurorNeedsSignature}
         isModal={false}
@@ -94,31 +115,4 @@ const NotificationsManager = React.memo(function NotificationsManager({
   )
 })
 
-function getStartingScreen(
-  account,
-  emailExists,
-  emailVerifiedd,
-  notificationsDisabled,
-  jurorNeedsSignature,
-  token,
-  verificationError
-) {
-  if (token) {
-    if (verificationError) {
-      return VERIFICATION_ERROR_SCREEN
-    }
-    return VERIFICATION_SUCCESS_SCREEN
-  }
-  const emailVerified = true
-  if (!account || (account && emailVerified && jurorNeedsSignature)) {
-    return UNLOCK_NOTIFICATIONS_SCREEN
-  }
-  if (account && !emailVerified && !notificationsDisabled) {
-    return EMAIL_NOTIFICATIONS_FORM_SCREEN
-  }
-  if (account && emailVerified && !jurorNeedsSignature) {
-    return NOTIFICATIONS_PREFERENCES_SCREEN
-  }
-}
-
 export default NotificationsManager

src/components/MainView.js

@@ -20,12 +20,7 @@ function MainView({ children }) {
   const compactMode = below('medium')
   const [menuPanelOpen, setMenuPanelOpen] = useState(!compactMode)
 
-  const [
-    openPreferences,
-    closePreferences,
-    preferenceOption,
-    queryParms,
-  ] = usePreferences()
+  const [openPreferences, closePreferences, preferenceOption] = usePreferences()
 
   const toggleMenuPanel = useCallback(
     () => setMenuPanelOpen(opened => !opened),
@@ -50,7 +45,6 @@ function MainView({ children }) {
         path={preferenceOption}
         onScreenChange={openPreferences}
         onClose={closePreferences}
-        queryParms={queryParms}
       />
     )
   }

src/components/SignatureRequest.js

@@ -7,11 +7,7 @@ import { dayjs } from '../utils/date-utils'
 
 import signRequestSuccessIllustration from '../../src/assets/signRequestSuccess.svg'
 import signRequestFailIllustration from '../../src/assets/signRequestFail.svg'
-<<<<<<< HEAD
-import signProcessing from '../../src/assets/loader.gif'
-=======
 import signRequestLoading from '../../src/assets/signRequestLoading.gif'
->>>>>>> development
 
 const SignerRequest = React.memo(function SignerRequest({
   compactMode,

src/endpoints.js

@@ -3,7 +3,7 @@ import environment from './environment'
 import { isLocalOrUnknownNetwork, getNetworkType } from './lib/web3-utils'
 
 const CHAIN_ID = environment('CHAIN_ID')
-const COURT_SERVER_NAME = environment('COURT_SERVER_NAME')
+// const COURT_SERVER_NAME = environment('COURT_SERVER_NAME')
 const SUBGRAPH_NAME = environment('SUBGRAPH_NAME')
 
 // IPFS endpoint
@@ -13,14 +13,15 @@ export const IPFS_ENDPOINT = isLocalOrUnknownNetwork(CHAIN_ID)
 
 // Court server endpoint
 export function courtServerEndpoint() {
-  if (isLocalOrUnknownNetwork(CHAIN_ID)) {
-    return 'http://127.0.0.1:8050'
-  }
-
-  const networkType = getNetworkType(CHAIN_ID)
-  return `https://court-backend${
-    networkType === 'main' ? '' : `-${COURT_SERVER_NAME || networkType}`
-  }.eth.aragon.network`
+  // if (isLocalOrUnknownNetwork(CHAIN_ID)) {
+  //   return 'http://127.0.0.1:8050'
+  // }
+
+  // const networkType = getNetworkType(CHAIN_ID)
+  // return `https://court-backend${
+  //   networkType === 'main' ? '' : `-${COURT_SERVER_NAME || networkType}`
+  // }.eth.aragon.network`
+  return 'https://court-backend-usability.eth.aragon.network'
 }
 
 // The graph endpoints