'use client'

import { useSession } from "next-auth/react"
import { Spinner } from "./spinner";

// type AuthContentProps = {
//   loadingSlot?: React.ReactNode;
//   authedSlot: React.ReactNode;
//   unauthSlot: React.ReactNode;
// };

// export default function AuthContent({
//   loadingSlot,
//   authedSlot,
//   unauthSlot,
// }: AuthContentProps) {
//   const { data: session, status } = useSession();

//   if (status === 'loading') {
//     return <>{!!loadingSlot ? loadingSlot : <Spinner></Spinner>}</>
//   }

//   if (status === 'authenticated') {
//     return <>{authedSlot}</>;
//   }

//   return <>{unauthSlot}</>;
// }


import React from "react";
import AccessDeniedScreen from './access-denied-screen';

interface ProtectedRouteProps extends React.PropsWithChildren {
    requiredUserRole: string;
    featureName?: string;
    loading?: React.ReactNode;
    accessDenied?: React.ReactNode;
}

const ProtectedRoute = (props: ProtectedRouteProps) => {
    const { data: session, status } = useSession();

    if (status === 'loading') return (props.loading) ? props.loading : <Spinner></Spinner>;
    if (status !== 'authenticated' || !session.roles || !session.roles.includes(props.requiredUserRole)) {
        return (props?.accessDenied) ? props.accessDenied : AccessDeniedScreen(props.requiredUserRole, props.featureName);
    } else {
        return props.children;
    }

}

export default ProtectedRoute