import React, { useState, useEffect } from 'react';
import Navbar from './components/Navbar';
import Hero from './components/Hero';
import Inspiration from './components/Inspiration';
import Methodology from './components/Methodology';
import Services from './components/Services';
import Pricing from './components/Pricing';
import FAQ from './components/FAQ';
import Footer from './components/Footer';
import AdminLogin from './components/AdminLogin';
import AdminPanel from './components/AdminPanel';
import MoreBooks from './pages/MoreBooks';
import CommunityPage from './pages/CommunityPage';
import ServicesPage from './pages/ServicesPage';
import PersonalizedBooksPage from './pages/PersonalizedBooksPage';
import TermsPage from './pages/TermsPage';
import PrivacyPage from './pages/PrivacyPage';
import ProceduresPage from './pages/ProceduresPage';
import TechnologyPage from './pages/TechnologyPage';
import MyProductsPage from './pages/MyProductsPage';
import CuceaLandingPage from './pages/CuceaLandingPage';
import ImageSearch from './components/ImageSearch';

type PageType = 'home' | 'more-books' | 'community' | 'services' | 'personalized-books' | 'terms' | 'privacy' | 'procedures' | 'technology' | 'my-products' | 'cucea' | 'images';

function App() {
  const [showAdminLogin, setShowAdminLogin] = useState(false);
  const [isAdminAuthenticated, setIsAdminAuthenticated] = useState(false);
  const [currentPage, setCurrentPage] = useState<PageType>('home');
  const [config, setConfig] = useState(() => {
    const savedConfig = localStorage.getItem('appConfig');
    return savedConfig ? JSON.parse(savedConfig) : {
      youtubeVideoId: 'fZ-gX1KszAM',
      inspirationFormUrl: 'https://forms.gle/GLGjhri8bNc3gf5f6',
      moreBooks: {
        comedy: {
          youtubeVideoId: 'fZ-gX1KszAM',
          webhookUrl: 'https://hook.us2.make.com/your-webhook-url'
        },
        suspense: {
          youtubeVideoId: 'fZ-gX1KszAM',
          webhookUrl: 'https://hook.us2.make.com/your-webhook-url'
        },
        drama: {
          youtubeVideoId: 'fZ-gX1KszAM',
          webhookUrl: 'https://hook.us2.make.com/your-webhook-url'
        },
        psychological: {
          youtubeVideoId: 'fZ-gX1KszAM',
          webhookUrl: 'https://hook.us2.make.com/your-webhook-url'
        }
      }
    };
  });

  useEffect(() => {
    localStorage.setItem('appConfig', JSON.stringify(config));
  }, [config]);

  const handleAdminLogin = () => {
    setIsAdminAuthenticated(true);
    setShowAdminLogin(false);
  };

  const handleConfigUpdate = (newConfig: any) => {
    setConfig(newConfig);
    setIsAdminAuthenticated(false);
  };

  if (showAdminLogin) {
    return <AdminLogin onLogin={handleAdminLogin} />;
  }

  if (isAdminAuthenticated) {
    return <AdminPanel initialConfig={config} onSave={handleConfigUpdate} />;
  }

  switch (currentPage) {
    case 'terms':
      return <TermsPage />;
    case 'privacy':
      return <PrivacyPage />;
    case 'procedures':
      return <ProceduresPage />;
    case 'services':
      return <ServicesPage />;
    case 'personalized-books':
      return <PersonalizedBooksPage />;
    case 'technology':
      return <TechnologyPage />;
    case 'my-products':
      return <MyProductsPage />;
    case 'cucea':
      return <CuceaLandingPage />;
    case 'images':
      return <ImageSearch />;
    case 'more-books':
      return (
        <>
          <Navbar onNavigate={setCurrentPage} />
          <MoreBooks config={config.moreBooks} />
          <Footer onAdminClick={() => setShowAdminLogin(false)} onNavigate={setCurrentPage} />
        </>
      );
    case 'community':
      return (
        <>
          <Navbar onNavigate={setCurrentPage} />
          <CommunityPage />
          <Footer onAdminClick={() => setShowAdminLogin(false)} onNavigate={setCurrentPage} />
        </>
      );
    default:
      return (
        <div className="bg-gray-900 text-white font-sans antialiased">
          <Navbar onNavigate={setCurrentPage} />
          <Hero />
          <Inspiration formUrl={config.inspirationFormUrl} />
          <Methodology />
          <Services />
          <Pricing />
          <FAQ />
          <Footer onAdminClick={() => setShowAdminLogin(false)} onNavigate={setCurrentPage} />
        </div>
      );
  }
}

export default App;