import {StrictMode} from 'react';
import {createRoot} from 'react-dom/client';
import App from './App.tsx';
import './index.css';
import { setupMockApiInterceptor } from './mockApi.ts';

// Self-healing Auto-detection: Use mock database if running on GitHub Pages, or if the real Express server is down.
const isGitHubPages = window.location.hostname.endsWith('github.io');
const isStaticFile = window.location.protocol === 'file:';

if (isGitHubPages || isStaticFile) {
  setupMockApiInterceptor();
} else {
  const controller = new AbortController();
  const timeoutId = setTimeout(() => controller.abort(), 800);
  
  fetch('/api/dishes', { signal: controller.signal })
    .then((res) => {
      clearTimeout(timeoutId);
      if (!res.ok) {
        setupMockApiInterceptor();
      }
    })
    .catch(() => {
      clearTimeout(timeoutId);
      setupMockApiInterceptor();
    });
}

createRoot(document.getElementById('root')!).render(
  <StrictMode>
    <App />
  </StrictMode>,
);