Обработка ошибок из Redux API Call toast

Question

Итак, я пытаюсь найти лучший способ отображения функции ошибки и успеха Toast, когда вызов API запускается из-за редукса.

Мое мышление: создайте действие для вызова API. Если все прошло успешно, я хочу, чтобы экран переключился на домашний экран. Если произойдет сбой, отобразите сообщение в виде Toast.

. Вот как выглядят некоторые из моих действий:

export function getTokenAPI(username, password) {
  return async function action(dispatch) {
    try {
      dispatch({ type: t.AUTH_GET_TOKEN });
      dispatch(setLoading(true));

      const { data } = await API.authGetToken(username, password);
      const { success } = data;


      if (success) {
        const { access_token, refresh_token } = data;

        dispatch(setAccessToken(access_token));

        dispatch(setRefreshToken(refresh_token));

        await dispatch(setLoading(false));
      } else if (!success) {
        const { errorMessage } = data;
        throw Error(errorMessage);
      }
    } catch (e) {
      dispatch(setError(e.message));
      dispatch(setLoading(false));
    }
  };
}

Действие setError устанавливает для клавиши error значениеtrue и устанавливает errorMessage. Вот как выглядит мой экран:

import React from 'react';

import { Container, View, Toast } from 'native-base';
import styles from './styles';

import { connect } from 'react-redux';
import { authActions } from '_ducks/auth';

const LoginScreen = props => {
  const { getToken, navigation } = props;
  const { navigate } = navigation;

  const navigateToHome = () => navigate('Home');

  const handleLogin = async () => {
    const { error, errorMessage } = props;
    await getToken('sample', 'pass123');
    if (error) {
      Toast.show({
        text: errorMessage,
        buttonText: 'kay',
      });
    } else {
      navigateToHome();
    }
  };

  return (
    <Container>
      <View style={styles.container}>
        <LoginButton onPress={handleLogin} />
      </View>
    </Container>
  );
};

const mapDispatchToProps = dispatch => ({
  getToken: () => dispatch(authActions.getTokenAPI()),
});

const mapStateToProps = state => ({
  isLoading: state.authReducer.isLoading,
  error: state.authReducer.error,
  errorMessage: state.authReducer.errorMessage,
});

export default connect(
  mapStateToProps,
  mapDispatchToProps,
)(LoginScreen);

Итак, если есть ошибка, отобразите тост. Если все прошло успешно, перейдите на главный экран. По сути, error не будет true достаточно быстрым, чтобы проверка в handleLogin работала надлежащим образом.

Есть какие-либо рекомендации по шаблону или процессу? Должен ли я использовать useEffect хук здесь?