import { useMonitorScope } from './shared';
import { BtopView } from './BtopView';
import { Pm2View } from './Pm2View';
import { DockerView } from './DockerView';

// Right panel — renders whichever scope the URL names. It does not hear from the ScopeList; both read
// `/system-monitor/:scope`.
export const MonitorMain = ({ panelId: _panelId }: { panelId: string }) => {
  const scope = useMonitorScope();
  if (scope === 'pm2') return <Pm2View />;
  if (scope === 'docker') return <DockerView />;
  return <BtopView />;
};
