49 lines
1.3 KiB
TypeScript
49 lines
1.3 KiB
TypeScript
import React, { useState, useEffect } from 'react';
|
|
import NodeEditor from './components/NodeEditor';
|
|
import PreviewPane from './components/PreviewPane';
|
|
import NodePanel from './components/NodePanel';
|
|
import './App.css';
|
|
|
|
function App() {
|
|
const [activeTab, setActiveTab] = useState<'editor' | 'preview'>('editor');
|
|
|
|
return (
|
|
<div className="app">
|
|
<header className="app-header">
|
|
<h1>ComfyUI Rust - AMD GPU Accelerated</h1>
|
|
<p>Image Generation with ROCm Support for RX 9070 XT</p>
|
|
</header>
|
|
|
|
<div className="main-content">
|
|
<div className="sidebar">
|
|
<NodePanel />
|
|
</div>
|
|
|
|
<div className="editor-area">
|
|
<div className="tabs">
|
|
<button
|
|
className={activeTab === 'editor' ? 'active' : ''}
|
|
onClick={() => setActiveTab('editor')}
|
|
>
|
|
Node Editor
|
|
</button>
|
|
<button
|
|
className={activeTab === 'preview' ? 'active' : ''}
|
|
onClick={() => setActiveTab('preview')}
|
|
>
|
|
Preview
|
|
</button>
|
|
</div>
|
|
|
|
{activeTab === 'editor' ? (
|
|
<NodeEditor />
|
|
) : (
|
|
<PreviewPane />
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default App; |