47 lines
1.7 KiB
JavaScript
47 lines
1.7 KiB
JavaScript
import React, { useState } from 'react';
|
|
import Sidebar from './components/Sidebar';
|
|
import TenantManager from './components/TenantManager';
|
|
import EndpointManager from './components/EndpointManager';
|
|
import DebugTabs from './components/DebugTabs';
|
|
import Auth from './components/Auth';
|
|
import Settings from './components/Settings';
|
|
import './index.css';
|
|
|
|
function App() {
|
|
const [activeTab, setActiveTab] = useState('debug');
|
|
const [showSettings, setShowSettings] = useState(false);
|
|
const [user, setUser] = useState(() => {
|
|
const saved = localStorage.getItem('api_debug_user');
|
|
return saved ? JSON.parse(saved) : null;
|
|
});
|
|
|
|
const handleLogout = () => {
|
|
localStorage.removeItem('api_debug_token');
|
|
localStorage.removeItem('api_debug_user');
|
|
setUser(null);
|
|
};
|
|
|
|
if (!user) {
|
|
return <Auth onLogin={setUser} />;
|
|
}
|
|
|
|
return (
|
|
<div className="app-container">
|
|
<Sidebar
|
|
currentTab={activeTab}
|
|
setTab={setActiveTab}
|
|
onLogout={handleLogout}
|
|
onSettings={() => setShowSettings(true)}
|
|
/>
|
|
<main className="main-content" style={{ display: 'flex', flexDirection: 'column' }}>
|
|
<div style={{ display: activeTab === 'tenants' ? 'flex' : 'none', flexDirection: 'column', flex: 1, minHeight: 0 }}><TenantManager /></div>
|
|
<div style={{ display: activeTab === 'endpoints' ? 'flex' : 'none', flexDirection: 'column', flex: 1, minHeight: 0 }}><EndpointManager /></div>
|
|
<div style={{ display: activeTab === 'debug' ? 'flex' : 'none', flexDirection: 'column', flex: 1, minHeight: 0 }}><DebugTabs /></div>
|
|
</main>
|
|
{showSettings && <Settings onClose={() => setShowSettings(false)} />}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default App;
|