import React from 'react';
import { Redirect, Route, RouteProps } from 'react-router-dom';
import { IonLoading } from '@ionic/react';
import { useAuth } from '../context/AuthContext';

type Props = RouteProps;

const AdminRoute: React.FC<Props> = ({ component: Component, ...rest }) => {
  const { user, profile, isLoading } = useAuth();

  if (!Component) return null;

  return (
    <Route
      {...rest}
      render={(props) => {
        if (isLoading) {
          return <IonLoading isOpen message="Loading..." />;
        }

        if (!user) {
          return <Redirect to="/auth" />;
        }

        if (!profile?.is_admin) {
          return <Redirect to="/home" />;
        }

        const RouteComponent = Component as React.ComponentType<any>;
        return <RouteComponent {...props} />;
      }}
    />
  );
};

export default AdminRoute;