---
import TemplateCard from './TemplateCard.astro';

interface TemplateFile {
  path: string;
  content: string;
}

interface Template {
  name: string;
  type: string;
  description: string;
  content?: string;
  files?: TemplateFile[];
  downloadUrl?: string;
  rawUrl?: string;
  size?: number;
}

interface Props {
  templates: Template[];
}

const { templates } = Astro.props;
---

<main class="max-w-6xl mx-auto px-4 py-8">
  <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4" id="templatesGrid">
    {templates.length === 0 ? (
      <div class="col-span-full text-center text-warm-text-secondary py-16 surface-card">
        <i class="ph ph-magnifying-glass text-4xl mb-3 block text-warm-text-tertiary"></i>
        <p>No templates found</p>
      </div>
    ) : (
      templates.map(template => (
        <TemplateCard
          name={template.name}
          type={template.type}
          description={template.description}
          content={template.content}
          files={template.files}
          downloadUrl={template.downloadUrl}
          rawUrl={template.rawUrl}
          size={template.size}
        />
      ))
    )}
  </div>
</main>