text: import React, { useEffect } from "react";
  import "./App.css";
  import { Route, Switch, Redirect } from "react-router-dom";
  import HomePage from "./pages/HomePage/HomePage";
  import ShopPage from "./pages/ShopPage/ShopPage";
  import Header from "./components/Header/Header";
  import UserLoginPage from "./pages/UserLoginPage/UserLoginPage";
  import { auth, createUserProfileDocument } from "./firebase/firebase.utils";
  import { connect } from "react-redux";
  import { setCurrentUser } from "./redux/user/userActions";
  
  function App({ setCurrentUser , currentUser }) {
    useEffect(() => {
      const unsubscribeFromAuth = auth.onAuthStateChanged(async (userAuth) => {
        console.log(userAuth);
        if (userAuth) {
          if (
            userAuth.metadata.creationTime === userAuth.metadata.lastSignInTime
          ) {
            return;
          }
          const userRef = await createUserProfileDocument(userAuth, {});
  
          userRef.onSnapshot((snapShot) => {
            setCurrentUser({ id: snapShot.id, ...snapShot.data() });
          });
        }
        setCurrentUser(userAuth);
      });
      return () => {
        unsubscribeFromAuth();
      };
    }, [setCurrentUser]);
  
    return (
      <div>
        <Header />
        <Switch>
          <Route exact path="/" component={HomePage} />
          <Route path="/shop" component={ShopPage} />
          <Route exact path="/signin" render={()=> currentUser ? (<Redirect to="/"/>): (<UserLoginPage/>) } />
        </Switch>
      </div>
    );
  }
  
  const mapStateToProps = ({ user }) => ({
    currentUser: user.currentUser,
  });
  
  const mapDispatchToProps = (dispatch) => ({
    setCurrentUser: (user) => dispatch(setCurrentUser(user)),
  });
  
  export default connect(mapStateToProps, mapDispatchToProps)(App);
  