import { Routes, Route, Navigate } from 'react-router-dom';
import { useAuth } from './context/AuthContext';
import ScrollToTop from './components/ScrollToTop';
import Layout from './components/layout/Layout';
import Login from './pages/Login';
import Dashboard from './pages/Dashboard';
import CustomerList from './pages/customers/CustomerList';
import CustomerDetail from './pages/customers/CustomerDetail';
import CustomerForm from './pages/customers/CustomerForm';
import ContractList from './pages/contracts/ContractList';
import ContractDetail from './pages/contracts/ContractDetail';
import ContractForm from './pages/contracts/ContractForm';
import ContractCockpit from './pages/contracts/ContractCockpit';
import TaskList from './pages/tasks/TaskList';
import PlatformList from './pages/platforms/PlatformList';
import CancellationPeriodList from './pages/settings/CancellationPeriodList';
import ContractDurationList from './pages/settings/ContractDurationList';
import ProviderList from './pages/settings/ProviderList';
import ContractCategoryList from './pages/settings/ContractCategoryList';
import ViewSettings from './pages/settings/ViewSettings';
import PortalSettings from './pages/settings/PortalSettings';
import DeadlineSettings from './pages/settings/DeadlineSettings';
import EmailProviders from './pages/settings/EmailProviders';
import DatabaseBackup from './pages/settings/DatabaseBackup';
import UserList from './pages/users/UserList';
import Settings from './pages/Settings';
import DatabaseStructure from './pages/developer/DatabaseStructure';

function ProtectedRoute({ children }: { children: React.ReactNode }) {
  const { isAuthenticated, isLoading } = useAuth();

  if (isLoading) {
    return (
      <div className="min-h-screen flex items-center justify-center">
        <div className="text-gray-500">Laden...</div>
      </div>
    );
  }

  if (!isAuthenticated) {
    return <Navigate to="/login" replace />;
  }

  return <>{children}</>;
}

function DeveloperRoute({ children }: { children: React.ReactNode }) {
  const { hasPermission, developerMode } = useAuth();

  // Require both developer permission AND developer mode enabled
  if (!hasPermission('developer:access') || !developerMode) {
    return <Navigate to="/" replace />;
  }

  return <>{children}</>;
}

function App() {
  const { isAuthenticated, isLoading } = useAuth();

  if (isLoading) {
    return (
      <div className="min-h-screen flex items-center justify-center">
        <div className="text-gray-500">Laden...</div>
      </div>
    );
  }

  return (
    <>
      <ScrollToTop />
      <Routes>
        <Route
          path="/login"
        element={isAuthenticated ? <Navigate to="/" replace /> : <Login />}
      />

      <Route
        path="/"
        element={
          <ProtectedRoute>
            <Layout />
          </ProtectedRoute>
        }
      >
        <Route index element={<Dashboard />} />

        {/* Customers */}
        <Route path="customers" element={<CustomerList />} />
        <Route path="customers/new" element={<CustomerForm />} />
        <Route path="customers/:id" element={<CustomerDetail />} />
        <Route path="customers/:id/edit" element={<CustomerForm />} />

        {/* Contracts */}
        <Route path="contracts" element={<ContractList />} />
        <Route path="contracts/cockpit" element={<ContractCockpit />} />
        <Route path="contracts/new" element={<ContractForm />} />
        <Route path="contracts/:id" element={<ContractDetail />} />
        <Route path="contracts/:id/edit" element={<ContractForm />} />

        {/* Tasks / Support-Anfragen */}
        <Route path="tasks" element={<TaskList />} />

        {/* Settings */}
        <Route path="settings" element={<Settings />} />
        <Route path="settings/users" element={<UserList />} />
        <Route path="settings/platforms" element={<PlatformList />} />
        <Route path="settings/cancellation-periods" element={<CancellationPeriodList />} />
        <Route path="settings/contract-durations" element={<ContractDurationList />} />
        <Route path="settings/providers" element={<ProviderList />} />
        <Route path="settings/contract-categories" element={<ContractCategoryList />} />
        <Route path="settings/view" element={<ViewSettings />} />
        <Route path="settings/portal" element={<PortalSettings />} />
        <Route path="settings/deadlines" element={<DeadlineSettings />} />
        <Route path="settings/email-providers" element={<EmailProviders />} />
        <Route path="settings/database-backup" element={<DatabaseBackup />} />

        {/* Redirect old users route */}
        <Route path="users" element={<Navigate to="/settings/users" replace />} />

        {/* Redirect old platforms route */}
        <Route path="platforms" element={<Navigate to="/settings/platforms" replace />} />

        {/* Developer */}
        <Route path="developer/database" element={<DeveloperRoute><DatabaseStructure /></DeveloperRoute>} />
      </Route>

        <Route path="*" element={<Navigate to="/" replace />} />
      </Routes>
    </>
  );
}

export default App;