import { useState, useEffect } from 'react'; import { Server, Play, Square, Terminal, FolderOpen, Settings, Plus, Users as UsersIcon, LogOut, Menu, X, MessageSquare, UserCircle, Shield, Activity, HardDrive, Cpu, BarChart3, Home } from 'lucide-react'; import Console from './components/Console'; import FileManager from './components/FileManager'; import Stats from './components/Stats'; import ServerSettings from './components/ServerSettings'; import CreateServerModal from './components/CreateServerModal'; import Users from './components/Users'; import UserManagement from './components/UserManagement'; import Tickets from './components/Tickets'; import Profile from './components/Profile'; import Daemons from './components/Daemons'; import Auth from './components/Auth'; import ErrorBoundary from './components/ErrorBoundary'; import NotificationSystem, { notify } from './components/NotificationSystem'; import axios from 'axios'; import { API_URL } from './config'; function App() { const [token, setToken] = useState(localStorage.getItem('token')); const [user, setUser] = useState(null); const [servers, setServers] = useState([]); const [selectedServer, setSelectedServer] = useState(null); const [activeTab, setActiveTab] = useState('console'); const [showCreateModal, setShowCreateModal] = useState(false); const [showUserManagement, setShowUserManagement] = useState(false); const [showDaemons, setShowDaemons] = useState(false); const [showTickets, setShowTickets] = useState(false); const [showProfile, setShowProfile] = useState(false); const [connectionError, setConnectionError] = useState(false); const [sidebarOpen, setSidebarOpen] = useState(true); const [currentView, setCurrentView] = useState('dashboard'); useEffect(() => { const urlParams = new URLSearchParams(window.location.search); const callbackToken = urlParams.get('token'); const callbackUsername = urlParams.get('username'); if (callbackToken && callbackUsername) { localStorage.setItem('token', callbackToken); setToken(callbackToken); setUser({ username: callbackUsername }); window.history.replaceState({}, document.title, window.location.pathname); return; } if (token) { loadUser(); loadServers(); const interval = setInterval(loadServers, 5000); return () => clearInterval(interval); } }, [token]); const loadUser = async () => { try { const { data } = await axios.get(`${API_URL}/api/auth/me`, { headers: { Authorization: `Bearer ${token}` } }); setUser(data); } catch (error) { console.error('Ошибка загрузки пользователя:', error); handleLogout(); } }; const loadServers = async () => { try { const { data } = await axios.get(`${API_URL}/api/servers`, { headers: { Authorization: `Bearer ${token}` } }); setServers(data); setConnectionError(false); } catch (error) { console.error('Ошибка загрузки серверов:', error); if (error.response?.status === 401) { handleLogout(); } else { setConnectionError(true); } } }; const handleLogin = async (username, password, isLogin) => { const endpoint = isLogin ? '/api/auth/login' : '/api/auth/register'; const { data } = await axios.post(`${API_URL}${endpoint}`, { username, password }); localStorage.setItem('token', data.access_token); setToken(data.access_token); setUser({ username: data.username, role: data.role }); notify.success(`Добро пожаловать, ${data.username}!`); }; const handleLogout = () => { localStorage.removeItem('token'); setToken(null); setUser(null); setServers([]); setSelectedServer(null); notify.info('Вы вышли из системы'); }; const handleServerAction = async (serverName, action) => { try { await axios.post( `${API_URL}/api/servers/${serverName}/${action}`, {}, { headers: { Authorization: `Bearer ${token}` } } ); notify.success(`Сервер ${action === 'start' ? 'запущен' : 'остановлен'}`); loadServers(); } catch (error) { notify.error(`Ошибка: ${error.response?.data?.detail || error.message}`); } }; if (!token) { return ( ); } return (
{/* Sidebar */} {/* Main content */}
{/* Header */}

{currentView === 'dashboard' && 'Панель управления'} {currentView === 'server' && selectedServer?.displayName} {currentView === 'management' && 'Управление пользователями'} {currentView === 'daemons' && 'Управление демонами'} {currentView === 'tickets' && 'Тикеты поддержки'} {currentView === 'profile' && 'Профиль'}

{currentView === 'server' && selectedServer && (

{selectedServer.name} • {selectedServer.status === 'running' ? 'Запущен' : 'Остановлен'}

)}
{currentView === 'server' && selectedServer && (
{selectedServer.status === 'stopped' ? ( ) : ( )}
)}
{/* Content area */}
{connectionError && (

⚠️ Ошибка подключения к серверу

)} {currentView === 'dashboard' && (
{servers.length}
Всего серверов
{servers.filter(s => s.status === 'running').length}
Запущено
{servers.filter(s => s.status === 'stopped').length}
Остановлено
{user?.username}
{user?.role}

Ваши серверы

{servers.map((server) => (
{ setSelectedServer(server); setCurrentView('server'); }} className="server-card" >

{server.displayName}

{server.name}

{server.status === 'running' ? 'Запущен' : 'Остановлен'}
{server.status === 'stopped' ? ( ) : ( )}
))}
{servers.length === 0 && (

Нет серверов

Создайте свой первый сервер

)}
)} {currentView === 'server' && selectedServer && (
{/* Tabs */}
{/* Tab content */}
{activeTab === 'console' && } {activeTab === 'files' && } {activeTab === 'stats' && } {activeTab === 'settings' && ( )}
)}
{/* Modals */} {showCreateModal && ( setShowCreateModal(false)} onSuccess={() => { setShowCreateModal(false); loadServers(); }} /> )} {showUserManagement && (
setShowUserManagement(false)}>
e.stopPropagation()}>
)} {showDaemons && (
setShowDaemons(false)}>
e.stopPropagation()}>
)} {showTickets && (
setShowTickets(false)}>
e.stopPropagation()}> setShowTickets(false)} />
)} {showProfile && (
setShowProfile(false)}>
e.stopPropagation()}> setShowProfile(false)} />
)}
); } export default App;