diff --git a/lib/hooks/login-hooks.js b/lib/hooks/login-hooks.js
new file mode 100644
--- /dev/null
+++ b/lib/hooks/login-hooks.js
@@ -0,0 +1,121 @@
+// @flow
+
+import * as React from 'react';
+
+import {
+  identityLogInActionTypes,
+  useIdentityPasswordLogIn,
+} from '../actions/user-actions.js';
+import { useKeyserverAuth } from '../keyserver-conn/keyserver-auth.js';
+import { logInActionSources } from '../types/account-types.js';
+import { authoritativeKeyserverID } from '../utils/authoritative-keyserver.js';
+import { useDispatchActionPromise } from '../utils/redux-promise-utils.js';
+import { useSelector } from '../utils/redux-utils.js';
+
+// We can't just do everything in one async callback, since the server calls
+// would get bound to Redux state from before the login. In order to pick up the
+// updated CSAT and currentUserInfo from Redux, we break the login into two
+// steps.
+
+type CurrentStep =
+  | { +step: 'inactive' }
+  | {
+      +step: 'identity_login_dispatched',
+      +resolve: () => void,
+      +reject: Error => void,
+    };
+
+const inactiveStep = { step: 'inactive' };
+
+type UsePasswordLogInInput = {
+  // Called after successful identity auth, but before successful authoritative
+  // keyserver auth. Used by callers to trigger local persistence of credentials
+  +saveCredentials?: ?({ +username: string, +password: string }) => mixed,
+};
+function usePasswordLogIn(
+  input?: ?UsePasswordLogInInput,
+): (username: string, password: string) => Promise<void> {
+  const [currentStep, setCurrentStep] =
+    React.useState<CurrentStep>(inactiveStep);
+
+  const saveCredentials = input?.saveCredentials;
+  const identityPasswordLogIn = useIdentityPasswordLogIn();
+  const identityLogInAction = React.useCallback(
+    async (username: string, password: string) => {
+      const result = await identityPasswordLogIn(username, password);
+      saveCredentials?.({ username, password });
+      return result;
+    },
+    [identityPasswordLogIn, saveCredentials],
+  );
+
+  const dispatchActionPromise = useDispatchActionPromise();
+  const returnedFunc = React.useCallback(
+    (username: string, password: string) =>
+      new Promise<void>(
+        // eslint-disable-next-line no-async-promise-executor
+        async (resolve, reject) => {
+          if (currentStep.step !== 'inactive') {
+            return;
+          }
+          const action = identityLogInAction(username, password);
+          void dispatchActionPromise(identityLogInActionTypes, action);
+          try {
+            await action;
+            setCurrentStep({
+              step: 'identity_login_dispatched',
+              resolve,
+              reject,
+            });
+          } catch (e) {
+            reject(e);
+          }
+        },
+      ),
+    [currentStep, dispatchActionPromise, identityLogInAction],
+  );
+
+  const keyserverAuth = useKeyserverAuth(authoritativeKeyserverID());
+
+  const isRegisteredOnIdentity = useSelector(
+    state =>
+      !!state.commServicesAccessToken &&
+      !!state.currentUserInfo &&
+      !state.currentUserInfo.anonymous,
+  );
+
+  const registeringOnAuthoritativeKeyserverRef = React.useRef(false);
+  React.useEffect(() => {
+    if (
+      !isRegisteredOnIdentity ||
+      currentStep.step !== 'identity_login_dispatched' ||
+      registeringOnAuthoritativeKeyserverRef.current
+    ) {
+      return;
+    }
+    registeringOnAuthoritativeKeyserverRef.current = true;
+    const { resolve, reject } = currentStep;
+    void (async () => {
+      try {
+        await keyserverAuth({
+          authActionSource: process.env.BROWSER
+            ? logInActionSources.keyserverAuthFromWeb
+            : logInActionSources.keyserverAuthFromNative,
+          setInProgress: () => {},
+          hasBeenCancelled: () => false,
+          doNotRegister: false,
+        });
+        resolve();
+      } catch (e) {
+        reject(e);
+      } finally {
+        setCurrentStep(inactiveStep);
+        registeringOnAuthoritativeKeyserverRef.current = false;
+      }
+    })();
+  }, [currentStep, isRegisteredOnIdentity, keyserverAuth]);
+
+  return returnedFunc;
+}
+
+export { usePasswordLogIn };
diff --git a/native/account/log-in-panel.react.js b/native/account/log-in-panel.react.js
--- a/native/account/log-in-panel.react.js
+++ b/native/account/log-in-panel.react.js
@@ -9,9 +9,8 @@
   legacyLogInActionTypes,
   useLegacyLogIn,
   getOlmSessionInitializationDataActionTypes,
