diff --git a/web/components/log-out-if-missing-csat-handler.react.js b/web/components/log-out-if-missing-csat-handler.react.js index defd2c27b..c031cb4e0 100644 --- a/web/components/log-out-if-missing-csat-handler.react.js +++ b/web/components/log-out-if-missing-csat-handler.react.js @@ -1,65 +1,88 @@ // @flow import * as React from 'react'; import { logOutActionTypes, useLogOut } from 'lib/actions/user-actions.js'; import { useModalContext } from 'lib/components/modal-provider.react.js'; +import { accountHasPassword } from 'lib/shared/account-utils.js'; import { useDispatchActionPromise } from 'lib/utils/redux-promise-utils.js'; import { useSelector } from 'lib/utils/redux-utils.js'; import { usingCommServicesAccessToken } from 'lib/utils/services-utils.js'; import css from './version-handler.css'; import Modal from '../modals/modal.react.js'; -function MissingCSATModal(): React.Node { +type Props = { + +isAccountWithPassword: boolean, +}; + +function MissingCSATModal(props: Props): React.Node { const { popModal } = useModalContext(); + const { isAccountWithPassword } = props; + + let modalContent; + if (isAccountWithPassword) { + modalContent = ( +

+ Unfortunately, we must log you out in order to generate a PAKE-derived + secret. You can learn more about PAKEs and the protocol we use (OPAQUE){' '} + + here + + . +

+ ); + } else { + modalContent = ( +

+ Unfortunately, we must log you out as we perform an update to our + system. +

+ ); + } return ( -
-

- Unfortunately, we must log you out in order to generate a PAKE-derived - secret. You can learn more about PAKEs and the protocol we use - (OPAQUE){' '} - - here - - . -

-
+
{modalContent}
); } function LogOutIfMissingCSATHandler() { const dispatchActionPromise = useDispatchActionPromise(); const callLogOut = useLogOut(); + const isAccountWithPassword = useSelector(state => + accountHasPassword(state.currentUserInfo), + ); const hasAccessToken = useSelector(state => !!state.commServicesAccessToken); const dataLoaded = useSelector(state => state.dataLoaded); const { pushModal } = useModalContext(); React.useEffect(() => { if (!hasAccessToken && dataLoaded && usingCommServicesAccessToken) { void dispatchActionPromise(logOutActionTypes, callLogOut()); - pushModal(); + pushModal( + , + ); } }, [ callLogOut, dataLoaded, dispatchActionPromise, hasAccessToken, + isAccountWithPassword, pushModal, ]); } export default LogOutIfMissingCSATHandler;