/**
 * TaxiBook Partner - Main App
 * ============================
 * Main application component
 */

const App = () => {
    const [isAuthenticated, setIsAuthenticated] = useState(false);
    const [partner, setPartner] = useState(null);
    const [currentView, setCurrentView] = useState('booking');
    const [packages, setPackages] = useState([]);
    const [vehicles, setVehicles] = useState([]);
    const [bookings, setBookings] = useState([]);
    const [stats, setStats] = useState(null);
    const [toast, setToast] = useState(null);
    const [loading, setLoading] = useState(true);

    // Check existing session
    useEffect(() => {
        const token = localStorage.getItem('partner_token');
        const partnerData = localStorage.getItem('partner_data');
        
        if (token && partnerData) {
            try {
                const parsed = JSON.parse(partnerData);
                setPartner(parsed);
                setIsAuthenticated(true);
                loadData();
            } catch (e) {
                window.partnerAPI.clearAuth();
            }
        }
        setLoading(false);
    }, []);

    const loadData = async () => {
        try {
            const [packagesRes, vehiclesRes, bookingsRes, profileRes] = await Promise.all([
                window.partnerAPI.getPackages(),
                window.partnerAPI.getVehicles(),
                window.partnerAPI.getBookings(),
                window.partnerAPI.getProfile()
            ]);

            if (packagesRes.success) setPackages(packagesRes.data.packages || []);
            if (vehiclesRes.success) setVehicles(vehiclesRes.data.vehicles || []);
            if (bookingsRes.success) setBookings(bookingsRes.data.bookings || []);
            if (profileRes.success) {
                setPartner(profileRes.data.partner);
                setStats(profileRes.data.stats);
            }
        } catch (error) {
            console.error('Error loading data:', error);
            // Si c'est une erreur de session, on déconnecte
            if (error.message === 'Session expirée') {
                setIsAuthenticated(false);
                setPartner(null);
                setToast({ message: 'Session expirée, veuillez vous reconnecter', type: 'error' });
            }
        }
    };

    const handleLogin = (partnerData) => {
        setPartner(partnerData);
        setIsAuthenticated(true);
        loadData();
    };

    const handleLogout = async () => {
        await window.partnerAPI.logout();
        setIsAuthenticated(false);
        setPartner(null);
        setPackages([]);
        setVehicles([]);
        setBookings([]);
    };

    const handleBookingCreated = (booking) => {
        setBookings([booking, ...bookings]);
        loadData(); // Refresh all data
        // Rediriger vers l'onglet Carte après la réservation
        setCurrentView('map');
    };

    const handleCancelBooking = async (uid) => {
        if (!confirm('Voulez-vous vraiment annuler cette réservation ?')) return;
        
        try {
            const result = await window.partnerAPI.cancelBooking(uid);
            if (result.success) {
                setToast({ message: 'Réservation annulée', type: 'success' });
                loadData();
            } else {
                setToast({ message: result.error || 'Erreur', type: 'error' });
            }
        } catch (error) {
            setToast({ message: 'Erreur de connexion', type: 'error' });
        }
    };

    if (loading) {
        return (
            <div className="min-h-screen gradient-bg flex items-center justify-center">
                <Spinner size="lg" />
            </div>
        );
    }

    if (!isAuthenticated) {
        return (
            <>
                <LoginScreen onLogin={handleLogin} toast={toast} setToast={setToast} />
                {toast && <Toast {...toast} onClose={() => setToast(null)} />}
            </>
        );
    }

    return (
        <div className="min-h-screen bg-dark-100">
            <Sidebar
                partner={partner}
                currentView={currentView}
                setCurrentView={setCurrentView}
                onLogout={handleLogout}
            />

            {/* Main Content */}
            <main className="ml-20 lg:ml-64 p-6 lg:p-8">
                <div className="flex gap-8">
                    {/* Main Area */}
                    <div className="flex-1">
                        {currentView === 'booking' && (
                            <BookingView
                                partner={partner}
                                packages={packages}
                                vehicles={vehicles}
                                onBookingCreated={handleBookingCreated}
                                setToast={setToast}
                            />
                        )}
                        {currentView === 'packages' && <PackagesView packages={packages} />}
                        {currentView === 'history' && (
                            <HistoryView
                                bookings={bookings}
                                onCancelBooking={handleCancelBooking}
                                setToast={setToast}
                            />
                        )}
                        {currentView === 'rides' && (
                            <RidesView
                                bookings={bookings}
                                onCancelBooking={handleCancelBooking}
                                setToast={setToast}
                            />
                        )}
                        {currentView === 'map' && (
                            <MapView
                                bookings={bookings}
                                setToast={setToast}
                                onCancelBooking={handleCancelBooking}
                            />
                        )}
                        {currentView === 'minisites' && <MinisitesView partner={partner} setToast={setToast} />}
                        {currentView === 'cards' && <CardsView partner={partner} setToast={setToast} />}
                        {currentView === 'profile' && <ProfileView partner={partner} stats={stats} />}
                    </div>
                </div>
            </main>

            {toast && <Toast {...toast} onClose={() => setToast(null)} />}
        </div>
    );
};

// Render
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />);