diff --git a/README.md b/README.md index 9a7c646..913428c 100644 --- a/README.md +++ b/README.md @@ -22,13 +22,44 @@ PromptBase is a centralized, searchable repository for storing and managing prom - User auth and profiles - Prompt favorites and contributions - Ratings, version history, and sharing - - External API access + +## Usage + +You'll need a .env file with your Supabase credentials. See `supabase.env.example`. + +### Docker + +To run the app using Docker, you can use the provided `docker-compose.yml` file. + +```yaml +services: + frontend: + container_name: PromptBase + image: git.keithsolomon.net/keith/promptbase:main + restart: unless-stopped + + environment: + - NODE_ENV=production + + ports: + - "4321:4321" + + volumes: + - ./.env:/app/.env:ro # Bind-mount .env as read-only +``` + +### To run locally (for development) + +```bash +npm install +npm run dev +``` ## Tech Stack -- **Frontend**: Astro + HTMX + Alpine.js (AHA Stack) +- **Frontend**: Astro js, Tailwind CSS - **Backend**: Supabase (self-hosted) -- **Deployment**: Vercel or Netlify (frontend), Supabase (backend) +- **Deployment**: Docker (frontend), Supabase (backend) ## Database Schema @@ -48,7 +79,7 @@ PromptBase is a centralized, searchable repository for storing and managing prom ## Development Roadmap -Development is organized into phases. For details, see `Development Checklist.md`. +Development is organized into phases. For details, see `checklist.md`. ### MVP Phases @@ -66,17 +97,6 @@ Development is organized into phases. For details, see `Development Checklist.md - Ratings, version control, external API - Shareable links and embeds -## Usage - -To run locally: - -```bash -npm install -npm run dev -``` - -You'll need a .env file with your Supabase credentials. See `supabase.env.example`. - ## Contributing Pull requests are welcome! Please keep contributions focused on core functionality and usability improvements. diff --git a/app/public/css/styles.css b/app/public/css/styles.css deleted file mode 100644 index e69de29..0000000 diff --git a/app/src/components/FilteredPromptList.astro b/app/src/components/FilteredPromptList.astro deleted file mode 100644 index 3b607c9..0000000 --- a/app/src/components/FilteredPromptList.astro +++ /dev/null @@ -1,71 +0,0 @@ ---- -import PromptCard from './PromptCard.astro'; - -const { prompts = [] } = Astro.props; - -type Prompt = { - slug: string; - title: string; - type: string; - description: string; - tags?: string[]; - created_at: string; - updated_at: string; - notes?: string; -}; ---- - -
-

- Filters ↓ -
- -
- {prompts.map((p: Prompt) => ( -
- -
- ))} -
- - diff --git a/app/src/components/PromptCard.astro b/app/src/components/PromptCard.astro deleted file mode 100644 index 50ebf68..0000000 --- a/app/src/components/PromptCard.astro +++ /dev/null @@ -1,59 +0,0 @@ ---- -const { - slug, - title, - type, - description, - tags = [], - created_at, - updated_at, - notes, -} = Astro.props; - -const formatDate = (dateStr: string | undefined) => { - if (!dateStr) return "–"; - const date = new Date(dateStr); - return isNaN(date.getTime()) - ? "Invalid date" - : date.toLocaleDateString('en-US', { - month: 'short', - day: 'numeric', - year: 'numeric', - }); -}; ---- - -
-
-

{title}

- - {type} - -
- -

{notes}

- -
- {tags.map((tag: string) => ( - {tag} - ))} -
- -
- View Details -
-
-

Prompt

- - Edit -
- -

')} /> - -

-

Created: {formatDate(created_at)} • Updated: {formatDate(updated_at)}

