feat: integrate K.G.One music generation panel
- ConfigManager: add `general.kgone` config block (enabled toggle +
base URL); add `setKGOneManagedByServer()` / `isKGOneServerManaged()`
for managed deployments that supply a `kgone-server.txt` override
- App.tsx: probe for `kgone-server.txt` on startup (Content-Type guard
to avoid Vite SPA fallback false-positive)
- GeneralSettings: new K.G.One section with enable toggle + base URL
input; fields disabled when server-managed
- Toolbar: magic wand button (FaWandMagicSparkles) that toggles the
panel; disabled with reduced opacity when K.G.One is turned off;
mutually exclusive with the Chat panel
- projectStore: add `showKGOnePanel` state + `toggleKGOnePanel` action
- KGOnePanel (new): three-tab panel (Clip / Full Song / Separator)
- Clip: prompt + advanced params → POST /v1/clip/generate → poll
/v1/clip/result → download WAV → AudioPlayer preview
- Full Song: caption + lyrics + advanced params → POST
/v1/fullsong/generate → poll /v1/fullsong/result (live progress %
from nested JSON string) → download MP3 → AudioPlayer preview
- Separator: reads selected audio region from OPFS via
KGAudioFileStorage → POST /v1/separator/separate (multipart) →
poll /v1/separator/result → parallel-download all stem files →
multiple labeled AudioPlayer instances rendered vertically
- Shared: custom AudioPlayer (play/pause, clickable seek bar),
spinner + hint text, error card, AbortController cleanup,
DEBUG_MODE.KGONE-gated REQ/RES console logging
This commit is contained in:
Xiaohan-Tian
+18
-1
@@ -10,6 +10,7 @@ import InstrumentSelection from './components/InstrumentSelection';
|
||||
import ChatBox from './components/ChatBox';
|
||||
import { SettingsPanel } from './components/settings';
|
||||
import LoadingOverlay from './components/common/LoadingOverlay';
|
||||
import KGOnePanel from './components/KGOnePanel';
|
||||
import { useEffect as useEffectReact, useState, useRef } from 'react';
|
||||
import { KGToneBuffersPool } from './core/audio-interface/KGToneBuffersPool';
|
||||
import { KGOfflineRenderer } from './core/audio-interface/KGOfflineRenderer';
|
||||
@@ -26,7 +27,7 @@ function App() {
|
||||
const {
|
||||
refreshStatus,
|
||||
loadProject, showChatBox, showSettings, setShowSettings, initializeFromConfig,
|
||||
showInstrumentSelection
|
||||
showInstrumentSelection, showKGOnePanel
|
||||
} = useProjectStore();
|
||||
|
||||
// Track if app has been initialized to prevent multiple initializations
|
||||
@@ -47,6 +48,21 @@ function App() {
|
||||
// Initialize ConfigManager first to load config.json and user settings
|
||||
await ConfigManager.instance().initialize();
|
||||
|
||||
// Check for kgone-server.txt (managed deployment override)
|
||||
try {
|
||||
const kgoneServerResponse = await fetch(`${import.meta.env.BASE_URL}kgone-server.txt`);
|
||||
const contentType = kgoneServerResponse.headers.get('Content-Type') ?? '';
|
||||
if (kgoneServerResponse.ok && contentType.includes('text/plain')) {
|
||||
const url = (await kgoneServerResponse.text()).trim();
|
||||
if (url) {
|
||||
ConfigManager.instance().setKGOneManagedByServer(url);
|
||||
console.log('K.G.One: server-managed config loaded from kgone-server.txt, base URL:', url);
|
||||
}
|
||||
}
|
||||
} catch {
|
||||
// File not present — user configures manually
|
||||
}
|
||||
|
||||
// Initialize store from config after ConfigManager is ready
|
||||
await initializeFromConfig();
|
||||
|
||||
@@ -134,6 +150,7 @@ function App() {
|
||||
<MainContent />
|
||||
</>
|
||||
)}
|
||||
<KGOnePanel isVisible={showKGOnePanel && !showSettings} />
|
||||
<ChatBox isVisible={showChatBox && !showSettings} />
|
||||
</div>
|
||||
|
||||
|
||||
@@ -0,0 +1,347 @@
|
||||
/* KGOnePanel — mirrors ChatBox layout and style */
|
||||
.kgone-panel {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: var(--chat-box-width);
|
||||
background-color: #2d2d2d;
|
||||
border-left: 1px solid #3a3a3a;
|
||||
flex-shrink: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.kgone-panel.is-hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.kgone-panel-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #3a3a3a;
|
||||
height: 40px;
|
||||
border-bottom: 1px solid #4a4a4a;
|
||||
padding: 0 15px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.kgone-panel-header h3 {
|
||||
color: #e0e0e0;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Tab switcher */
|
||||
.kgone-tabs {
|
||||
display: flex;
|
||||
background-color: #2d2d2d;
|
||||
border-bottom: 1px solid #3a3a3a;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.kgone-tab {
|
||||
flex: 1;
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-bottom: 2px solid transparent;
|
||||
color: #999;
|
||||
font-size: 11px;
|
||||
font-weight: 500;
|
||||
padding: 8px 4px;
|
||||
cursor: pointer;
|
||||
transition: color 0.15s, border-color 0.15s;
|
||||
}
|
||||
|
||||
.kgone-tab:hover {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.kgone-tab.active {
|
||||
color: #e0e0e0;
|
||||
border-bottom-color: #7a9cff;
|
||||
}
|
||||
|
||||
/* Scrollable body */
|
||||
.kgone-panel-body {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
/* Field groups */
|
||||
.kgone-field {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.kgone-label {
|
||||
color: #aaa;
|
||||
font-size: 11px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.kgone-input,
|
||||
.kgone-textarea,
|
||||
.kgone-select {
|
||||
background-color: #3a3a3a;
|
||||
border: 1px solid #4a4a4a;
|
||||
border-radius: 4px;
|
||||
color: #e0e0e0;
|
||||
font-size: 12px;
|
||||
padding: 6px 8px;
|
||||
outline: none;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.kgone-input:focus,
|
||||
.kgone-textarea:focus,
|
||||
.kgone-select:focus {
|
||||
border-color: #5a6aaa;
|
||||
}
|
||||
|
||||
.kgone-textarea {
|
||||
resize: vertical;
|
||||
min-height: 60px;
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.kgone-input::placeholder,
|
||||
.kgone-textarea::placeholder {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* Hint text below textarea */
|
||||
.kgone-hint {
|
||||
color: #666;
|
||||
font-size: 10px;
|
||||
line-height: 1.4;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
/* Two-column row (e.g. note + scale) */
|
||||
.kgone-row {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.kgone-row .kgone-field {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* Advanced expander */
|
||||
.kgone-expander-toggle {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #888;
|
||||
font-size: 11px;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
.kgone-expander-toggle:hover {
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.kgone-expander-toggle .arrow {
|
||||
font-size: 9px;
|
||||
transition: transform 0.15s;
|
||||
}
|
||||
|
||||
.kgone-expander-toggle .arrow.open {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.kgone-expander-body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
padding: 8px 0 0 0;
|
||||
}
|
||||
|
||||
/* Separator tab */
|
||||
.kgone-separator-hint {
|
||||
color: #888;
|
||||
font-size: 11px;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
padding: 20px 8px;
|
||||
background-color: #252525;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.kgone-region-info {
|
||||
background-color: #252525;
|
||||
border: 1px solid #3a3a3a;
|
||||
border-radius: 6px;
|
||||
padding: 8px 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.kgone-region-info-label {
|
||||
color: #777;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.kgone-region-info-value {
|
||||
color: #e0e0e0;
|
||||
font-size: 11px;
|
||||
font-weight: 500;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
/* Generate / Separate button */
|
||||
.kgone-btn-generate {
|
||||
background-color: #4a5fa0;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
color: #e0e0e0;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
padding: 8px 12px;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
margin-top: 6px;
|
||||
transition: background-color 0.15s;
|
||||
}
|
||||
|
||||
.kgone-btn-generate:hover:not(:disabled) {
|
||||
background-color: #5a70b8;
|
||||
}
|
||||
|
||||
.kgone-btn-generate:disabled {
|
||||
background-color: #3a3a3a;
|
||||
color: #666;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* ── Audio player ──────────────────────────────────────────────────────────── */
|
||||
.kgone-audio-player {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
background-color: #252525;
|
||||
border: 1px solid #3a3a3a;
|
||||
border-radius: 6px;
|
||||
padding: 8px 10px;
|
||||
}
|
||||
|
||||
.kgone-player-play-btn {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #e0e0e0;
|
||||
cursor: pointer;
|
||||
font-size: 13px;
|
||||
padding: 2px 4px;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.kgone-player-play-btn:hover {
|
||||
color: #7a9cff;
|
||||
}
|
||||
|
||||
.kgone-player-progress-track {
|
||||
flex: 1;
|
||||
height: 4px;
|
||||
background-color: #3a3a3a;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.kgone-player-progress-track:hover {
|
||||
height: 6px;
|
||||
margin-top: -1px;
|
||||
}
|
||||
|
||||
.kgone-player-progress-fill {
|
||||
height: 100%;
|
||||
background-color: #7a9cff;
|
||||
border-radius: 2px;
|
||||
pointer-events: none;
|
||||
transition: width 0.1s linear;
|
||||
}
|
||||
|
||||
.kgone-player-time {
|
||||
color: #888;
|
||||
font-size: 10px;
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* ── Generation state feedback ─────────────────────────────────────────────── */
|
||||
.kgone-gen-hint {
|
||||
color: #888;
|
||||
font-size: 10px;
|
||||
text-align: center;
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
.kgone-error-msg {
|
||||
color: #e07a7a;
|
||||
font-size: 11px;
|
||||
background-color: #2a1a1a;
|
||||
border: 1px solid #5a2a2a;
|
||||
border-radius: 4px;
|
||||
padding: 6px 8px;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
/* Spinner on button */
|
||||
.kgone-spinner {
|
||||
animation: kgone-spin 0.8s linear infinite;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
@keyframes kgone-spin {
|
||||
from { transform: rotate(0deg); }
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* Stem players (Separator tab) */
|
||||
.kgone-stems {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.kgone-stem-player {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
/* Checkbox row (instrumental toggle) */
|
||||
.kgone-checkbox-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.kgone-checkbox-row input[type="checkbox"] {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
accent-color: #7a9cff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.kgone-checkbox-row label {
|
||||
color: #aaa;
|
||||
font-size: 11px;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -16,7 +16,7 @@ import {
|
||||
} from 'react-icons/fa';
|
||||
import { KGProject, type KeySignature } from '../core/KGProject';
|
||||
import { plainToInstance } from 'class-transformer';
|
||||
import { FaPencil, FaCopy, FaPaste, FaTrash } from 'react-icons/fa6';
|
||||
import { FaPencil, FaCopy, FaPaste, FaTrash, FaWandMagicSparkles } from 'react-icons/fa6';
|
||||
import { KGMainContentState } from '../core/state/KGMainContentState';
|
||||
import { regionDeleteManager } from '../util/regionDeleteUtil';
|
||||
import { handleCopyOperation, handlePasteOperation } from '../util/copyPasteUtil';
|
||||
@@ -28,6 +28,7 @@ import FileImportModal from './common/FileImportModal';
|
||||
import OpenProjectModal from './common/OpenProjectModal';
|
||||
import { clearChatHistoryAndUI } from '../util/chatUtil';
|
||||
import PianoIcon from './common/icons/PianoIcon';
|
||||
import { ConfigManager } from '../core/config/ConfigManager';
|
||||
|
||||
const Toolbar: React.FC = () => {
|
||||
const {
|
||||
@@ -40,7 +41,7 @@ const Toolbar: React.FC = () => {
|
||||
barWidthMultiplier, setBarWidthMultiplier,
|
||||
isLooping, toggleLoop,
|
||||
canUndo, canRedo, undoDescription, redoDescription, undo, redo,
|
||||
toggleChatBox, toggleSettings, cleanupProjectState,
|
||||
toggleChatBox, toggleSettings, toggleKGOnePanel, showKGOnePanel, cleanupProjectState,
|
||||
// Piano roll state/actions
|
||||
showPianoRoll, setShowPianoRoll, activeRegionId, setActiveRegionId,
|
||||
// Selection state
|
||||
@@ -740,6 +741,16 @@ const Toolbar: React.FC = () => {
|
||||
setStatus("Settings toggled");
|
||||
};
|
||||
|
||||
// K.G.One panel toggle
|
||||
const isKGOneEnabled = ConfigManager.instance().get('general.kgone.enabled') as boolean ?? false;
|
||||
|
||||
const handleKGOneClick = () => {
|
||||
if (DEBUG_MODE.TOOLBAR) {
|
||||
console.log("K.G.One button clicked");
|
||||
}
|
||||
toggleKGOnePanel();
|
||||
};
|
||||
|
||||
// Handle Piano button click: open piano roll if closed, targeting active or selected region
|
||||
const handlePianoButtonClick = () => {
|
||||
if (DEBUG_MODE.TOOLBAR) {
|
||||
@@ -916,6 +927,15 @@ const Toolbar: React.FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
<button title="Settings" onClick={handleSettingsClick}><FaCog /></button>
|
||||
<button
|
||||
title={isKGOneEnabled ? 'K.G.One Music Generator' : 'K.G.One integration is disabled — enable it in Settings'}
|
||||
onClick={handleKGOneClick}
|
||||
disabled={!isKGOneEnabled}
|
||||
className={showKGOnePanel ? 'active' : ''}
|
||||
style={!isKGOneEnabled ? { opacity: 0.4, cursor: 'not-allowed' } : undefined}
|
||||
>
|
||||
<FaWandMagicSparkles />
|
||||
</button>
|
||||
<button title="Chat" onClick={handleChatClick}><FaComments /></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -18,6 +18,9 @@ const GeneralSettings: React.FC = () => {
|
||||
const [compatibleBaseUrl, setCompatibleBaseUrl] = useState<string>('');
|
||||
const [compatibleModel, setCompatibleModel] = useState<string>('');
|
||||
const [soundfontBaseUrl, setSoundfontBaseUrl] = useState<string>('');
|
||||
const [kgoneEnabled, setKgoneEnabled] = useState<boolean>(false);
|
||||
const [kgoneBaseUrl, setKgoneBaseUrl] = useState<string>('');
|
||||
const [kgoneServerManaged, setKgoneServerManaged] = useState<boolean>(false);
|
||||
|
||||
const configManager = ConfigManager.instance();
|
||||
|
||||
@@ -58,6 +61,9 @@ const GeneralSettings: React.FC = () => {
|
||||
setCompatibleBaseUrl((configManager.get('general.openai_compatible.base_url') as string) || '');
|
||||
setCompatibleModel((configManager.get('general.openai_compatible.model') as string) || '');
|
||||
setSoundfontBaseUrl((configManager.get('general.soundfont.base_url') as string) || '');
|
||||
setKgoneEnabled((configManager.get('general.kgone.enabled') as boolean) ?? false);
|
||||
setKgoneBaseUrl((configManager.get('general.kgone.base_url') as string) || '');
|
||||
setKgoneServerManaged(configManager.isKGOneServerManaged());
|
||||
};
|
||||
|
||||
loadConfig();
|
||||
@@ -175,6 +181,20 @@ const GeneralSettings: React.FC = () => {
|
||||
debouncedSave('general.soundfont.base_url', value);
|
||||
};
|
||||
|
||||
const handleKgoneEnabledChange = async (value: boolean) => {
|
||||
setKgoneEnabled(value);
|
||||
try {
|
||||
await configManager.set('general.kgone.enabled', value);
|
||||
} catch (error) {
|
||||
console.error('Failed to save K.G.One enabled:', error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleKgoneBaseUrlChange = (value: string) => {
|
||||
setKgoneBaseUrl(value);
|
||||
debouncedSave('general.kgone.base_url', value);
|
||||
};
|
||||
|
||||
// NOTE: Gemini and Claude are not supported yet due to CORS issues.
|
||||
return (
|
||||
<div className="settings-section">
|
||||
@@ -468,6 +488,48 @@ const GeneralSettings: React.FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="settings-group">
|
||||
<h4>K.G.One Settings</h4>
|
||||
|
||||
{kgoneServerManaged && (
|
||||
<div className="settings-help" style={{ fontSize: '12px', color: '#888', marginTop: '4px', marginBottom: '8px' }}>
|
||||
K.G.One configuration is managed by the server (kgone-server.txt). Settings are read-only.
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="settings-item">
|
||||
<label className="settings-label">
|
||||
Enable K.G.One Integration
|
||||
</label>
|
||||
<select
|
||||
className="settings-select"
|
||||
value={kgoneEnabled ? 'true' : 'false'}
|
||||
onChange={(e) => handleKgoneEnabledChange(e.target.value === 'true')}
|
||||
disabled={kgoneServerManaged}
|
||||
>
|
||||
<option value="false">Disabled</option>
|
||||
<option value="true">Enabled</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className="settings-item">
|
||||
<label className="settings-label">
|
||||
Server Base URL
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="settings-input"
|
||||
placeholder="e.g. http://127.0.0.1:8000"
|
||||
value={kgoneBaseUrl}
|
||||
onChange={(e) => handleKgoneBaseUrlChange(e.target.value)}
|
||||
disabled={kgoneServerManaged}
|
||||
/>
|
||||
<div className="settings-help" style={{ fontSize: '12px', color: '#888', marginTop: '4px' }}>
|
||||
Base URL of a running K.G.One server. Used for full-song generation, clip generation, and stem separation.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -14,6 +14,7 @@ export const DEBUG_MODE = {
|
||||
REGION_ITEM: true,
|
||||
PIANO_ROLL: true,
|
||||
MIDI_IMPORT: true,
|
||||
KGONE: true,
|
||||
};
|
||||
|
||||
// Toolbar related constants
|
||||
@@ -39,9 +40,9 @@ export const PIANO_ROLL_CONSTANTS = {
|
||||
|
||||
// notes
|
||||
NOTE_EDGE_OFFSET: 5,
|
||||
|
||||
|
||||
// Minimum note length in beats (1/64 beat)
|
||||
MIN_NOTE_LENGTH: 1/64,
|
||||
MIN_NOTE_LENGTH: 1 / 64,
|
||||
|
||||
// Dragging threshold for note selection
|
||||
DRAG_THRESHOLD: 5,
|
||||
|
||||
@@ -34,6 +34,10 @@ interface AppConfig {
|
||||
soundfont: {
|
||||
base_url: string;
|
||||
};
|
||||
kgone: {
|
||||
enabled: boolean;
|
||||
base_url: string;
|
||||
};
|
||||
};
|
||||
hotkeys: {
|
||||
main: {
|
||||
@@ -100,6 +104,7 @@ export class ConfigManager {
|
||||
private config: AppConfig;
|
||||
private storage: KGConfigStorage;
|
||||
private isInitialized: boolean = false;
|
||||
private kgoneServerManaged: boolean = false;
|
||||
private defaultConfig: AppConfig | null = null;
|
||||
private changeListeners: Set<(changedKeys: string[]) => void> = new Set();
|
||||
|
||||
@@ -199,6 +204,10 @@ export class ConfigManager {
|
||||
},
|
||||
soundfont: {
|
||||
base_url: 'https://cdn.jsdelivr.net/npm/soundfont-for-samplers/FluidR3_GM/'
|
||||
},
|
||||
kgone: {
|
||||
enabled: false,
|
||||
base_url: 'http://127.0.0.1:8000'
|
||||
}
|
||||
},
|
||||
hotkeys: {
|
||||
@@ -548,6 +557,21 @@ export class ConfigManager {
|
||||
return copied;
|
||||
}
|
||||
|
||||
/**
|
||||
* Called at startup when kgone-server.txt is found.
|
||||
* Forces enabled=true and overrides base_url in-memory only (not persisted).
|
||||
*/
|
||||
public setKGOneManagedByServer(url: string): void {
|
||||
this.kgoneServerManaged = true;
|
||||
this.setInObject(this.config as Record<string, unknown>, 'general.kgone.enabled', true);
|
||||
this.setInObject(this.config as Record<string, unknown>, 'general.kgone.base_url', url);
|
||||
this.notifyChangeListeners(['general.kgone.enabled', 'general.kgone.base_url']);
|
||||
}
|
||||
|
||||
public isKGOneServerManaged(): boolean {
|
||||
return this.kgoneServerManaged;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the default configuration
|
||||
*/
|
||||
|
||||
@@ -76,6 +76,9 @@ interface ProjectState {
|
||||
// ChatBox state
|
||||
showChatBox: boolean;
|
||||
|
||||
// K.G.One panel state
|
||||
showKGOnePanel: boolean;
|
||||
|
||||
// Instrument selection panel state
|
||||
showInstrumentSelection: boolean;
|
||||
// instrumentSelectionTrackId removed; panel now follows selectedTrackId
|
||||
@@ -137,6 +140,9 @@ interface ProjectState {
|
||||
setShowChatBox: (show: boolean) => void;
|
||||
toggleChatBox: () => void;
|
||||
|
||||
// K.G.One panel actions
|
||||
toggleKGOnePanel: () => void;
|
||||
|
||||
// Instrument selection panel actions
|
||||
openInstrumentSelectionForTrack: () => void;
|
||||
toggleInstrumentSelectionForTrack: () => void;
|
||||
@@ -278,6 +284,9 @@ export const useProjectStore = create<ProjectState>((set, get) => {
|
||||
// Initial ChatBox state
|
||||
showChatBox: initialChatBoxState,
|
||||
|
||||
// Initial K.G.One panel state
|
||||
showKGOnePanel: false,
|
||||
|
||||
// Initial Instrument Selection panel state
|
||||
showInstrumentSelection: initialShowInstrumentSelection,
|
||||
|
||||
@@ -898,7 +907,12 @@ export const useProjectStore = create<ProjectState>((set, get) => {
|
||||
|
||||
toggleChatBox: () => {
|
||||
const { showChatBox } = get();
|
||||
set({ showChatBox: !showChatBox });
|
||||
set({ showChatBox: !showChatBox, showKGOnePanel: false });
|
||||
},
|
||||
|
||||
toggleKGOnePanel: () => {
|
||||
const { showKGOnePanel } = get();
|
||||
set({ showKGOnePanel: !showKGOnePanel, showChatBox: false });
|
||||
},
|
||||
|
||||
// Instrument selection panel actions
|
||||
|
||||
Reference in New Issue
Block a user