Page 335 - MDP2022-3

const [user, loading, error] = useAuthState(auth);
const [classes, setClasses] = useState([]);

const navigate = useNavigate();

const fetchClasses = async () => {

//실시간으로 파이어베이스에서 데이터 받아서 뿌려주기

try {
await db
.collection("users")

.where("uid", "==", user.uid)
.onSnapshot((snapshot) => {
setClasses(snapshot?.docs[0]?.data()?.enrolledClassrooms);

});
} catch (error) {

console.error(error.message);
}
};

useEffect(() => {

if (loading) return;
if (!user) navigate("/" , { replace: true });
}, [user, loading]);

useEffect(() => {

if (loading) return;
fetchClasses();
}, [user, loading]);

return (

<div className="dashboard">
{classes.length === 0 ? (
<div className="dashboard__404">

No classes found! Join or create one!
</div>

) : (
<div className="dashboard__classContainer">
{classes.map((individualClass) => (