15.8.6 로그인/회원가입 오류 처리하기

로그인 또는 회원가입 중에 오류가 발생했을 때 사용자에게 오류 내용을 알려주도록 구현하겠습니다. iOS에서는 Alert, 안드로이드에서는 Toast를 사용합니다.

이를 구현하려면 useMutation의 onError에서 Platform.OS를 확인하여 분기를 태워줘야 하는데요. 유사한 코드가 useLogin, useRegister에서 반복되기 때문에 이를 커스텀 Hook으로 작성하여 관리해주겠습니다.

hooks/useInform.ts

import {useCallback} from 'react';
import {Alert, Platform, ToastAndroid} from 'react-native';

export default function useInform() {
  const inform = useCallback(({title, message}: InformParams) => {
    if (Platform.OS === 'ios') {
        Alert.alert(title ?? '알림', message);
    } else {
      ToastAndroid.show(message, ToastAndroid.SHORT);
    }
  }, []);

  return inform;
}
interface InformParams {
  title?: string;
  message: string;
}