diff options
Diffstat (limited to 'frontend/src/components/VNInterface.tsx')
| -rw-r--r-- | frontend/src/components/VNInterface.tsx | 38 |
1 files changed, 37 insertions, 1 deletions
diff --git a/frontend/src/components/VNInterface.tsx b/frontend/src/components/VNInterface.tsx index 318a9b9..051c210 100644 --- a/frontend/src/components/VNInterface.tsx +++ b/frontend/src/components/VNInterface.tsx @@ -9,9 +9,11 @@ import { showSettingsModalStore, isVisibleStore, yenBalanceStore, + documentUiEnabledStore, toggleStandby, toggleShowChoices, - updateTime + updateTime, + setDocumentUiEnabled, } from '../stores' interface VNInterfaceProps { @@ -26,6 +28,7 @@ export function VNInterface({ onLogout }: VNInterfaceProps) { const showSettingsModal = useStore(showSettingsModalStore) const isVisible = useStore(isVisibleStore) const yenBalance = useStore(yenBalanceStore) + const documentUiEnabled = useStore(documentUiEnabledStore) // Fade in effect on mount useEffect(() => { @@ -113,6 +116,14 @@ export function VNInterface({ onLogout }: VNInterfaceProps) { <span className="info-value">Contracts</span> </Link> </div> + {documentUiEnabled && ( + <div className="status-item"> + <Link to="/directives" style={{ color: '#ff66cc', textDecoration: 'none', display: 'flex', alignItems: 'center', gap: '4px' }}> + <span className="info-label">Docs:</span> + <span className="info-value">Directives</span> + </Link> + </div> + )} </div> </div> </div> @@ -198,6 +209,31 @@ export function VNInterface({ onLogout }: VNInterfaceProps) { </div> </div> <div className="settings-section"> + <h3>Experimental</h3> + <div className="setting-item"> + <label style={{ display: 'flex', alignItems: 'center', gap: '8px', cursor: 'pointer' }}> + <input + type="checkbox" + checked={documentUiEnabled} + onChange={(e) => setDocumentUiEnabled(e.target.checked)} + /> + Document UI (Experimental) + </label> + <p style={{ fontSize: '0.8em', color: '#9ca3af', marginTop: '4px' }}> + Replace the directive management interface with an interactive document editor. This is a proof of concept. + </p> + {documentUiEnabled && ( + <Link + to="/directives" + style={{ display: 'inline-block', marginTop: '8px', color: '#ff66cc', fontSize: '0.9em' }} + onClick={() => showSettingsModalStore.set(false)} + > + Open Directives Editor {'\u2192'} + </Link> + )} + </div> + </div> + <div className="settings-section"> <h3>Audio</h3> <div className="setting-item"> <label>Master Volume</label> |