-
-
-
diff --git a/app/src/components/PromptDetail.astro b/app/src/components/PromptDetail.astro deleted file mode 100644 index e69de29..0000000 diff --git a/app/src/components/PromptList.astro b/app/src/components/PromptList.astro deleted file mode 100644 index 76394ef..0000000 --- a/app/src/components/PromptList.astro +++ /dev/null @@ -1,70 +0,0 @@ ---- -import PromptCard from './PromptCard.astro'; - -const { prompts, error } = Astro.props; - -const typeFilter = typeof window !== "undefined" - ? new URLSearchParams(window.location.search).get("type") - : null; - - const tagFilter = typeof window !== "undefined" - ? new URLSearchParams(window.location.search).get("tag") - : null; - -console.log("🔍 searchParams:", typeFilter, tagFilter); - -type Prompt = { - slug: string; - title: string; - type: string; - description: string; - tags?: string[]; - created_at: string; - updated_at: string; - notes?: string; -}; - -const filtered = prompts?.filter((p: Prompt) => { - return (!typeFilter || p.type === typeFilter) && - (!tagFilter || p.tags?.includes(tagFilter)); -}); ---- - -{error ? ( -

Failed to load prompts: {error.message}

-) : ( -
-
- - -
- -
- - -
- - -
- -
- {filtered?.map((prompt: Prompt) => ( - - ))} -
-)} diff --git a/checklist.md b/checklist.md index 07334d9..b33b0b2 100644 --- a/checklist.md +++ b/checklist.md @@ -1,6 +1,10 @@ -# ✅ Prompt Catalog Development Checklist +# Prompt Catalog Development Checklist -## 🔧 Phase 1: Planning & Setup +## MVP Phases + +This checklist outlines the phases for developing the Prompt Catalog MVP. Each phase includes specific tasks to complete. + +### Phase 1: Planning & Setup - [x] Review and finalize requirements from `Prompt Catalog Features.md` - [x] Choose JavaScript framework (React, Vue, etc.) @@ -13,7 +17,7 @@ --- -## 🧱 Phase 2: Database & API +### Phase 2: Database & API - [x] Define and implement Supabase schema - [x] Set up Supabase RLS rules (if applicable) @@ -21,30 +25,52 @@ --- -## 🖼 Phase 3: Front-End Interface +### Phase 3: Front-End Interface -- [ ] Build static UI from `Front End Interface.png` - - [ ] Sidebar navigation (System / Task) - - [ ] Search bar with filters - - [ ] Prompt list display - - [ ] Prompt detail view - - [ ] Tags display and interaction -- [ ] Integrate UI with Supabase for live data -- [ ] Implement CRUD operations for prompts +- [x] Build static UI from `Front End Interface.png` + - [x] Sidebar navigation (System / Task) + - [x] Search bar with filters + - [x] Prompt list display + - [x] Prompt detail view + - [x] Tags display and interaction +- [x] Integrate UI with Supabase for live data +- [x] Implement CRUD operations for prompts --- -## 🔍 Phase 4: Search & Tagging +### Phase 4: Search & Tagging -- [ ] Implement keyword and full-text search -- [ ] Add filter by: - - [ ] Type (System, Task) - - [ ] Tags (multi-select) -- [ ] Create tag suggestion/autocomplete +- [x] Implement keyword and full-text search +- [x] Add filter by: + - [x] Type (System, Task) + - [x] Tags (multi-select) +- [x] Create tag suggestion/autocomplete --- -## 🤖 Phase 5: AI Integration +### Phase 5: Import/Export + +- [x] Implement prompt export to JSON +- [x] Implement prompt import from JSON with validation + +--- + +### Phase 6: Deployment & QA + +- [x] Set up frontend docker image and deployment compose file +- [x] Set up Supabase production environment +- [x] QA Testing: + - [x] UI functionality + - [x] Prompt CRUD operations + - [x] Search and filtering + - [x] Import/export behavior +- [ ] Write usage documentation + +--- + +## Post-MVP Phases + +### Phase 7: AI Integration - [ ] Set up API key management (e.g., OpenAI, Together, Ollama) - [ ] Add prompt suggestion UI for user input @@ -52,14 +78,7 @@ --- -## 📦 Phase 6: Import/Export - -- [ ] Implement prompt export to JSON -- [ ] Implement prompt import from JSON with validation - ---- - -## 🔐 Phase 7: Authentication & User Features (Future) +### Phase 8: Authentication & User Features (Future) - [ ] Add Supabase Auth for login/register - [ ] Create user profile UI @@ -68,20 +87,7 @@ --- -## 🚀 Phase 8: Deployment & QA - -- [ ] Deploy frontend to hosting platform -- [ ] Set up Supabase production environment -- [ ] QA Testing: - - [ ] UI functionality - - [ ] Prompt CRUD operations - - [ ] Search and filtering - - [ ] Import/export behavior -- [ ] Write usage documentation - ---- - -## 🌱 Phase 9: Post-MVP Enhancements +### Phase 9: Future Enhancements - [ ] Add prompt rating system - [ ] Implement version history tracking diff --git a/docker-compose.yml b/docker-compose.yml index a0d8ce4..617a3e3 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,7 +1,7 @@ services: frontend: container_name: PromptBase - image: promptbase + image: git.keithsolomon.net/keith/promptbase:main restart: unless-stopped environment: diff --git a/notes/Development Checklist.md b/notes/Development Checklist.md deleted file mode 100644 index 07334d9..0000000 --- a/notes/Development Checklist.md +++ /dev/null @@ -1,90 +0,0 @@ -# ✅ Prompt Catalog Development Checklist - -## 🔧 Phase 1: Planning & Setup - -- [x] Review and finalize requirements from `Prompt Catalog Features.md` -- [x] Choose JavaScript framework (React, Vue, etc.) -- [x] Set up Supabase project - - [x] Create `prompts` table - - [x] Create `users` table (future) - - [x] Create `user_prompts` table (future) -- [x] Define JSON structure for import/export -- [x] Choose hosting platform (Vercel, Netlify, etc.) - ---- - -## 🧱 Phase 2: Database & API - -- [x] Define and implement Supabase schema -- [x] Set up Supabase RLS rules (if applicable) -- [x] Connect frontend to Supabase using client API - ---- - -## 🖼 Phase 3: Front-End Interface - -- [ ] Build static UI from `Front End Interface.png` - - [ ] Sidebar navigation (System / Task) - - [ ] Search bar with filters - - [ ] Prompt list display - - [ ] Prompt detail view - - [ ] Tags display and interaction -- [ ] Integrate UI with Supabase for live data -- [ ] Implement CRUD operations for prompts - ---- - -## 🔍 Phase 4: Search & Tagging - -- [ ] Implement keyword and full-text search -- [ ] Add filter by: - - [ ] Type (System, Task) - - [ ] Tags (multi-select) -- [ ] Create tag suggestion/autocomplete - ---- - -## 🤖 Phase 5: AI Integration - -- [ ] Set up API key management (e.g., OpenAI, Together, Ollama) -- [ ] Add prompt suggestion UI for user input -- [ ] Integrate with AI API to return prompt suggestions - ---- - -## 📦 Phase 6: Import/Export - -- [ ] Implement prompt export to JSON -- [ ] Implement prompt import from JSON with validation - ---- - -## 🔐 Phase 7: Authentication & User Features (Future) - -- [ ] Add Supabase Auth for login/register -- [ ] Create user profile UI -- [ ] Track user-owned prompts -- [ ] Enable user favorites system - ---- - -## 🚀 Phase 8: Deployment & QA - -- [ ] Deploy frontend to hosting platform -- [ ] Set up Supabase production environment -- [ ] QA Testing: - - [ ] UI functionality - - [ ] Prompt CRUD operations - - [ ] Search and filtering - - [ ] Import/export behavior -- [ ] Write usage documentation - ---- - -## 🌱 Phase 9: Post-MVP Enhancements - -- [ ] Add prompt rating system -- [ ] Implement version history tracking -- [ ] Add social sharing (links, embed) -- [ ] Provide external API for prompt access -- [ ] Improve AI integration with context-aware suggestions diff --git a/notes/Prompt Catalog Features.md b/notes/Prompt Catalog Features.md deleted file mode 100644 index 5f3e997..0000000 --- a/notes/Prompt Catalog Features.md +++ /dev/null @@ -1,51 +0,0 @@ -# Prompt Catalog - -- June 21, 2025: Initial planning - -## Overview & Purpose - -The Prompt Catalog is a centralized repository for prompts used in various applications, such as AI models or chatbots. It aims to provide a structured way to store, search, and categorize prompts for easy access and management. It will serve as a comprehensive and user-friendly catalog of prompts that can be easily searched, categorized, and tagged, enhancing the usability and discoverability of prompts for developers and users alike. - -## Features - -- **Storage**: Store prompts, metadata, and (future) users in Supabase (self-hosted or cloud). -- **Prompt Metadata**: Include metadata for each prompt: - - Type (System, Task) - - Title - - Description - - Tags - - Creation date - - Last modified date -- **Categorization**: Organize prompts into types (System, Tasks) for easier navigation. -- **Tagging System**: Use tags to describe prompts for better filtering. -- **Search Functionality**: Quickly find prompts by keywords, tags, or text search. -- **AI Integration**: Connect to AI models via API (OpenAI, Together, Ollama, etc.) to suggest prompts based on user input or context. -- **Export/Import**: Allow users to export prompts in JSON format and import them back. - -## Technical Details - -- **Web Interface**: A user-friendly web interface to view, search, and manage prompts. - - See `notes/Front End Interface.png` for mockup. -- **Database**: Use Supabase for storing prompts and metadata. - - Tables: - - `prompts`: Stores prompt details (id, type, title, description, tags, created_at, updated_at). - - `users`: (Future) Stores user information (id, username, email, created_at). - - `user_prompts`: (Future) Stores user contributions and favorites (user_id, prompt_id, created_at). -- **Authentication**: Implement user authentication for future features (e.g., user profiles, contributions). -- **Deployment**: Host the application on a platform like Vercel or Netlify for the front end, and Supabase for the backend. -- **Front End**: Use AHA Stack (Astro, HTMX and Alpine.js) for a modern, responsive user interface. - - **Astro**: For static site generation and routing. - - **HTMX**: For dynamic content loading and interactions without full page reloads. - - **Alpine.js**: For lightweight interactivity and state management. -- **Back End**: Use Supabase's built-in API for database interactions. -- **AI Integration**: Use OpenAI or other AI APIs to suggest prompts based on user input. - -## Future Enhancements - -- **User Profiles**: Create profiles for users to manage their contributions and favorites. -- **User Contributions**: Allow users to submit their own prompts to the catalog. -- **Favorites**: Users can mark prompts as favorites for easy access later. -- **Rating System**: Rate prompts to help others find the best ones. -- **Version Control**: Track changes to prompts over time. -- **API Access**: Provide an API for external applications to access the catalog. -- **Sharing**: Enable sharing of prompts via links or social media. diff --git a/notes/test data.txt b/notes/test data.txt deleted file mode 100644 index e6509ab..0000000 --- a/notes/test data.txt +++ /dev/null @@ -1,32 +0,0 @@ -const prompts = [ - { - slug: "summarize-document", - title: "Summarize Document", - type: "System", - description: "Summarizes a document or long input using GPT-4.", - tags: ["summary", "long-form", "NLP"], - createdAt: "2025-06-01", - updatedAt: "2025-07-10", - notes: "Summarizes input using GPT-4 with smart chunking." - }, - { - slug: "translate-text", - title: "Translate Text", - type: "Task", - description: "Translate English text into French, Spanish, or Japanese.", - tags: ["translate", "language"], - createdAt: "2025-05-15", - updatedAt: "2025-06-22", - notes: "Uses multilingual model for more accurate translation." - }, - { - slug: "generate-code", - title: "Generate Code", - type: "Task", - description: "Generate Python or JavaScript functions from descriptions.", - tags: ["code", "generation", "devtools"], - createdAt: "2025-06-05", - updatedAt: "2025-07-01", - notes: "Includes language detection and function wrapping." - } -];