JAVASCRIPT

Error: [ProtectedRoute] is not a component

<Route path='/profile' element={<PrivateRoute/>}>
  <Route path='/profile' element={<Home/>}/> // inner/nested route
</Route>


// Your PrivateRoute Component should look like this
import React from 'react';
import { Navigate, Outlet } from 'react-router-dom';
import { auth } from '*somewhere*';

const PrivateRoute = () => {
  const { userLoggedIn } = auth();
  if (userLoggedIn) {
    return <Outlet />; // i.e continue to the inner/nested route
  } else {
    return <Navigate to="/login" />;
  }
  
  // same thing as 
  // 'return userLoggedIn ? <Outlet /> : <Navigate to="/login" />;'
}