-  useIdentityPasswordLogIn,
-  identityLogInActionTypes,
 } from 'lib/actions/user-actions.js';
+import { usePasswordLogIn } from 'lib/hooks/login-hooks.js';
 import {
   createLoadingStatusSelector,
   combineLoadingStatuses,
@@ -28,7 +27,6 @@
   type LogInStartingPayload,
   logInActionSources,
 } from 'lib/types/account-types.js';
-import type { IdentityAuthResult } from 'lib/types/identity-service-types.js';
 import type { LoadingStatus } from 'lib/types/loading-types.js';
 import { getMessageForException } from 'lib/utils/errors.js';
 import {
@@ -72,15 +70,16 @@
   +logInExtraInfo: () => Promise<LogInExtraInfo>,
   +dispatchActionPromise: DispatchActionPromise,
   +legacyLogIn: (logInInfo: LogInInfo) => Promise<LogInResult>,
-  +identityPasswordLogIn: (
-    username: string,
-    password: string,
-  ) => Promise<IdentityAuthResult>,
+  +identityPasswordLogIn: (username: string, password: string) => Promise<void>,
   +getInitialNotificationsEncryptedMessage: () => Promise<string>,
 };
-class LogInPanel extends React.PureComponent<Props> {
+type State = {
+  +logInPending: boolean,
+};
+class LogInPanel extends React.PureComponent<Props, State> {
   usernameInput: ?TextInput;
   passwordInput: ?PasswordInput;
+  state: State = { logInPending: false };
 
   componentDidMount() {
     void this.attemptToFetchCredentials();
@@ -142,7 +141,7 @@
             returnKeyType="next"
             blurOnSubmit={false}
             onSubmitEditing={this.focusPasswordInput}
-            editable={this.props.loadingStatus !== 'loading'}
+            editable={this.getLoadingStatus() !== 'loading'}
             ref={this.usernameInputRef}
           />
         </View>
@@ -164,14 +163,14 @@
             returnKeyType="go"
             blurOnSubmit={false}
             onSubmitEditing={this.onSubmit}
-            editable={this.props.loadingStatus !== 'loading'}
+            editable={this.getLoadingStatus() !== 'loading'}
             ref={this.passwordInputRef}
           />
         </View>
         <View style={styles.footer}>
           <PanelButton
             text="LOG IN"
-            loadingStatus={this.props.loadingStatus}
+            loadingStatus={this.getLoadingStatus()}
             onSubmit={this.onSubmit}
           />
         </View>
@@ -179,6 +178,16 @@
     );
   }
 
+  getLoadingStatus(): LoadingStatus {
+    if (this.props.loadingStatus === 'loading') {
+      return 'loading';
+    }
+    if (this.state.logInPending) {
+      return 'loading';
+    }
+    return 'inactive';
+  }
+
   usernameInputRef: (usernameInput: ?TextInput) => void = usernameInput => {
     this.usernameInput = usernameInput;
     if (Platform.OS === 'ios' && usernameInput) {
@@ -249,26 +258,24 @@
     }
 
     Keyboard.dismiss();
+    if (usingCommServicesAccessToken) {
+      await this.identityPasswordLogIn();
+      return;
+    }
+
     const extraInfo = await this.props.logInExtraInfo();
     const initialNotificationsEncryptedMessage =
       await this.props.getInitialNotificationsEncryptedMessage();
 
-    if (usingCommServicesAccessToken) {
-      void this.props.dispatchActionPromise(
-        identityLogInActionTypes,
-        this.identityPasswordLogInAction(),
-      );
-    } else {
-      void this.props.dispatchActionPromise(
-        legacyLogInActionTypes,
-        this.legacyLogInAction({
-          ...extraInfo,
-          initialNotificationsEncryptedMessage,
-        }),
-        undefined,
-        ({ calendarQuery: extraInfo.calendarQuery }: LogInStartingPayload),
-      );
-    }
+    void this.props.dispatchActionPromise(
+      legacyLogInActionTypes,
+      this.legacyLogInAction({
+        ...extraInfo,
+        initialNotificationsEncryptedMessage,
+      }),
+      undefined,
+      ({ calendarQuery: extraInfo.calendarQuery }: LogInStartingPayload),
+    );
   };
 
   async legacyLogInAction(extraInfo: LogInExtraInfo): Promise<LogInResult> {
@@ -312,18 +319,17 @@
     }
   }
 
