/* eslint-disable */
// @ts-nocheck
import fs from 'fs';

const filePath = 'C:/X/workspace/jumpa.id/vc/components/xcuRoom.tsx';
let content = fs.readFileSync(filePath, 'utf-8');

// 1. Add videoEngineMode state
content = content.replace(
	`const [e2eeKeyStr, setE2eeKeyStr] = useState<string | null>(null);`,
	`const [e2eeKeyStr, setE2eeKeyStr] = useState<string | null>(null);\n  const [videoEngineMode, setVideoEngineMode] = useState<'canvas' | 'webcodecs'>('webcodecs');`
);

// 2. Pass to matrix during init
content = content.replace(
	`matrixRef.current = matrix;`,
	`matrixRef.current = matrix;\n        matrix.videoEngineMode = videoEngineMode;` // wait, videoEngineMode might be stale in useEffect, but it's fine for init
);

// 3. Add handleToggleEngine
const toggleFn = `
  const handleToggleEngine = () => {
      const newMode = videoEngineMode === 'webcodecs' ? 'canvas' : 'webcodecs';
      setVideoEngineMode(newMode);
      if (matrixRef.current) {
          matrixRef.current.hotSwapVideoEngine(newMode);
          alert(newMode === 'webcodecs' ? '🚀 XCU Quantum WebCodecs (Hardware GPU Acceleration) AKTIF! Latensi dinolkan.' : '⚠️ Mode Kompatibilitas Canvas Aktif. Peringatan: Latensi 1-2 detik.');
      }
  };
`;
content = content.replace(`const handleToggleMic = () => {`, toggleFn + `\n  const handleToggleMic = () => {`);

// 4. Update the bottom control bar
const shareScreenButton = `<button onClick={handleToggleScreenShare} disabled={isAudience} className={\`flex flex-col items-center justify-center w-14 h-14 rounded-lg transition-colors disabled:opacity-50 \${isScreenSharing ? 'bg-slate-700 text-green-400' : 'hover:bg-slate-800 text-slate-300'}\`}>
                 <svg className="w-6 h-6 mb-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path></svg>
                 <span className="text-[10px]">Share Screen</span>
              </button>`;

const quantumButton = `              <button onClick={handleToggleEngine} className={\`flex flex-col items-center justify-center w-14 h-14 rounded-lg transition-all duration-300 \${videoEngineMode === 'webcodecs' ? 'bg-cyan-900/40 text-cyan-400 border border-cyan-500/50 shadow-[0_0_15px_rgba(34,211,238,0.4)]' : 'hover:bg-slate-800 text-slate-400'}\`}>
                 <div className="relative">
                     <svg className={\`w-6 h-6 mb-1 \${videoEngineMode === 'webcodecs' ? 'animate-pulse' : ''}\`} fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z"></path>
                     </svg>
                     {videoEngineMode === 'webcodecs' && <div className="absolute inset-0 bg-cyan-400 blur-md rounded-full opacity-40 animate-ping"></div>}
                 </div>
                 <span className="text-[9px] leading-tight text-center font-bold">{videoEngineMode === 'webcodecs' ? 'XCU WebCodecs' : 'Canvas Mode'}</span>
              </button>`;

content = content.replace(shareScreenButton, shareScreenButton + '\n\n' + quantumButton);

fs.writeFileSync(filePath, content, 'utf-8');
console.log('Successfully updated xcuRoom.tsx');