[native] Show loading spinner during getOlmSessionInitializationData …

…server call

Summary: This diff addresses [ENG-4604](https://linear.app/comm/issue/ENG-4604/delay-before-spinner-starts-spinning-on-mobile-log-in).

Test Plan:
{F679488}

Note that there is a bit of a stutter when the first `loadingSelector` finishes, since the second one doesn't overlap with the first. I decided that this was okay for now... we'll end up needing to change things here pretty soon anyways, since these keys will get fetched from the identity service instead of the keyserver in the near future.

Reviewers: atul, marcin, ginsu

Reviewed By: ginsu

Subscribers: tomek

Differential Revision: https://phab.comm.dev/D8762

native/account/log-in-panel.react.js

@@ -5,8 +5,15 @@ import * as React from 'react';
 import { View, StyleSheet, Keyboard, Platform } from 'react-native';
 import Animated from 'react-native-reanimated';
 
-import { logInActionTypes, logIn } from 'lib/actions/user-actions.js';
-import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
+import {
+  logInActionTypes,
+  logIn,
+  getOlmSessionInitializationDataActionTypes,
+} from 'lib/actions/user-actions.js';
+import {
+  createLoadingStatusSelector,
+  combineLoadingStatuses,
+} from 'lib/selectors/loading-selectors.js';
 import {
   validEmailRegex,
   oldValidUsernameRegex,
@@ -354,11 +361,21 @@ const styles = StyleSheet.create({
   },
 });
 
-const loadingStatusSelector = createLoadingStatusSelector(logInActionTypes);
+const logInLoadingStatusSelector =
+  createLoadingStatusSelector(logInActionTypes);
+const olmSessionInitializationDataLoadingStatusSelector =
+  createLoadingStatusSelector(getOlmSessionInitializationDataActionTypes);
 
 const ConnectedLogInPanel: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedLogInPanel(props: BaseProps) {
-    const loadingStatus = useSelector(loadingStatusSelector);
+    const logInLoadingStatus = useSelector(logInLoadingStatusSelector);
+    const olmSessionInitializationDataLoadingStatus = useSelector(
+      olmSessionInitializationDataLoadingStatusSelector,
+    );
+    const loadingStatus = combineLoadingStatuses(
+      logInLoadingStatus,
+      olmSessionInitializationDataLoadingStatus,
+    );
 
     const navContext = React.useContext(NavContext);
     const logInExtraInfo = useSelector(state =>

native/account/register-panel.react.js

@@ -14,8 +14,15 @@ import Animated from 'react-native-reanimated';
 import { useDispatch } from 'react-redux';
 
 import { setDataLoadedActionType } from 'lib/actions/client-db-store-actions.js';
-import { registerActionTypes, register } from 'lib/actions/user-actions.js';
-import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
+import {
+  registerActionTypes,
+  register,
+  getOlmSessionInitializationDataActionTypes,
+} from 'lib/actions/user-actions.js';
+import {
+  createLoadingStatusSelector,
+  combineLoadingStatuses,
+} from 'lib/selectors/loading-selectors.js';
 import { validUsernameRegex } from 'lib/shared/account-utils.js';
 import type {
   RegisterInfo,
@@ -458,11 +465,21 @@ const styles = StyleSheet.create({
   },
 });
 
-const loadingStatusSelector = createLoadingStatusSelector(registerActionTypes);
+const registerLoadingStatusSelector =
+  createLoadingStatusSelector(registerActionTypes);
+const olmSessionInitializationDataLoadingStatusSelector =
+  createLoadingStatusSelector(getOlmSessionInitializationDataActionTypes);
 
 const ConnectedRegisterPanel: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedRegisterPanel(props: BaseProps) {
-    const loadingStatus = useSelector(loadingStatusSelector);
+    const registerLoadingStatus = useSelector(registerLoadingStatusSelector);
+    const olmSessionInitializationDataLoadingStatus = useSelector(
+      olmSessionInitializationDataLoadingStatusSelector,
+    );
+    const loadingStatus = combineLoadingStatuses(
+      registerLoadingStatus,
+      olmSessionInitializationDataLoadingStatus,
+    );
 
     const navContext = React.useContext(NavContext);
     const logInExtraInfo = useSelector(state =>