-  async identityPasswordLogInAction(): Promise<IdentityAuthResult> {
+  async identityPasswordLogIn(): Promise<void> {
+    if (this.state.logInPending) {
+      return;
+    }
+    this.setState({ logInPending: true });
     try {
-      const result = await this.props.identityPasswordLogIn(
+      await this.props.identityPasswordLogIn(
         this.usernameInputText,
         this.passwordInputText,
       );
       this.props.setActiveAlert(false);
-      await setNativeCredentials({
-        username: this.usernameInputText,
-        password: this.passwordInputText,
-      });
-      return result;
     } catch (e) {
       const messageForException = getMessageForException(e);
       if (
@@ -352,6 +358,8 @@
         );
       }
       throw e;
+    } finally {
+      this.setState({ logInPending: false });
     }
   }
 
@@ -427,6 +435,7 @@
 );
 const olmSessionInitializationDataLoadingStatusSelector =
   createLoadingStatusSelector(getOlmSessionInitializationDataActionTypes);
+const identityPasswordLogInInput = { saveCredentials: setNativeCredentials };
 
 const ConnectedLogInPanel: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedLogInPanel(props: BaseProps) {
@@ -443,7 +452,9 @@
 
     const dispatchActionPromise = useDispatchActionPromise();
     const callLegacyLogIn = useLegacyLogIn();
-    const callIdentityPasswordLogIn = useIdentityPasswordLogIn();
+    const callIdentityPasswordLogIn = usePasswordLogIn(
+      identityPasswordLogInInput,
+    );
     const getInitialNotificationsEncryptedMessage =
       useInitialNotificationsEncryptedMessage(authoritativeKeyserverID);
 
diff --git a/web/account/traditional-login-form.react.js b/web/account/traditional-login-form.react.js
--- a/web/account/traditional-login-form.react.js
+++ b/web/account/traditional-login-form.react.js
@@ -6,10 +6,9 @@
 import {
   useLegacyLogIn,
   legacyLogInActionTypes,
-  useIdentityPasswordLogIn,
-  identityLogInActionTypes,
 } from 'lib/actions/user-actions.js';
 import { useModalContext } from 'lib/components/modal-provider.react.js';
+import { usePasswordLogIn } from 'lib/hooks/login-hooks.js';
 import { logInExtraInfoSelector } from 'lib/selectors/account-selectors.js';
 import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
 import {
@@ -38,10 +37,13 @@
   legacyLogInActionTypes,
 );
 function TraditionalLoginForm(): React.Node {
-  const inputDisabled = useSelector(loadingStatusSelector) === 'loading';
+  const legacyAuthInProgress = useSelector(loadingStatusSelector) === 'loading';
+  const [identityAuthInProgress, setIdentityAuthInProgress] =
+    React.useState(false);
+  const inputDisabled = legacyAuthInProgress || identityAuthInProgress;
+
   const loginExtraInfo = useSelector(logInExtraInfoSelector);
   const callLegacyLogIn = useLegacyLogIn();
-  const callIdentityPasswordLogIn = useIdentityPasswordLogIn();
 
   const dispatchActionPromise = useDispatchActionPromise();
   const modalContext = useModalContext();
@@ -107,11 +109,16 @@
     [callLegacyLogIn, modalContext, password, username],
   );
 
+  const callIdentityPasswordLogIn = usePasswordLogIn();
+
   const identityPasswordLogInAction = React.useCallback(async () => {
+    if (identityAuthInProgress) {
+      return;
+    }
+    setIdentityAuthInProgress(true);
     try {
-      const result = await callIdentityPasswordLogIn(username, password);
+      await callIdentityPasswordLogIn(username, password);
       modalContext.popModal();
-      return result;
     } catch (e) {
       setUsername('');
       setPassword('');
@@ -126,8 +133,16 @@
       }
       usernameInputRef.current?.focus();
       throw e;
+    } finally {
+      setIdentityAuthInProgress(false);
     }
-  }, [callIdentityPasswordLogIn, modalContext, password, username]);
+  }, [
+    identityAuthInProgress,
+    callIdentityPasswordLogIn,
+    modalContext,
+    password,
+    username,
+  ]);
 
   const onSubmit = React.useCallback(
     (event: SyntheticEvent<HTMLElement>) => {
@@ -149,10 +164,7 @@
         return;
       }
       if (usingCommServicesAccessToken) {
-        void dispatchActionPromise(
-          identityLogInActionTypes,
-          identityPasswordLogInAction(),
-        );
+        void identityPasswordLogInAction();
       } else {
         void dispatchActionPromise(
           legacyLogInActionTypes,