style: Remove view controls for improved layout consistency and simplify app structure

This commit is contained in:
MayaTheShy
2026-02-20 03:05:22 -05:00
parent 0b61d8b2dd
commit daaf969662

View File

@@ -12,7 +12,6 @@ import './App.css';
function App() { function App() {
const connect = useTurtleStore((state) => state.connect); const connect = useTurtleStore((state) => state.connect);
const [view, setView] = useState('split'); // 'split', 'map', 'panel'
const [panelTab, setPanelTab] = useState('control'); // 'control', 'voice', 'stats', 'groups', 'tasks', 'paths', 'areas' const [panelTab, setPanelTab] = useState('control'); // 'control', 'voice', 'stats', 'groups', 'tasks', 'paths', 'areas'
const turtles = useTurtleStore((state) => state.getTurtleArray()); const turtles = useTurtleStore((state) => state.getTurtleArray());
const selectedTurtle = useTurtleStore((state) => state.getSelectedTurtle()); const selectedTurtle = useTurtleStore((state) => state.getSelectedTurtle());
@@ -47,35 +46,11 @@ function App() {
return ( return (
<div className="app"> <div className="app">
<div className="view-controls"> <div className="app-content split">
<button <div className="map-container">
className={view === 'split' ? 'active' : ''} <Map3D />
onClick={() => setView('split')} </div>
> <div className="panel-container">
📊 Split View
</button>
<button
className={view === 'map' ? 'active' : ''}
onClick={() => setView('map')}
>
🗺 Map Only
</button>
<button
className={view === 'panel' ? 'active' : ''}
onClick={() => setView('panel')}
>
🎮 Control Only
</button>
</div>
<div className={`app-content ${view}`}>
{(view === 'split' || view === 'map') && (
<div className="map-container">
<Map3D />
</div>
)}
{(view === 'split' || view === 'panel') && (
<div className="panel-container">
<div className="panel-tabs"> <div className="panel-tabs">
<button <button
className={panelTab === 'control' ? 'active' : ''} className={panelTab === 'control' ? 'active' : ''}
@@ -131,7 +106,6 @@ function App() {
{renderPanelContent()} {renderPanelContent()}
</div> </div>
</div> </div>
)}
</div> </div>
</div> </div>
); );