// Admin application shell — auth-gated SPA for /admin/

function AdminApp() {
  const [me, setMe] = React.useState({ loading: true, admin: false });
  const [route, setRoute] = React.useState({ name: 'dashboard' });
  const [surveys, setSurveys] = React.useState([]);
  const [loadErr, setLoadErr] = React.useState('');

  React.useEffect(() => {
    fetch('/api/me', { credentials: 'same-origin' })
      .then(r => r.json())
      .then(j => setMe({ loading: false, admin: !!j.admin }))
      .catch(() => setMe({ loading: false, admin: false }));
  }, []);

  const loadSurveys = React.useCallback(() => {
    return fetch('/api/surveys', { credentials: 'same-origin' })
      .then(r => { if (!r.ok) throw new Error('load failed'); return r.json(); })
      .then(list => { setSurveys(list); setLoadErr(''); })
      .catch(e => setLoadErr(e.message));
  }, []);

  React.useEffect(() => {
    if (me.admin) loadSurveys();
  }, [me.admin, loadSurveys]);

  if (me.loading) {
    return <div style={{ padding: 60, textAlign: 'center', color: 'var(--muted)' }}>Loading…</div>;
  }

  if (!me.admin) {
    return <LoginScreen onLogin={() => setMe({ loading: false, admin: true })} />;
  }

  const go = (name, extra = {}) => setRoute({ name, ...extra });

  const currentSurvey = route.surveyId ? surveys.find(s => s.id === route.surveyId) : null;

  const handleNew = async () => {
    const r = await fetch('/api/surveys', {
      method: 'POST', credentials: 'same-origin',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ title: 'Untitled survey' }),
    });
    if (!r.ok) { alert('Failed to create survey'); return; }
    const created = await r.json();
    await loadSurveys();
    go('builder', { surveyId: created.id });
  };

  const handleSave = async (updated) => {
    const r = await fetch('/api/surveys/' + updated.id, {
      method: 'PUT', credentials: 'same-origin',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({
        title: updated.title,
        directory: updated.directory,
        status: updated.status,
        access: updated.access,
        goal: updated.goal,
        closes: updated.closes,
        questions: updated.questions,
        thankYou: updated.thankYou,
        intro: updated.intro || '',
        anonymous: !!updated.anonymous,
      }),
    });
    if (!r.ok) { alert('Save failed'); return; }
    await loadSurveys();
    go('dashboard');
  };

  const handleLogout = async () => {
    await fetch('/api/logout', { method: 'POST', credentials: 'same-origin' });
    setMe({ loading: false, admin: false });
    setRoute({ name: 'dashboard' });
    setSurveys([]);
  };

  const openPublic = (s) => {
    if (!s || s.status !== 'live') return;
    window.open('/surveys/' + s.directory, '_blank');
  };

  if (route.name === 'dashboard') {
    return (
      <Dashboard
        surveys={surveys}
        onOpen={(id) => go('builder', { surveyId: id })}
        onOpenResponses={(id) => go('responses', { surveyId: id })}
        onNew={handleNew}
        onLogout={handleLogout}
      />
    );
  }

  if (route.name === 'builder' && currentSurvey) {
    return (
      <Builder
        survey={currentSurvey}
        onBack={() => go('dashboard')}
        onSave={handleSave}
        onOpenPublic={() => openPublic(currentSurvey)}
        onOpenResponses={() => go('responses', { surveyId: currentSurvey.id })}
      />
    );
  }

  if (route.name === 'responses' && currentSurvey) {
    return (
      <ResponsesScreen
        survey={currentSurvey}
        onBack={() => go('dashboard')}
        onOpenPublic={() => openPublic(currentSurvey)}
      />
    );
  }

  return (
    <Dashboard
      surveys={surveys}
      onOpen={(id) => go('builder', { surveyId: id })}
      onOpenResponses={(id) => go('responses', { surveyId: id })}
      onNew={handleNew}
      onLogout={handleLogout}
    />
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<AdminApp />);