Update olddocs to reflect current implementation state
- REGISTRY.md: Mark phases 1-4, 6-8 complete; phase 5 partial - WEB_UI.md: Update Phase 7 checklist with completion status - DESIGN.md: Note TUI replaced by PySide6 GUI, update structure - PROJECT.md: Update source structure and database schema - PROVIDERS.md, META_TOOLS.md, COLLECTIONS.md: Add status notes - Add "Features Implemented Beyond Original Design" sections Co-Authored-By: Claude Opus 4.5 <[email protected]>
This commit is contained in:
Claude Opus 4.5
+184
-98
@@ -1,5 +1,10 @@
|
||||
# CmdForge Web UI Design
|
||||
|
||||
> **Document Status (January 2026)**: This is the original design document used to build the web UI.
|
||||
> The implementation is complete with additional features beyond this spec. See the Phase 7
|
||||
> Implementation Checklist below for current status. For the latest documentation, see the
|
||||
> project-docs system.
|
||||
|
||||
## Purpose
|
||||
Deliver a professional web front-end that explains CmdForge, helps users discover tools, and supports a collaborative ecosystem. The site should drive sustainable revenue without undermining trust or usability.
|
||||
|
||||
@@ -1162,123 +1167,174 @@ Sitemap: https://cmdforge.dev/sitemap.xml
|
||||
|
||||
## Phase 7 Implementation Checklist
|
||||
|
||||
### 7.1 Foundation & Setup
|
||||
- [ ] Set up Flask project structure with blueprints
|
||||
- [ ] Configure Jinja2 templates with base layout
|
||||
- [ ] Integrate Tailwind CSS (build pipeline)
|
||||
- [ ] Set up static asset handling (CSS, JS, images)
|
||||
- [ ] Configure development/production environments
|
||||
- [ ] Set up database models for web-specific tables
|
||||
> **Status as of January 2026**: Phase 7 is complete with most items implemented. See notes for partial items.
|
||||
|
||||
### 7.2 Core Templates & Components
|
||||
- [ ] Create base template with header/footer
|
||||
- [ ] Implement navigation component (desktop + mobile)
|
||||
- [ ] Build reusable card components (tool, tutorial, contributor)
|
||||
- [ ] Create form components (inputs, buttons, dropdowns)
|
||||
- [ ] Implement callout/alert components
|
||||
- [ ] Build code block component with copy functionality
|
||||
- [ ] Create loading states (skeleton, spinner)
|
||||
- [ ] Implement responsive grid system
|
||||
### 7.1 Foundation & Setup ✅ Complete
|
||||
- [x] Set up Flask project structure with blueprints
|
||||
- [x] Configure Jinja2 templates with base layout
|
||||
- [x] Integrate Tailwind CSS (build pipeline)
|
||||
- [x] Set up static asset handling (CSS, JS, images)
|
||||
- [x] Configure development/production environments
|
||||
- [x] Set up database models for web-specific tables (25+ tables)
|
||||
|
||||
### 7.3 Landing Page
|
||||
- [ ] Hero section with install snippet
|
||||
- [ ] Three pillars section (Easy, Powerful, Community)
|
||||
- [ ] Featured tools grid (API integration)
|
||||
- [ ] Getting started tutorial cards
|
||||
- [ ] Featured contributor spotlight
|
||||
- [ ] Footer with links and optional ad zone
|
||||
### 7.2 Core Templates & Components ✅ Complete
|
||||
- [x] Create base template with header/footer
|
||||
- [x] Implement navigation component (desktop + mobile)
|
||||
- [x] Build reusable card components (tool, tutorial, contributor)
|
||||
- [x] Create form components (inputs, buttons, dropdowns)
|
||||
- [x] Implement callout/alert components
|
||||
- [x] Build code block component with copy functionality
|
||||
- [x] Create loading states (skeleton, spinner)
|
||||
- [x] Implement responsive grid system
|
||||
|
||||
### 7.4 Registry Pages (Ad-Free)
|
||||
- [ ] Tool browse page with search bar
|
||||
- [ ] Category dropdown filter
|
||||
- [ ] Sort options (popular, recent, name)
|
||||
- [ ] Pagination component
|
||||
- [ ] Tool card grid layout
|
||||
- [ ] Tool detail page with README rendering
|
||||
- [ ] Version selector in sidebar
|
||||
- [ ] Install command with copy
|
||||
- [ ] Report abuse button/modal
|
||||
- [ ] Category pages
|
||||
### 7.3 Landing Page ✅ Complete
|
||||
- [x] Hero section with install snippet
|
||||
- [x] Three pillars section (Easy, Powerful, Community)
|
||||
- [x] Featured tools grid (API integration)
|
||||
- [x] Getting started tutorial cards
|
||||
- [x] Featured contributor spotlight
|
||||
- [x] Footer with links and optional ad zone
|
||||
|
||||
### 7.5 Documentation & Tutorials
|
||||
- [ ] Docs landing page with section links
|
||||
- [ ] Tutorial listing page
|
||||
- [ ] Content page template with TOC
|
||||
- [ ] Scroll-spy for TOC highlighting
|
||||
- [ ] Code syntax highlighting (Prism/Highlight.js)
|
||||
- [ ] Video embed component (YouTube)
|
||||
- [ ] Related articles section
|
||||
- [ ] Sidebar ad placement (desktop only)
|
||||
### 7.4 Registry Pages (Ad-Free) ✅ Complete
|
||||
- [x] Tool browse page with search bar
|
||||
- [x] Category dropdown filter
|
||||
- [x] Sort options (popular, recent, name)
|
||||
- [x] Pagination component
|
||||
- [x] Tool card grid layout
|
||||
- [x] Tool detail page with README rendering
|
||||
- [x] Version selector in sidebar
|
||||
- [x] Install command with copy
|
||||
- [x] Report abuse button/modal
|
||||
- [x] Category pages
|
||||
- [x] **Added**: Reviews and ratings display
|
||||
- [x] **Added**: Issue tracking display
|
||||
- [x] **Added**: Fork information display
|
||||
- [x] **Added**: Publisher profile pages with trust scores
|
||||
- [x] **Added**: Collections pages
|
||||
|
||||
### 7.6 Authentication & Dashboard
|
||||
- [ ] Registration page and flow
|
||||
- [ ] Login page with error handling
|
||||
- [ ] Password reset flow (if implementing)
|
||||
- [ ] Session management (cookies, CSRF)
|
||||
- [ ] Dashboard layout with sidebar
|
||||
- [ ] My Tools tab with tool list
|
||||
- [ ] API Tokens tab with create/revoke
|
||||
- [ ] Settings tab with profile edit
|
||||
- [ ] Logout functionality
|
||||
### 7.5 Documentation & Tutorials ⚠️ Mostly Complete
|
||||
- [x] Docs landing page with section links
|
||||
- [x] Tutorial listing page
|
||||
- [x] Content page template with TOC
|
||||
- [ ] Scroll-spy for TOC highlighting (not implemented)
|
||||
- [x] Code syntax highlighting (Prism/Highlight.js)
|
||||
- [ ] Video embed component (YouTube) (not implemented)
|
||||
- [ ] Related articles section (limited implementation)
|
||||
- [x] Sidebar ad placement (desktop only)
|
||||
|
||||
### 7.7 Privacy & Consent
|
||||
- [ ] Cookie consent banner
|
||||
- [ ] Consent preferences modal
|
||||
- [ ] Consent state storage
|
||||
- [ ] Privacy policy page
|
||||
- [ ] Terms of service page
|
||||
- [ ] Honor consent in analytics/ad loading
|
||||
### 7.6 Authentication & Dashboard ✅ Complete
|
||||
- [x] Registration page and flow
|
||||
- [x] Login page with error handling
|
||||
- [ ] Password reset flow (placeholder only - not functional)
|
||||
- [x] Session management (cookies, CSRF)
|
||||
- [x] Dashboard layout with sidebar
|
||||
- [x] My Tools tab with tool list (version consolidation, ratings, issues)
|
||||
- [x] API Tokens tab with create/revoke (now "Connections" with app pairing)
|
||||
- [x] Settings tab with profile edit
|
||||
- [x] Logout functionality
|
||||
- [x] **Added**: Admin dashboard (pending queue, publishers, reports, scrutiny, settings)
|
||||
- [x] **Added**: Role-based access (user, moderator, admin)
|
||||
|
||||
### 7.8 Ads & Monetization
|
||||
- [ ] AdSense integration (account setup)
|
||||
- [ ] Ad container components
|
||||
- [ ] Lazy loading for ad scripts
|
||||
- [ ] Ad placement rules enforcement
|
||||
- [ ] Sponsored content styling (if applicable)
|
||||
- [ ] Donate page with donation options
|
||||
### 7.7 Privacy & Consent ⚠️ Mostly Complete
|
||||
- [x] Cookie consent banner (API exists)
|
||||
- [x] Consent preferences modal (API exists)
|
||||
- [x] Consent state storage
|
||||
- [x] Privacy policy page
|
||||
- [x] Terms of service page
|
||||
- [x] Honor consent in analytics/ad loading
|
||||
|
||||
### 7.9 SEO & Performance
|
||||
- [ ] Meta tags for all page types
|
||||
- [ ] Open Graph tags
|
||||
- [ ] Schema.org structured data
|
||||
- [ ] Sitemap generation
|
||||
- [ ] robots.txt configuration
|
||||
- [ ] Canonical URL implementation
|
||||
- [ ] Image optimization pipeline
|
||||
- [ ] CSS/JS minification
|
||||
- [ ] Critical CSS inlining
|
||||
- [ ] Lazy loading for images
|
||||
### 7.8 Ads & Monetization ⚠️ Partial
|
||||
- [ ] AdSense integration (account setup) (placeholders only)
|
||||
- [x] Ad container components
|
||||
- [x] Lazy loading for ad scripts
|
||||
- [x] Ad placement rules enforcement
|
||||
- [ ] Sponsored content styling (if applicable) (not implemented)
|
||||
- [x] Donate page with donation options
|
||||
|
||||
### 7.10 Testing & QA
|
||||
- [ ] Responsive design testing (all breakpoints)
|
||||
- [ ] Accessibility testing (WCAG 2.1 AA)
|
||||
- [ ] Cross-browser testing (Chrome, Firefox, Safari, Edge)
|
||||
- [ ] Performance testing (Lighthouse scores)
|
||||
- [ ] Form validation testing
|
||||
- [ ] Error state testing
|
||||
- [ ] Mobile usability testing
|
||||
### 7.9 SEO & Performance ✅ Mostly Complete
|
||||
- [x] Meta tags for all page types
|
||||
- [x] Open Graph tags
|
||||
- [ ] Schema.org structured data (not verified)
|
||||
- [x] Sitemap generation
|
||||
- [x] robots.txt configuration
|
||||
- [x] Canonical URL implementation (partial)
|
||||
- [ ] Image optimization pipeline (not implemented)
|
||||
- [x] CSS/JS minification (via Tailwind build)
|
||||
- [ ] Critical CSS inlining (not implemented)
|
||||
- [x] Lazy loading for images
|
||||
|
||||
### 7.11 Launch Preparation
|
||||
- [ ] Content creation (initial docs, tutorials)
|
||||
- [ ] Seed featured tools selection
|
||||
- [ ] Initial contributor spotlight
|
||||
- [ ] Analytics setup (privacy-respecting)
|
||||
- [ ] Error monitoring (Sentry or similar)
|
||||
- [ ] SSL certificate configuration
|
||||
- [ ] CDN setup (optional)
|
||||
- [ ] Backup and recovery procedures
|
||||
### 7.10 Testing & QA ⚠️ Ongoing
|
||||
- [x] Responsive design testing (all breakpoints)
|
||||
- [ ] Accessibility testing (WCAG 2.1 AA) (not formally verified)
|
||||
- [ ] Cross-browser testing (Chrome, Firefox, Safari, Edge) (not formally verified)
|
||||
- [ ] Performance testing (Lighthouse scores) (not formally verified)
|
||||
- [x] Form validation testing
|
||||
- [x] Error state testing
|
||||
- [x] Mobile usability testing
|
||||
|
||||
### 7.11 Launch Preparation ✅ Complete
|
||||
- [x] Content creation (initial docs, tutorials)
|
||||
- [x] Seed featured tools selection (233+ Fabric patterns)
|
||||
- [x] Initial contributor spotlight
|
||||
- [x] Analytics setup (privacy-respecting)
|
||||
- [x] Error monitoring (Sentry or similar)
|
||||
- [x] SSL certificate configuration (via Cloudflare)
|
||||
- [ ] CDN setup (optional) (not implemented)
|
||||
- [x] Backup and recovery procedures
|
||||
|
||||
## Features Implemented Beyond Original Checklist
|
||||
|
||||
### Admin Moderation System
|
||||
- Pending tools queue with approve/reject/request-changes workflow
|
||||
- Publisher management (ban/unban, role changes)
|
||||
- Report resolution workflow
|
||||
- Audit logging for all admin actions
|
||||
- Scrutiny dashboard with auto-vetting statistics
|
||||
- Registry settings management
|
||||
|
||||
### Forum/Community
|
||||
- Categories (General, Tutorials, Showcase, Help)
|
||||
- Topics within categories
|
||||
- Replies with threading
|
||||
- View counts
|
||||
- Honeypot spam protection
|
||||
|
||||
### Reviews & Ratings
|
||||
- 5-star rating system
|
||||
- Review text with title
|
||||
- Helpful/unhelpful voting
|
||||
- Review flagging
|
||||
- Average rating aggregates
|
||||
|
||||
### Issue Tracking
|
||||
- Bug, security, compatibility issue types
|
||||
- Severity levels
|
||||
- Status workflow (open, confirmed, fixed, wontfix, duplicate)
|
||||
- Resolution notes
|
||||
|
||||
## API Endpoints for Web UI
|
||||
|
||||
The web UI consumes these existing API endpoints:
|
||||
> **Note**: This section lists the originally planned endpoints. The actual implementation includes
|
||||
> 100+ endpoints. See `src/cmdforge/registry/app.py` for the complete API.
|
||||
|
||||
The web UI consumes these API endpoints:
|
||||
|
||||
**Public (read-only):**
|
||||
- `GET /api/v1/tools` - List tools with pagination/filters
|
||||
- `GET /api/v1/tools/search?q=...` - Search tools
|
||||
- `GET /api/v1/tools/search?q=...` - Search tools with facets
|
||||
- `GET /api/v1/tools/{owner}/{name}` - Tool details
|
||||
- `GET /api/v1/tools/{owner}/{name}/versions` - Version list
|
||||
- `GET /api/v1/tools/{owner}/{name}/forks` - Fork list
|
||||
- `GET /api/v1/tools/{owner}/{name}/reviews` - Review list
|
||||
- `GET /api/v1/tools/{owner}/{name}/issues` - Issue list
|
||||
- `GET /api/v1/tools/{owner}/{name}/rating` - Rating summary
|
||||
- `GET /api/v1/categories` - Category list
|
||||
- `GET /api/v1/tags` - Tag list with counts
|
||||
- `GET /api/v1/collections` - Collection list
|
||||
- `GET /api/v1/collections/{name}` - Collection details
|
||||
- `GET /api/v1/stats/popular` - Popular tools
|
||||
- `GET /api/v1/publishers/{slug}/stats` - Publisher stats
|
||||
- `GET /api/v1/index.json` - Full index for offline use
|
||||
|
||||
**Authenticated (dashboard):**
|
||||
- `POST /api/v1/login` - User login (returns session)
|
||||
@@ -1288,13 +1344,43 @@ The web UI consumes these existing API endpoints:
|
||||
- `POST /api/v1/tokens` - Create new token
|
||||
- `DELETE /api/v1/tokens/{id}` - Revoke token
|
||||
- `PUT /api/v1/me/settings` - Update profile
|
||||
- `POST /api/v1/me/password` - Change password
|
||||
|
||||
**New endpoints for web UI:**
|
||||
**App Pairing (replaces manual token entry):**
|
||||
- `POST /api/v1/pairing/initiate` - Start pairing flow
|
||||
- `GET /api/v1/pairing/check/{username}` - Check pairing status
|
||||
- `GET /api/v1/connected-apps` - List connected apps
|
||||
- `DELETE /api/v1/connected-apps/{app_id}` - Remove app
|
||||
|
||||
**Reviews & Issues:**
|
||||
- `POST /api/v1/tools/{owner}/{name}/reviews` - Submit review
|
||||
- `PUT /api/v1/reviews/{id}` - Edit review
|
||||
- `DELETE /api/v1/reviews/{id}` - Delete review
|
||||
- `POST /api/v1/reviews/{id}/vote` - Vote on review
|
||||
- `POST /api/v1/reviews/{id}/flag` - Flag review
|
||||
- `POST /api/v1/tools/{owner}/{name}/issues` - Report issue
|
||||
- `PUT /api/v1/issues/{id}` - Update issue
|
||||
- `POST /api/v1/issues/{id}/resolve` - Resolve issue
|
||||
|
||||
**Content & Featured:**
|
||||
- `GET /api/v1/featured/tools` - Curated featured tools
|
||||
- `GET /api/v1/featured/contributors` - Featured contributor
|
||||
- `GET /api/v1/content/announcements` - Site announcements
|
||||
- `POST /api/v1/reports` - Abuse report submission
|
||||
|
||||
**Admin Endpoints (moderator/admin role required):**
|
||||
- `GET /api/v1/admin/tools/pending` - Pending moderation queue
|
||||
- `POST /api/v1/admin/tools/{id}/approve` - Approve tool
|
||||
- `POST /api/v1/admin/tools/{id}/reject` - Reject tool
|
||||
- `POST /api/v1/admin/tools/{id}/request-changes` - Request changes
|
||||
- `GET /api/v1/admin/publishers` - Publisher management
|
||||
- `POST /api/v1/admin/publishers/{id}/ban` - Ban publisher
|
||||
- `GET /api/v1/admin/reports` - Report queue
|
||||
- `GET /api/v1/admin/scrutiny` - Scrutiny dashboard
|
||||
- `GET /api/v1/admin/audit-log` - Audit log
|
||||
- `GET /api/v1/admin/settings` - Registry settings
|
||||
- `PUT /api/v1/admin/settings/{key}` - Update setting
|
||||
|
||||
## Diagram References
|
||||
|
||||
- Landing page mockup: `discussions/diagrams/cmdforge-registry_rob_6.svg`
|
||||
|
||||
Reference in New Issue
Block a user