App.tsx

import React, { useState, useEffect } from 'react';
import { HashRouter, Routes, Route, Navigate, useLocation } from 'react-router-dom';
import Sidebar from './components/Sidebar';
import Header from './components/Header';
import Dashboard from './pages/Dashboard';
import ContentManagement from './pages/ContentManagement';
import OrderManagement from './pages/OrderManagement';
import CustomerManagement from './pages/CustomerManagement';
import CustomerService from './pages/CustomerService';
import InvoiceManagement from './pages/InvoiceManagement';
import StaffManagement from './pages/StaffManagement';
import PermissionsManagement from './pages/PermissionsManagement';
import { ModuleType } from './types';

function getModuleFromPath(pathname: string): ModuleType {
  if (pathname.startsWith('/content')) return ModuleType.CONTENT;
  if (pathname.startsWith('/orders')) return ModuleType.ORDERS;
  if (pathname.startsWith('/customers')) return ModuleType.CUSTOMERS;
  if (pathname.startsWith('/service')) return ModuleType.SERVICE;
  if (pathname.startsWith('/invoices')) return ModuleType.INVOICES;
  if (pathname.startsWith('/staff')) return ModuleType.STAFF;
  if (pathname.startsWith('/permissions')) return ModuleType.PERMISSIONS;
  if (pathname.startsWith('/dashboard')) return ModuleType.DASHBOARD;
  return ModuleType.DASHBOARD;
}

const AppContent: React.FC = () => {
  const location = useLocation();
  const activeModule = getModuleFromPath(location.pathname);
  const [isSidebarOpen, setIsSidebarOpen] = useState(true);

  const [userData, setUserData] = useState({
    name: "Admin",
    location: "Paris, FR",
    weather: "22°C Clear",
    date: new Date().toLocaleDateString('en-US', { weekday: 'long', month: 'long', day: 'numeric' })
  });

  useEffect(() => {
    if ("geolocation" in navigator) {
      navigator.geolocation.getCurrentPosition((position) => {
        setUserData(prev => ({ ...prev, location: `Lat: ${position.coords.latitude.toFixed(1)}, Lng: ${position.coords.longitude.toFixed(1)}` }));
      });
    }
  }, []);

  return (
    <div className="flex h-screen overflow-hidden bg-white">
      <Sidebar 
        activeModule={activeModule} 
        isOpen={isSidebarOpen}
      />
        
        <div className="flex-1 flex flex-col min-w-0 overflow-hidden bg-[#fdfcf9]">
          <Header 
            userData={userData} 
            toggleSidebar={() => setIsSidebarOpen(!isSidebarOpen)}
            isSidebarOpen={isSidebarOpen}
          />
          
          <main className="flex-1 overflow-y-auto p-8 lg:p-10 no-scrollbar">
            <Routes>
              <Route path="/" element={<Navigate to="/dashboard" replace />} />
              <Route path="/dashboard" element={<Dashboard />} />
              
              <Route path="/content" element={<Navigate to="/content/maisons" replace />} />
              <Route path="/content/maisons/new" element={<ContentManagement view="maisons" createNew />} />
              <Route path="/content/maisons/:id/edit" element={<ContentManagement view="maisons" />} />
              <Route path="/content/maisons" element={<ContentManagement view="maisons" />} />
              <Route path="/content/experiences" element={<ContentManagement view="experiences" />} />
              <Route path="/content/services" element={<ContentManagement view="services" />} />
              <Route path="/content/products" element={<ContentManagement view="products" />} />
              <Route path="/content/blog" element={<ContentManagement view="blog" />} />
              <Route path="/content/downloads" element={<ContentManagement view="downloads" />} />
              
              <Route path="/orders" element={<Navigate to="/orders/maisons" replace />} />
              <Route path="/orders/maisons" element={<OrderManagement view="maisons" />} />
              <Route path="/orders/experiences" element={<OrderManagement view="experiences" />} />
              <Route path="/orders/services" element={<OrderManagement view="services" />} />
              <Route path="/orders/products" element={<OrderManagement view="products" />} />
              <Route path="/orders/returns" element={<OrderManagement view="returns" />} />
              
              <Route path="/customers" element={<CustomerManagement />} />
              
              <Route path="/service" element={<Navigate to="/service/checkin" replace />} />
              <Route path="/service/email" element={<CustomerService view="Email" />} />
              <Route path="/service/checkin" element={<CustomerService view="Check-in" />} />
              <Route path="/service/messages" element={<CustomerService view="Messages" />} />
              <Route path="/service/faq" element={<CustomerService view="FAQ" />} />
              
              <Route path="/invoices" element={<Navigate to="/invoices/company" replace />} />
              <Route path="/invoices/company" element={<InvoiceManagement view="Company Invoices" />} />
              <Route path="/invoices/customer" element={<InvoiceManagement view="Customer Invoices" />} />
              <Route path="/invoices/supplier" element={<InvoiceManagement view="Supplier Invoices" />} />
              <Route path="/invoices/procurement" element={<InvoiceManagement view="Procurement Invoices" />} />
              <Route path="/invoices/settings" element={<InvoiceManagement view="Settings" />} />
              
              <Route path="/staff" element={<StaffManagement />} />
              <Route path="/permissions" element={<PermissionsManagement />} />
            </Routes>
          </main>
        </div>
    </div>
  );
};

const App: React.FC = () => (
  <HashRouter>
    <AppContent />
  </HashRouter>
);

export default App;