import { BrowserRouter as Router, Route, Routes, Navigate } from 'react-router-dom';
import { ConfigProvider, App as AntApp } from 'antd';
import { App as ContainerApp } from './pages/container';
import { App as PanelApp } from './pages/panel';
import { App as PublishApp } from './pages/publish';
import { App as CodeEditorApp } from './pages/code-editor';
import { App as MapApp } from './pages/map';
import { App as PromptApp } from './pages/prompt';
import { App as AiAgentApp } from './pages/ai-agent';
import { App as UserApp } from './pages/user';
import { App as ChatApp } from './pages/chat-manager';
import { App as GitHubApp } from './pages/github';
import { App as UserAppApp } from './pages/app';
import { App as FileApp } from './pages/file';
import { App as OrgApp } from './pages/org';

import '@kevisual/container/container.css';

export const App = () => {
  return (
    <div className='w-full h-full'>
      <ConfigProvider
        theme={{
          token: {},
        }}>
        <Router>
          <Routes>
            <Route path='/' element={<Navigate to='/container/' />} />
            <Route path='/container/*' element={<ContainerApp />} />
            <Route path='/panel/*' element={<PanelApp />} />
            <Route path='/publish/*' element={<PublishApp />} />
            <Route path='/code-editor' element={<CodeEditorApp />} />
            <Route path='/map/*' element={<MapApp />} />
            <Route path='/prompt/*' element={<PromptApp />} />
            <Route path='/agent/*' element={<AiAgentApp />} />
            <Route path='/user/*' element={<UserApp />} />
            <Route path='/org/*' element={<OrgApp />} />
            <Route path='/chat/*' element={<ChatApp />} />
            <Route path='/github/*' element={<GitHubApp />} />
            <Route path='/app/*' element={<UserAppApp />} />
            <Route path='/file/*' element={<FileApp />} />

            <Route path='/404' element={<div>404</div>} />
            <Route path='*' element={<div>404</div>} />
          </Routes>
        </Router>
      </ConfigProvider>
      <div id='for-modal'></div>
    </div>
  );
};