import { useStore } from '@nanostores/react';
import { uiState } from '../stores/ui';

export function PerformanceWarning() {
  const ui = useStore(uiState);

  if (!ui.performanceWarningVisible) return null;

  return (
    <div id="performance-warning" style={{ display: 'block' }}>
      Performance warning: Shader taking too long to render!
    </div>
  );
}
