import { useState } from 'react';
import { Toaster } from 'sonner';
import { Layout } from './components/layout/Layout';
import { Dashboard } from './components/dashboard/Dashboard';
import { PlaceholderView } from './components/PlaceholderView';

import { LabelsView } from './components/labels/LabelsView';
import { TrainingView } from './components/training/TrainingView';
import { AlertsView } from './components/alerts/AlertsView';
import { ProductsView } from './components/products/ProductsView';
import { PeopleView } from './components/people/PeopleView';
import { ReportsView } from './components/reports/ReportsView';
import { LocationsView } from './components/locations/LocationsView';
import { SystemMenuView } from './components/system-menu/SystemMenuView';

export default function App() {
  const [currentView, setCurrentView] = useState('Dashboard');

  const renderView = () => {
    switch (currentView) {
      case 'Dashboard':
        return <Dashboard />;
      case 'Training':
        return <TrainingView />;
      case 'Alerts':
        return <AlertsView />;
      case 'Menu Management':
        // 还原：Menu Management 对应“商品管理/新增”页面
        return <ProductsView />;
      case 'System Menu':
        return <SystemMenuView />;
      case 'Account Management':
        return <PeopleView />;
      case 'Reports':
        return <ReportsView />;
      case 'Location Manager':
        return <LocationsView />;
      case 'Labels':
      case 'Label Categories':
      case 'Label Types':
      case 'Label Templates':
      case 'Multiple Options':
        return <LabelsView currentView={currentView} onViewChange={setCurrentView} />;
      default:
        return <PlaceholderView title={currentView} />;
    }
  };

  return (
    <>
      <Layout currentView={currentView} setCurrentView={setCurrentView}>
        {renderView()}
      </Layout>
      <Toaster position="top-center" richColors closeButton expand={false} />
    </>
  );
}