React Native useContext 값 전달 안됨

import React, { useContext } from 'react';
import {TouchableOpacity, Text} from 'react-native';
import AuthStack from './stack/AuthStack';
import { Spinner } from './components';
import { ProgressProvider, ProgressContext, UserProvider, UserContext } from './contexts';
import MyPage from './MyPage';

const MyPageMain = ({ }) => {
    const { inProgress } = useContext(ProgressContext);
    const { user } = useContext(UserContext);
    alert(user.email);
return(
    <UserProvider>
    <ProgressProvider>
        {user?.uid && user?.email ? <MyPage/> : <AuthStack/> } 
        {inProgress && <Spinner />}
</ProgressProvider>
</UserProvider>
);
}
export default MyPageMain;

에러 났던 코드..
user를 가져오는 부분이 userprovider 안에 있어야 한다고 한다. 코드를 나누니 제대로 된다.

import React, { useContext } from 'react';
import { TouchableOpacity, Text } from 'react-native';
import AuthStack from './stack/AuthStack';
import { Spinner } from './components';
import { ProgressProvider, ProgressContext, UserProvider, UserContext } from './contexts';
import MyPage from './MyPage';

const MyPageMain = () => {
  return (
    <UserProvider>
      <ProgressProvider>
        <MyPageContent />
      </ProgressProvider>
    </UserProvider>
  );
};

const MyPageContent = () => {
  const { inProgress } = useContext(ProgressContext);
  const { user } = useContext(UserContext);
 

  return (
    <>
      {user?.uid && user?.email ? <MyPage /> : <AuthStack />}
      {inProgress && <Spinner />}
    </>
  );
};

export default MyPageMain;