Embed computers

// SERVER. The API key never leaves this file.
export async function GET() {
  const res = await fetch(
    `https://www.orgo.ai/api/computers/${process.env.ORGO_COMPUTER_ID}`,
    {
      headers: { Authorization: `Bearer ${process.env.ORGO_API_KEY}` },
      cache: 'no-store',
    },
  );
  const computer = await res.json();

  // Only the per-computer password crosses to the browser.
  return Response.json(
    { instanceId: computer.fly_instance_id, password: computer.vnc_password },
    { headers: { 'Cache-Control': 'no-store' } },
  );
}

import RFB from '@novnc/novnc';

const { instanceId, password } = await fetch('/api/computer').then((r) => r.json());

const rfb = new RFB(
  document.getElementById('screen'),
  `wss://www.orgo.ai/desktops/${instanceId}/ws/websockify?token=${encodeURIComponent(password)}`,
  { credentials: { password } },
);

rfb.viewOnly = false;      // true renders the screen without sending input
rfb.scaleViewport = true;  // fit the screen to its container
rfb.qualityLevel = 6;      // 0 to 9
rfb.compressLevel = 2;     // 0 to 9

// Answer the VNC auth challenge when the proxy forwards it.
rfb.addEventListener('credentialsrequired', () => rfb.sendCredentials({ password }));
rfb.addEventListener('securityfailure', (e) => console.error('VNC auth failed', e.detail));

// The close code is the only signal a rejected connection gives you.
rfb._sock._websocket.addEventListener('close', (e) => console.log('closed', e.code));