---
import Base from '../layouts/Base.astro';

const apiName = 'holidays';
const titles: Record<string, string> = {
  'zip-enrichment': 'ZIP Enrichment API',
  'holidays': 'Holidays API',
  'air-quality': 'Air Quality API',
};
const title = titles[apiName];
---
<Base title={title} description={`${title} — OpenAPI documentation`}>
  <style>
    #redoc-container { background: #fff; }
  </style>
  <div id="redoc-container"></div>
  <script is:inline define:vars={{ specUrl: `/specs/${apiName}.yaml` }}>
    // Load Redoc from CDN
    var script = document.createElement('script');
    script.src = 'https://cdn.jsdelivr.net/npm/redoc@latest/bundles/redoc.standalone.js';
    script.onload = function () {
      Redoc.init(specUrl, {
        theme: {
          colors: { primary: { main: '#667eea' } },
          typography: { fontFamily: 'system-ui, sans-serif' },
        },
      }, document.getElementById('redoc-container'));
    };
    document.head.appendChild(script);
  </script>
</Base>