45 lines
1.6 KiB
Plaintext
45 lines
1.6 KiB
Plaintext
---
|
|
// index.astro
|
|
import MainLayout from '../layouts/MainLayout.astro';
|
|
import SearchBar from '../components/SearchBar.astro';
|
|
|
|
const supabaseUrl = import.meta.env.PUBLIC_SUPABASE_URL;
|
|
const supabaseKey = import.meta.env.PUBLIC_SUPABASE_ANON_KEY;
|
|
---
|
|
|
|
<MainLayout page="Home">
|
|
<div
|
|
id="supabase-env"
|
|
data-url={supabaseUrl}
|
|
data-key={supabaseKey}
|
|
hidden
|
|
></div>
|
|
|
|
<header class="border-b p-4">
|
|
<h1 class="text-2xl font-bold"><a href="/">Prompt Catalog</a></h1>
|
|
<p class="text-sm mt-1">Save and explore AI prompts</p>
|
|
</header>
|
|
|
|
<main class="flex flex-col lg:flex-row">
|
|
<SearchBar allTags={[]} /> <!-- leave empty, we'll hydrate it in JS -->
|
|
|
|
<div class="border-b lg:border-b-0 lg:border-l flex-1 flex flex-col overflow-hidden">
|
|
<div class="flex-1 overflow-y-auto px-4 lg:px-6 pt-2 pb-4">
|
|
<div id="prompt-error" class="text-red-500 hidden"></div>
|
|
<div class="border-b mb-4 flex justify-between items-center">
|
|
<h2 id="prompt-count" class="text-xl font-semibold text-gray-300 mb-2"></h2>
|
|
<a href="#filters" class="block lg:hidden bg-blue-600 text-white px-2 py-0 pb-1 mb-2 rounded cursor-pointer hover:bg-blue-700 transition-colors duration-300">Filters ↓</a>
|
|
</div>
|
|
|
|
<div id="prompt-container" class="grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3 items-start">Loading prompts…</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<footer class="border-t p-4 text-center text-sm">
|
|
© {new Date().getFullYear()} Prompt Catalog
|
|
</footer>
|
|
|
|
<script type="module" src="/scripts/fetch-prompts.js"></script>
|
|
</MainLayout>
|