"use client";

import { useState } from "react";
import { CalendarIcon } from "lucide-react";
import { BookingSystem } from "./BookingSystem";
import { User } from "@repo/db";

interface BookingButtonProps {
	currentUser: User;
}

export const BookingButton = ({ currentUser }: BookingButtonProps) => {
	const [isBookingSystemOpen, setIsBookingSystemOpen] = useState(false);

	// Check if user can access booking system
	const canAccessBookingSystem = currentUser && currentUser.emailVerified && !currentUser.isBanned;

	// Don't render the button if user doesn't have access
	if (!canAccessBookingSystem) {
		return null;
	}

	return (
		<>
			<button
				className="btn btn-sm btn-ghost tooltip tooltip-bottom"
				data-tip="Slot Buchung"
				onClick={() => setIsBookingSystemOpen(true)}
			>
				<CalendarIcon size={20} />
			</button>

			<BookingSystem
				isOpen={isBookingSystemOpen}
				onClose={() => setIsBookingSystemOpen(false)}
				currentUser={currentUser}
			/>
		</>
	);
};