import React from "react";
import PropTypes from "prop-types";
import { Route, Redirect } from "react-router-dom";
import Page from "components/Page";
import { useSelector } from "react-redux";

const PrivateRoute = ({
  component: Component,
  title,
  auth,
  model,
  ...rest
}) => {
  const isAuthenticated = useSelector(state => state.auth.isAuthenticated);
  const permissions = useSelector(state => state.auth.permissions);
  return (
    <Route
      {...rest}
      render={props =>
        isAuthenticated ? (
          <Page
            title={title}
            permissions={permissions}
            auth={auth}
            model={model}
          >
            <Component {...props} />
          </Page>
        ) : (
          <Redirect
            to={{
              pathname: "/login"
            }}
          />
        )
      }
    />
  );
};

PrivateRoute.propTypes = {
  location: PropTypes.object
};

export default PrivateRoute;