Added
Added
1 item
edge function migrations / webhook-router + seo-api (#163)
- edge function migrations / webhook-router + seo-api (#163)
Loading...
Track all updates, new features, bug fixes, and improvements to Claude Pro Directory.
edge function migrations / webhook-router + seo-api (#163)
major API migration, companies system, and codebase modernization (#180)
auth/sign-in updates & design changes (#156)
migrate markdown copy -> supabase edge function + optimizations
major metadata migration (codebase -> edge function) (#160)
migrations + refactors from codebase -> database (llms.txt, RSS/Atom feeds, sitemap generator, etc) (#159)
major consolidations/migration from supazod -> database.types.ts (#157)
remove dead features and Product Hunt campaign infrastructure (#162)
homepage "All" section scroll
coderabbit suggestions
coderabbit fixes + nitpicks
coderabbit gripes
merge-issues
auth/sign-in updates & design changes (#156)
migrate markdown copy -> supabase edge function + optimizations
major metadata migration (codebase -> edge function) (#160)
migrations + refactors from codebase -> database (llms.txt, RSS/Atom feeds, sitemap generator, etc) (#159)
major consolidations/migration from supazod -> database.types.ts (#157)
remove dead features and Product Hunt campaign infrastructure (#162)
homepage "All" section scroll
coderabbit suggestions
coderabbit fixes + nitpicks
coderabbit gripes
merge-issues
Pattern System - 8 route patterns with template-driven metadata generation for all 41 routes
Route Classifier - Automated pattern detection with confidence scoring (0.0-1.0)
Route Scanner - Static analysis tool to discover all application routes without runtime overhead
Metadata Templates - Centralized templates with smart truncation/padding for SEO compliance
Unified Validation - New validate:metadata script consolidating title/description validation with pattern system integration
October 2025 SEO Standards - Title: 53-60 chars (keyword density), Description: 150-160 chars (AI-optimized), Keywords: 3-10 max
Metadata Generation - Migrated from METADATA_REGISTRY lookup to pattern-based templates
Title Format - Hyphen separators (-) instead of pipes (|) for 2025 SEO best practices
Git Hooks - Added metadata validation on pre-commit for SEO files (lefthook.yml)
Validation Scripts - Consolidated verify-titles.ts into validate-metadata.ts with route scanner integration
Legacy Code Cleanup - Removed 2,017 lines including METADATA_REGISTRY (1,627 lines), buildPageTitle(), buildContentTitle(), smartTruncate(), and TIER 2 registry lookup
TL;DR: Migrated from 1,600+ lines of legacy metadata code to a modern pattern-based architecture with template-driven metadata generation. All 41 routes now use 8 reusable patterns, achieving 100% coverage with titles (53-60 chars) and descriptions (150-160 chars) optimized for October 2025 SEO standards and AI search engines.
Replaced legacy metadata registry system with enterprise-grade pattern-based architecture. Implemented 8 route patterns (HOMEPAGE, CATEGORY, CONTENT_DETAIL, USER_PROFILE, ACCOUNT, TOOL, STATIC, AUTH) with dedicated templates, automated route classification, and intelligent metadata generation. Removed 2,017 lines of dead code while adding consolidated validation tooling and git hook integration.
validate:metadata script consolidating title/description validation with pattern system integrationCategory Stats Configuration (src/lib/config/category-config.ts)
New CategoryStatsConfig interface for homepage stats display
getCategoryStatsConfig() function dynamically generates stats config from registry
Auto-derives icons, display text, and animation delays from UNIFIED_CATEGORY_REGISTRY
Comprehensive JSDoc documentation on configuration-driven architecture
Type System Improvements
Generic CategoryMetadata and EnrichedMetadata types replace manual unions
All types now derive from registry instead of hardcoded lists
Future-proof: Works with any category in UNIFIED_CATEGORY_REGISTRY
Homepage Data Loading (src/app/page.tsx)
Before: 7+ hardcoded category variables (rulesData, mcpData, agentsData, etc.) with manual destructuring
After: Dynamic Record<CategoryId, Metadata[]> generated from getAllCategoryIds()
Impact: Skills automatically included in data fetching, enrichment, and transformation pipelines
Reduced LOC: ~100 lines of hardcoded patterns eliminated
Added comprehensive inline documentation explaining Modern 2025 Architecture patterns
Homepage Stats Display (src/components/features/home/index.tsx)
Before: 7 hardcoded stat counters with manual icon mapping
After: Dynamic map() over getCategoryStatsConfig() from registry
Impact: Skills stat counter appears automatically with correct icon and animation timing
Zero manual updates required when adding categories
Maintains staggered animation timing (100ms delays auto-calculated)
Lazy Content Loaders (src/components/shared/lazy-content-loaders.tsx)
Before: Hardcoded loader object with 7 explicit category entries
After: Dynamic buildLazyContentLoaders() factory function generating loaders from registry
Impact: Skills loader automatically created and tree-shakeable
Future categories require zero changes to this file
Content Utilities (src/lib/utils/content.utils.ts)
Before: transformForHomePage() with hardcoded 8-property object type
After: Generic Record<string, ContentItem[]> with dynamic transformation
Impact: Handles any number of categories without type changes
Simplified from 25 lines of hardcoded transforms to 10 lines of dynamic logic
TypeScript Schema (src/lib/schemas/components/page-props.schema.ts)
Before: Hardcoded stats object with 7 category properties
After: z.record(z.string(), z.number()) for dynamic categories
Impact: Skills (and future categories) automatically type-safe
Eliminated TypeScript compiler errors when adding categories
TL;DR: Eliminated all hardcoded category references throughout the codebase. Homepage, stats display, data loading, and type systems now derive dynamically from UNIFIED_CATEGORY_REGISTRY. Adding new categories (like Skills) requires zero manual updates across the application - everything auto-updates from a single configuration source.
Refactored the entire homepage and content loading architecture from hardcoded category lists to configuration-driven dynamic generation. This architectural improvement means Skills (and any future categories) automatically appear in all homepage sections (Featured, Stats, All/Infinity Scroll) without manual intervention.
Homepage Data Loading (src/app/page.tsx)
rulesData, mcpData, agentsData, etc.) with manual destructuringRecord<CategoryId, Metadata[]> generated from getAllCategoryIds()Homepage Stats Display (src/components/features/home/index.tsx)
map() over getCategoryStatsConfig() from registryLazy Content Loaders (src/components/shared/lazy-content-loaders.tsx)
buildLazyContentLoaders() factory function generating loaders from registryContent Utilities (src/lib/utils/content.utils.ts)
transformForHomePage() with hardcoded 8-property object typeRecord<string, ContentItem[]> with dynamic transformationTypeScript Schema (src/lib/schemas/components/page-props.schema.ts)
stats object with 7 category propertiesz.record(z.string(), z.number()) for dynamic categoriesCategory Stats Configuration (src/lib/config/category-config.ts)
CategoryStatsConfig interface for homepage stats displaygetCategoryStatsConfig() function dynamically generates stats config from registryUNIFIED_CATEGORY_REGISTRYType System Improvements
CategoryMetadata and EnrichedMetadata types replace manual unionsUNIFIED_CATEGORY_REGISTRYBadge System Configuration - Centralized badge registry with 5 categories (Community, Contribution, Achievement, Special, Milestone), 4 rarity levels (Common to Legendary), and extensible award criteria system
Reputation System - 6-tier progression system (Newcomer → Legend) with configurable point values for posts (10), votes (5), comments (2), submissions (20), reviews (5), bookmarks (3), and followers (1)
Badge Award Criteria - Type-safe criteria system supporting reputation thresholds, count-based achievements, activity streaks, special conditions, and composite multi-criteria badges
User Profile Integration - Public badge display with featured badge selection (max 5), reputation breakdown visualization, and tier progress indicators
Badge Components - BadgeGrid for showcase display, BadgeNotification for award toasts, ReputationBreakdown with progress bars and tier visualization
Server Actions - Authentication-protected actions for badge management: getUserBadges, getFeaturedBadges, toggleBadgeFeatured, checkBadgeEligibility, getRecentlyEarnedBadges
Public Queries - Unauthenticated functions for profile viewing: getPublicUserBadges, userHasBadge, badge registry queries
Badge Repository - Complete CRUD operations with Supabase integration: findByUser, findFeaturedByUser, toggleFeatured, findRecentlyEarned, hasUserBadge
"NEW" Badge Feature - Automatic badge display on content added within last 7 days across all preview cards (agents, rules, commands, skills, collections)
Content Age Detection - isNewContent() utility function with date validation and 0-7 day range checking
Responsive Card Utilities - Three new UI constants: CARD_BADGE_CONTAINER, CARD_FOOTER_RESPONSIVE, CARD_METADATA_BADGES for mobile-first layouts
Homepage Featured Sorting - Updated fallback algorithm to sort by newest content (dateAdded DESC) instead of alphabetical, improving homepage freshness
User Profile Layout - Redesigned activity sidebar with reputation breakdown as primary stat, added badge showcase section, removed redundant reputation display
BaseCard Component - Applied responsive utilities for mobile/tablet optimization: tags wrap at breakpoints, footer stacks vertically on mobile, metadata badges flex-wrap on small screens
Safe Action Middleware - Extended category enum to support future reputation/badge actions (structure prepared for expansion)
TypeScript Strict Mode - Resolved 12 undefined access errors in reputation.config.ts with proper TypeScript guards for array access and optional values
Optional Parameters - Fixed badge action parameter handling with nullish coalescing for limit/offset defaults
Repository Type Safety - Added conditional option objects to avoid exactOptionalPropertyTypes violations in badge queries
TL;DR: Implemented comprehensive badge and reputation system for community gamification with 6 reputation tiers, 20+ achievement badges, and public profile integration. Added UI/UX improvements including "NEW" badges for recent content (0-7 days), newest-first sorting for homepage featured sections, and mobile-responsive card layouts for better mobile/tablet experience.
Added production-grade gamification infrastructure to drive community engagement through reputation scoring, achievement badges, and tier progression. The system features type-safe badge definitions, automated award criteria, featured badge showcase on user profiles, and real-time reputation tracking with visual breakdown. Complemented by three UX improvements: automatic "NEW" badges highlighting recent content, improved homepage freshness with newest-first featured sorting, and responsive card design optimizations for mobile/tablet devices.
BadgeGrid for showcase display, BadgeNotification for award toasts, ReputationBreakdown with progress bars and tier visualizationgetUserBadges, getFeaturedBadges, toggleBadgeFeatured, checkBadgeEligibility, getRecentlyEarnedBadgesgetPublicUserBadges, userHasBadge, badge registry queriesfindByUser, findFeaturedByUser, toggleFeatured, findRecentlyEarned, hasUserBadgeisNewContent() utility function with date validation and 0-7 day range checkingCARD_BADGE_CONTAINER, CARD_FOOTER_RESPONSIVE, CARD_METADATA_BADGES for mobile-first layoutsdateAdded DESC) instead of alphabetical, improving homepage freshnessreputation.config.ts with proper TypeScript guards for array access and optional valuesexactOptionalPropertyTypes violations in badge queriesSkills Category (7 new)
Playwright E2E Testing Automation - Cross-browser testing with AI-powered test generation, MCP integration
Cloudflare Workers AI Edge Functions - Edge computing with 40% market share, sub-5ms cold starts
WebAssembly Module Development - WASM with WASI 0.3, Component Model, multi-language support
tRPC Type-Safe API Builder - End-to-end type safety without code generation, T3 Stack integration
PostgreSQL Query Optimization - Performance tuning with EXPLAIN, indexing strategies, workload-specific optimization
Zod Schema Validator - TypeScript-first runtime validation with automatic type inference
Supabase Realtime Database Builder - $100M Series E platform with 4M+ developers, Multigres enterprise features
Rules Category (7 new)
React Server Components Expert - React 19 + Next.js 15 App Router patterns, async components, Suspense streaming
Next.js 15 Performance Architect - Turbopack optimization, Partial Prerendering, Core Web Vitals best practices
GraphQL Federation Specialist - Apollo Federation patterns, microservices architecture, schema composition
Kubernetes DevSecOps Engineer - Pod security standards, RBAC, GitOps with ArgoCD, network policies
Terraform Infrastructure Architect - IaC module design, AI-assisted generation, multi-cloud deployments
AI Prompt Engineering Expert - Coding-specific patterns, context management, iterative refinement techniques
WCAG Accessibility Auditor - WCAG 2.2 Level AA compliance, ARIA patterns, automated testing tools
Agents Category (6 new)
AI DevOps Automation Engineer - Predictive analytics (38.20% CAGR market), self-healing infrastructure, CI/CD optimization
Full-Stack AI Development Agent - Frontend/backend/AI-ML integration, 30% faster development cycles, end-to-end type safety
AI Code Review Security Agent - OWASP Top 10 detection, secrets scanning, dependency vulnerability analysis
Data Pipeline Engineering Agent - Real-time Kafka streaming, Airflow orchestration, dbt transformations, data quality validation
Product Management AI Agent - User story generation, RICE prioritization, A/B testing, product analytics tracking
Cloud Infrastructure Architect Agent - Multi-cloud design (AWS/GCP/Azure), cost optimization, disaster recovery automation
TL;DR: Added 20 high-value, keyword-optimized content pieces validated against October 2025 trends across Skills (7), Rules (7), and Agents (6) categories. All content features production-ready code examples, comprehensive documentation, and targets trending technologies with strong SEO potential.
Conducted extensive market research and keyword analysis to identify the most valuable, trending content opportunities for October 2025. All 20 pieces are validated against current industry data, feature complete implementation examples, and target high-traffic keywords with minimal competition.
Skills Category (7 new)
Rules Category (7 new)
Agents Category (6 new)
Agents Category (4 new)
Multi-Agent Orchestration Specialist - LangGraph (2k+ commits/month) + CrewAI (30k+ stars) coordination patterns, graph-based workflows
Semantic Kernel Enterprise Agent - Microsoft enterprise AI with C#/Python/Java SDK, Azure AI Foundry integration
AutoGen Conversation Agent Builder - AutoGen v0.4 actor model (January 2025 rewrite), cross-language Python + .NET messaging
Domain Specialist AI Agents - Healthcare HIPAA compliance, Legal contract analysis, Financial risk assessment with industry-specific knowledge bases
Statuslines Category (4 new)
Multi-Provider Token Counter - Real-time tracking for Claude 1M, GPT-4.1 1M, Gemini 2.x 1M, Grok 3 1M with color-coded warnings
MCP Server Status Monitor - Connected MCP server and tools monitoring for October 2025 plugin support
Starship Powerline Theme - Nerd Font statusline replacing Powerlevel10k with Git integration
Real-Time Cost Tracker - Per-session AI cost analytics with 2025 model pricing and budget threshold alerts
Rules Category (4 new)
TypeScript 5.x Strict Mode Expert - Template literal types, strict null checks, type guards, ESLint integration for enterprise-grade type safety
React 19 Concurrent Features Specialist - useTransition, useDeferredValue, Suspense boundaries, streaming SSR, selective hydration patterns
Windsurf AI-Native IDE Patterns - Cascade AI flows, multi-file context awareness, Flow collaboration (emerging Copilot alternative)
Security-First React Components - XSS prevention, CSP integration, input sanitization, OWASP Top 10 mitigation patterns
Commands Category (4 new)
/v0-generate - V0.dev UI component generator with shadcn/ui, TailwindCSS v4, and Next.js 15 integration (breakthrough in AI UI generation)
/autogen-workflow - Microsoft AutoGen v0.4 multi-agent orchestration with role-based task delegation
/mintlify-docs - AI-powered documentation generation with MDX components and OpenAPI spec automation
/cursor-rules - Project-specific .cursorrules file generator for AI-native development with tech stack integration
Skills Category (4 new)
V0 Rapid Prototyping Workflow - Production-ready React components with V0 patterns, shadcn/ui integration, instant UI generation
Windsurf Collaborative Development - AI-native IDE mastery with Cascade AI and Flow patterns for team coordination
GitHub Actions AI-Powered CI/CD - Intelligent pipeline generation, security scanning, multi-environment deployment orchestration
Mintlify Documentation Automation - Beautiful docs from TypeScript/OpenAPI specs with interactive MDX components
TL;DR: Added 20 cutting-edge, AI-native development content pieces validated against October 2025 trends across Agents (4), Statuslines (4), Rules (4), Commands (4), and Skills (4) categories. All content features production-ready patterns for multi-agent orchestration, AI-powered workflows, and next-generation development tools with strong SEO potential.
Conducted comprehensive market research targeting October 2025's most transformative AI-native development trends. All 20 pieces validated against current industry data including Microsoft AutoGen v0.4's January 2025 rewrite, LangGraph's 2k+ monthly commits, and the emergence of Windsurf as a Copilot alternative. Content targets high-value keywords in the rapidly growing AI development tools market.
Agents Category (4 new)
Statuslines Category (4 new)
Rules Category (4 new)
Commands Category (4 new)
Skills Category (4 new)
BetterStack Environment Variables - Added BETTERSTACK_HEARTBEAT_DAILY_MAINTENANCE and BETTERSTACK_HEARTBEAT_WEEKLY_TASKS to server environment schema with Zod urlString validation
Success-Only Heartbeat Pattern - Implemented non-blocking heartbeat pings that only fire when all cron tasks complete successfully (failedTasks === 0)
Graceful Error Handling - Heartbeat failures logged as warnings but don't break cron execution, with 5-second timeout for reliability
Security-First Implementation - Lazy imports to avoid circular dependencies, server-only execution, no secrets in repository
TL;DR: Implemented secure BetterStack heartbeat monitoring for Vercel cron jobs to automatically detect failures and send alerts when scheduled tasks don't complete successfully. Uses success-only reporting pattern with environment variable configuration for open-source security.
Added BetterStack heartbeat monitoring integration to both Vercel cron jobs (daily maintenance and weekly tasks) following open-source security best practices. Heartbeat URLs are stored as environment variables and only sent on successful task completion. BetterStack automatically alerts when expected heartbeats don't arrive, providing reliable uptime monitoring for critical scheduled operations.
BETTERSTACK_HEARTBEAT_DAILY_MAINTENANCE and BETTERSTACK_HEARTBEAT_WEEKLY_TASKS to server environment schema with Zod urlString validationSchema & Type System
Created skill.schema.ts with Zod validation for skill-specific fields (requirements, prerequisites, examples, installation steps, troubleshooting)
Integrated Skills into ContentType unions across schemas and components
Added Skills to content loaders and batch utilities for tree-shakeable imports
Routing & UI
Skills now use unified [category] dynamic routes (/skills and /skills/[slug])
Created configuration for skill detail sections (Guide, Installation, Examples, Troubleshooting)
Added Skills navigation link with "New" badge in header and mobile navigation
Enhanced ConfigCard to display skill-specific metadata (difficulty, prerequisites count)
Build Pipeline
Integrated Skills into BUILD_CATEGORY_CONFIGS for automated build processing
Added Skills to static API generation (/api/skills.json)
Skills included in sitemap generation and URL builder
Search index automatically includes Skills content
SEO & Structured Data
Added Skills metadata patterns to centralized registry
Configured JSON-LD structured data (HowTo schema for guides, CreativeWork for examples)
LLMs.txt generation for /skills/llms.txt and /skills/[slug]/llms.txt routes
Optimized metadata with category-specific title/description derivation
Validation & CI
Extended content validators to recognize skills category
Updated security validators and regex patterns across authentication and rate limiting
Added Skills to GitHub Actions content-validation workflow
LLMs.txt E2E tests now verify Skills routes
Community Features
Created announcement promoting Skills category launch
Users can submit Skills through the web interface
Skills tracked in submission analytics and community leaderboards
Navigation Badges
Moved "New" indicator from Statuslines and Collections to Skills
Updated navigation configuration to highlight Skills as latest category
Analytics Mapping
Skills analytics reuse existing category buckets for efficient tracking
No new analytics infrastructure required (consolidation principle)
TL;DR: Added new Skills category for task-focused capability guides covering document/data workflows (PDF, DOCX, PPTX, XLSX). Full platform integration with unified routing, SEO optimization, structured data, and build pipeline support.
Introduced Skills as a first-class content category within the platform's unified architecture. Skills provide step-by-step capability guides for specific tasks (e.g., PDF generation, Excel processing, document conversion) with sections for requirements, installation, examples, and troubleshooting.
Schema & Type System
skill.schema.ts with Zod validation for skill-specific fields (requirements, prerequisites, examples, installation steps, troubleshooting)ContentType unions across schemas and componentsRouting & UI
[category] dynamic routes (/skills and /skills/[slug])ConfigCard to display skill-specific metadata (difficulty, prerequisites count)Build Pipeline
BUILD_CATEGORY_CONFIGS for automated build processing/api/skills.json)SEO & Structured Data
/skills/llms.txt and /skills/[slug]/llms.txt routesValidation & CI
skills categoryCommunity Features
Navigation Badges
Analytics Mapping
Latest Features:
Platform Improvements:
Community:
Full schema + build integration:
New Zod schema skill.schema.ts with content-first fields (requirements, examples, installation, troubleshooting).
Integrated into build pipeline, static API generation, content loaders, and unions.
SEO and Structured Data:
Metadata registry, derivation rules, and JSON-LD (HowTo/CreativeWork/SourceCode when examples exist).
LLMs.txt inclusion for category and item routes.
Routing and UI:
Category configs and content-type configs (sections: Guide, Installation, Examples, Troubleshooting).
Navigation link with "New" indicator (moved from Statuslines/Collections to Skills).
APIs and Search:
/api/skills.json and search index generation.
Sitemap/URL generator now includes skills.
Validation and CI:
Content validator updated for skills.
Security validators/regex and content-validation workflow updated.
LLMs.txt validator includes skills routes.
Announcements:
New announcement promoting Skills launch.
Removed "New" badge from Statuslines and Collections; applied to Skills.
TL;DR: Introduced Skills as a new main content category for task-focused capability guides (document/data workflows). Fully integrated into build pipeline, SEO infrastructure, routing, search, and validation with configuration-driven updates that minimize new code and maximize reuse of existing systems.
Skills — task-focused capability guides for Claude (document/data workflows).skill.schema.ts with content-first fields (requirements, examples, installation, troubleshooting)./api/skills.json and search index generation.skills.Dynamic Routing Architecture
Collections now use [category] dynamic routes instead of custom /collections routes
Created CollectionDetailView component for specialized collection rendering
Enhanced ConfigCard to display collection-specific badges (collection type, difficulty, item count)
Added tree-shakeable collection logic that only loads when category === 'collections'
Deleted 3 obsolete custom route files (collections/page.tsx, collections/[slug]/page.tsx, collections/[slug]/llms.txt/route.ts)
Schema & Type Safety
Added collection-specific properties to UnifiedContentItem schema (collectionType, items, prerequisites, installationOrder, compatibility)
Enabled nested collections support (collections can now reference other collections)
Updated ContentType unions across 6 components to include 'collections'
Enhanced submission stats schema to track collection contributions
Platform Integration
Caching: Added collections to Redis trending cleanup and cache invalidation logic
Search: Added collections to search filtering and API validation schemas
Related Content: Collections now receive same visibility boost as other main categories
Service Worker: Added collections to offline caching regex patterns
Submit Form: Users can now submit collections through the web interface
Analytics: Collection submissions tracked in community leaderboards
SEO & Metadata
Removed redundant /collections hardcoded routes from metadata registry
Collections now handled by unified /:category and /:category/:slug metadata patterns
Maintains all SEO optimizations with cleaner, more maintainable architecture
Testing & Validation
Added collections to E2E test coverage (accessibility, SEO, llms.txt generation)
Updated content validation scripts to verify collections discovery
Added collections to sitemap parity tests
TL;DR: Consolidated Collections into the unified dynamic category routing system alongside Agents, MCP Servers, Rules, Commands, Hooks, and Statuslines. Collections now benefit from uniform handling across the entire platform while maintaining all specialized features like nested collections, prerequisites, installation order, and compatibility tracking.
Integrated Collections as a first-class content category within the platform's dynamic routing architecture. Previously, Collections used custom routes (/collections and /collections/[slug]). Now they follow the same pattern as other main categories (/[category] and /[category]/[slug]), enabling uniform treatment across search, caching, analytics, and all platform features.
Dynamic Routing Architecture
[category] dynamic routes instead of custom /collections routesCollectionDetailView component for specialized collection renderingConfigCard to display collection-specific badges (collection type, difficulty, item count)category === 'collections'collections/page.tsx, collections/[slug]/page.tsx, collections/[slug]/llms.txt/route.ts)Schema & Type Safety
UnifiedContentItem schema (collectionType, items, prerequisites, installationOrder, compatibility)ContentType unions across 6 components to include 'collections'Platform Integration
SEO & Metadata
/collections hardcoded routes from metadata registry/:category and /:category/:slug metadata patternsTesting & Validation
Core Framework Updates
React: 19.1.1 → 19.2.0
React DOM: 19.1.1 → 19.2.0
@types/react: 19.1.17 → 19.2.2
@types/react-dom: 19.1.11 → 19.2.2
@types/node: 24.6.0 → 24.7.2
Next.js: 15.5.4 → 15.5.5
UI Library Updates
Recharts: 2.15.4 → 3.2.1 (major version upgrade)
Framer Motion: 12.23.22 → 12.23.24
Fumadocs UI: 15.8.2 → 15.8.5
Fumadocs OpenAPI: 9.4.0 → 9.5.1
Security & Infrastructure
Arcjet Next: 1.0.0-beta.12 → 1.0.0-beta.13
Nosecone Next: 1.0.0-beta.12 → 1.0.0-beta.13
Supabase JS: 2.48.1 → 2.75.0
Build Tools & Styling
TailwindCSS: 4.1.13 → 4.1.14
TailwindCSS PostCSS: 4.1.13 → 4.1.14
TSX: 4.20.5 → 4.20.6
Biome: 2.2.5 → 2.2.6
Development Dependencies
Jest Axe: 8.0.0 → 10.0.0
Knip: 5.64.1 → 5.65.0
Lefthook: 1.13.5 → 1.13.6
Ultracite: 5.4.6 → 5.6.2
Next Bundle Analyzer: 15.5.4 → 15.5.5
Other Dependencies
Marked: 16.3.0 → 16.4.0
Zod: 4.1.11 → 4.1.12
Svix: 1.76.1 → 1.77.0
Upstash Redis: 1.35.4 → 1.35.5
React Email Render: 1.3.1 → 1.3.2
TypeScript Safety (src/components/ui/chart.tsx)
Enhanced type definitions for Recharts v3 compatibility
Added explicit TooltipPayload type for better type inference
Fixed implicit any types in chart tooltip and legend components
Improved type safety for payload arrays and value rendering
Added proper null checks and type guards for chart data
Chart Components (src/components/features/reviews/rating-histogram.tsx)
Updated formatter function signature for Recharts v3 compatibility
Ensured type-safe label formatting in rating distribution charts
TL;DR: Updated core dependencies including React 19.2, Next.js 15.5.5, and Recharts 3.2, with enhanced TypeScript safety across chart components to ensure compatibility with the latest package versions.
Updated dependencies to latest stable versions and resolved TypeScript compatibility issues introduced by package updates, particularly with the Recharts library upgrade from v2 to v3.
Core Framework Updates
UI Library Updates
Security & Infrastructure
Build Tools & Styling
Development Dependencies
Other Dependencies
TypeScript Safety (src/components/ui/chart.tsx)
TooltipPayload type for better type inferenceany types in chart tooltip and legend componentsChart Components (src/components/features/reviews/rating-histogram.tsx)
Branded Types for IDs (src/lib/schemas/branded-types.schema.ts)
UserId - UUID-validated branded type for user identifiers
SessionId - UUID-validated branded type for session identifiers
ContentId - Slug-validated branded type for content identifiers (alphanumeric with hyphens)
Helper functions: createUserId(), createSessionId(), toContentId(slug)
Compile-time prevention of mixing IDs from different domains
Runtime validation ensures correct format (UUID vs slug patterns)
Zero runtime overhead with Zod's brand feature
Centralized Input Sanitization (src/lib/schemas/primitives/sanitization-transforms.ts)
13 reusable transform functions replacing 11+ inline duplicates
normalizeEmail() - RFC 5322 compliant email normalization
normalizeString() - Lowercase + trim for consistent storage
trimString(), trimOptionalString(), trimOptionalStringOrEmpty() - String cleanup variants
stringToBoolean() - Handles common truthy/falsy string representations
parseContentType() - Extracts base content type from HTTP headers
Security-focused: Null byte checks, path traversal prevention, injection protection
Single source of truth for all input sanitization
Cursor Pagination Schema (src/lib/schemas/primitives/cursor-pagination.schema.ts)
Type-safe cursor-based pagination for scalable API endpoints
Opaque cursor implementation for security
Configurable page sizes with validation
Unified SEO Title Verification (scripts/verify-titles.ts)
Consolidated 3 separate scripts into single comprehensive tool
Validates all titles across agents, MCP servers, rules, commands, hooks, statuslines, collections, and guides
Checks for empty titles, duplicates, and SEO optimization
Detailed reporting with color-coded output
Personalization Schemas (6 schemas updated)
userInteractionSchema - Now uses userIdSchema, contentIdSchema, sessionIdSchema
affinityScoreSchema - Uses branded types for user and content identification
userSimilaritySchema - Uses userIdSchema for both user_a_id and user_b_id
contentSimilaritySchema - Uses contentIdSchema for content slugs
personalizedRecommendationSchema - Slug field now ContentId type
All analytics event schemas updated with branded types
Schema Consolidation (5 files refactored)
newsletter.schema.ts - Replaced inline transform with normalizeEmail()
analytics.schema.ts - Replaced inline transform with normalizeString()
middleware.schema.ts - Replaced complex parsing with parseContentType()
form.schema.ts - Replaced 4 inline transforms with centralized functions
search.schema.ts - Replaced 7 inline transforms (4 trim + 3 boolean conversions)
Database Actions (6 files updated)
follow-actions.ts - Uses userIdSchema in followSchema with validation
interaction-actions.ts - Converts database strings to branded types at boundaries
personalization-actions.ts - All recommendation responses use toContentId() conversion
affinity-scorer.ts - Affinity calculations use ContentId type
Type-safe boundaries between database (plain strings) and application (branded types)
Proper validation at conversion points
Build Scripts (4 scripts improved)
Migrated 65+ console statements to structured production logger
generate-openapi.ts - 20 console statements → logger with metadata
validate-llmstxt.ts - 27 console statements → structured logging
optimize-titles.ts - 15 console statements → logger with structured data
generate-sitemap.ts - Added alphabetical URL sorting for better git diffs
Consistent logging format across all build tools
Linting Issues (6 issues resolved)
Removed unused colors constant from validate-llmstxt.ts (proper deletion vs suppression)
Fixed proper error logging in catch blocks (2 instances)
Added missing existsSync import in submit-indexnow.ts
Added explicit type annotation for stat variable
Used template literals for string concatenation in optimize-titles.ts
All fixes follow production-ready principles (no suppression with underscores)
ID Mixing Prevention: Compile-time errors when using wrong ID type
Input Validation: All user inputs sanitized through centralized transforms
Format Enforcement: Runtime validation of UUID and slug patterns
Null Byte Protection: Sanitization transforms check for injection attempts
Legacy Configuration Files
config/tools/lighthouserc.json - Redundant (kept production .cjs version)
config/tools/depcheck.json - Unused tool configuration
Duplicate Scripts
scripts/verify-all-titles.ts - Functionality merged into verify-titles.ts
scripts/verify-seo-titles.ts - Consolidated into unified verification script
TL;DR: Implemented branded types for user/session/content IDs with compile-time safety, centralized input sanitization transforms into 13 reusable functions, and enhanced schema validation across the personalization engine. These changes improve type safety, eliminate duplicate code, and provide better protection against ID mixing bugs.
Major refactoring to enhance type safety and schema validation across the platform. Introduced branded types using Zod's nominal typing feature to prevent ID confusion at compile time, consolidated duplicate input sanitization logic, and improved validation consistency throughout the codebase.
Branded Types for IDs (src/lib/schemas/branded-types.schema.ts)
UserId - UUID-validated branded type for user identifiersSessionId - UUID-validated branded type for session identifiersContentId - Slug-validated branded type for content identifiers (alphanumeric with hyphens)createUserId(), createSessionId(), toContentId(slug)Centralized Input Sanitization (src/lib/schemas/primitives/sanitization-transforms.ts)
normalizeEmail() - RFC 5322 compliant email normalizationnormalizeString() - Lowercase + trim for consistent storagetrimString(), trimOptionalString(), trimOptionalStringOrEmpty() - String cleanup variantsstringToBoolean() - Handles common truthy/falsy string representationsparseContentType() - Extracts base content type from HTTP headersCursor Pagination Schema (src/lib/schemas/primitives/cursor-pagination.schema.ts)
Unified SEO Title Verification (scripts/verify-titles.ts)
Personalization Schemas (6 schemas updated)
userInteractionSchema - Now uses userIdSchema, contentIdSchema, sessionIdSchemaaffinityScoreSchema - Uses branded types for user and content identificationuserSimilaritySchema - Uses userIdSchema for both user_a_id and user_b_idcontentSimilaritySchema - Uses contentIdSchema for content slugspersonalizedRecommendationSchema - Slug field now ContentId typeSchema Consolidation (5 files refactored)
newsletter.schema.ts - Replaced inline transform with normalizeEmail()analytics.schema.ts - Replaced inline transform with normalizeString()middleware.schema.ts - Replaced complex parsing with parseContentType()form.schema.ts - Replaced 4 inline transforms with centralized functionssearch.schema.ts - Replaced 7 inline transforms (4 trim + 3 boolean conversions)Database Actions (6 files updated)
follow-actions.ts - Uses userIdSchema in followSchema with validationinteraction-actions.ts - Converts database strings to branded types at boundariespersonalization-actions.ts - All recommendation responses use toContentId() conversionaffinity-scorer.ts - Affinity calculations use ContentId typeBuild Scripts (4 scripts improved)
generate-openapi.ts - 20 console statements → logger with metadatavalidate-llmstxt.ts - 27 console statements → structured loggingoptimize-titles.ts - 15 console statements → logger with structured datagenerate-sitemap.ts - Added alphabetical URL sorting for better git diffsLegacy Configuration Files
config/tools/lighthouserc.json - Redundant (kept production .cjs version)config/tools/depcheck.json - Unused tool configurationDuplicate Scripts
scripts/verify-all-titles.ts - Functionality merged into verify-titles.tsscripts/verify-seo-titles.ts - Consolidated into unified verification scriptcolors constant from validate-llmstxt.ts (proper deletion vs suppression)existsSync import in submit-indexnow.tsBranded Type Pattern:
// Schema definition
export const contentIdSchema = nonEmptyString
.max(200)
.regex(/^[a-z0-9]+(?:-[a-z0-9]+)*$/)
.brand<'ContentId'>();
export type ContentId = z.infer<typeof contentIdSchema>;
// Helper function for conversion
export function toContentId(slug: string): ContentId {
return contentIdSchema.parse(slug);
}
// Usage in schemas
const interactionSchema = z.object({
content_slug: contentIdSchema, // Validated at schema level
});
// Conversion at boundaries
const recommendations = items.map(item => ({
slug: toContentId(item.slug), // Convert database string to branded type
}));
Sanitization Transform Pattern:
// Before: Inline duplicate code (11+ instances)
email: z.string().email().transform((val) => val.toLowerCase().trim())
// After: Centralized reusable function
import { normalizeEmail } from './primitives/sanitization-transforms';
email: z.string().email().transform(normalizeEmail)
When working with user/session/content identifiers:
// ✅ Correct: Use branded types in schemas
import { userIdSchema, contentIdSchema } from '@/lib/schemas/branded-types.schema';
const schema = z.object({
user_id: userIdSchema,
content_slug: contentIdSchema,
});
// ✅ Correct: Convert at boundaries
import { toContentId } from '@/lib/schemas/branded-types.schema';
const contentId = toContentId(databaseSlug); // Validates and converts
// ❌ Incorrect: Don't mix ID types
const userId: UserId = sessionId; // Compile-time error!
When adding input sanitization:
// ✅ Correct: Use centralized transforms
import { normalizeEmail, trimString } from '@/lib/schemas/primitives/sanitization-transforms';
email: z.string().email().transform(normalizeEmail)
// ❌ Incorrect: Don't write inline transforms
email: z.string().email().transform((val) => val.toLowerCase().trim())
Meteor Background Animation (src/components/ui/magic/meteors.tsx)
Animated shooting stars effect across hero section
20 meteors with randomized timing and positioning
Constrained to above-the-fold viewport (max-h-screen)
GPU-accelerated CSS animations for 60fps performance
Comet-style design with gradient tails and accent color glow
Configurable angle (35°), speed (3-8s), and delay (0-3s)
Rolling Text Animation (src/components/ui/magic/rolling-text.tsx)
Character-by-character 3D rotation effect (shadcn-style)
Cycles through words: enthusiasts → developers → power users → beginners → builders
Hardware-accelerated transforms with proper perspective
Smooth easing with custom cubic-bezier curve [0.16, 1, 0.3, 1]
600ms rotation duration with 50ms character delays
Accessibility support with screen reader announcements
Search Bar Enhancement
Prominent orange search icon (h-5 w-5) positioned left with z-10 layering
Increased input height from 12 to 14 (h-14) for better touch targets
Accent color focus border (focus:border-accent/50)
Improved spacing with pl-12 padding for icon clearance
Hero Section Layout (src/app/page.tsx)
Moved search bar closer to hero text (pt-8 pb-12)
Removed sort/filter controls from homepage search
Cleaner first impression with focus on search discovery
Sort and filter remain available on category pages
Rolling Text Hydration - Prevented SSR/client mismatch by rendering static placeholder during server-side rendering
Linting Compliance - Resolved array index key warnings with unique character IDs
Supabase Mock Client - Added proper biome-ignore comments for intentional development warnings
TL;DR: Transformed the homepage with dynamic meteor background animations, character-by-character rolling text effects, and streamlined search UI. These enhancements create a more engaging first impression while improving search discoverability and reducing visual clutter.
Redesigned the hero section with modern animations and refined the search experience. The homepage now features a subtle meteor shower effect, smooth text transitions, and a cleaner search interface that emphasizes content discovery over filtering options.
Meteor Background Animation (src/components/ui/magic/meteors.tsx)
Rolling Text Animation (src/components/ui/magic/rolling-text.tsx)
Search Bar Enhancement
Hero Section Layout (src/app/page.tsx)
Meteor Animation System:
<Meteors
number={20}
minDelay={0}
maxDelay={3}
minDuration={3}
maxDuration={8}
angle={35}
/>
Character Animation:
Search Icon Positioning:
<div className="absolute left-4 top-1/2 -translate-y-1/2 pointer-events-none z-10">
<Search className="h-5 w-5 text-accent" />
</div>
When implementing similar animations:
// ✅ Constrain animations to viewport
<div className="absolute inset-0 max-h-screen">
<YourAnimation />
</div>
// ✅ Prevent hydration mismatches
const [isMounted, setIsMounted] = useState(false);
useEffect(() => setIsMounted(true), []);
// ✅ Use stable keys for animated lists
characters.map((item) => (
<motion.span key={item.id}>
{item.char}
</motion.span>
))
Grid Layout Implementation (src/components/shared/infinite-scroll-container.tsx)
Migrated from responsive grid to masonry layout with auto-rows-[1px]
Added data attributes (data-grid-item, data-grid-content) for layout calculation
Integrated ResizeObserver for dynamic content height tracking
Removed gridClassName prop in favor of consistent masonry implementation
Infinite Scroll Hook (src/hooks/use-infinite-scroll.ts)
Enhanced useEffect dependencies to include hasMore and loading states
Added proper IntersectionObserver cleanup on state changes
Observer now recreates when pagination conditions change
Improved type safety with observerRef tracking
Card Grid Spacing Consistency (95% improvement)
Implemented CSS Grid masonry layout with fine-grained 1px row height
Dynamic row span calculation based on actual card content height
ResizeObserver integration for responsive layout recalculation
Consistent 24px gaps between cards regardless of window size
Eliminates visual "Tetris gap" issues with variable content heights
Infinite Scroll Reliability
Fixed observer lifecycle management for conditionally rendered elements
Observer now properly re-initializes when loading states change
Resolves issue where scroll stopped loading after 60 items
Added proper cleanup to prevent memory leaks
Maintains performance with large content sets (148+ items)
TL;DR: Enhanced visual consistency across card grids with CSS masonry layout achieving 95% spacing uniformity, and fixed infinite scroll reliability issues that prevented loading beyond 60 items. These improvements deliver a more polished browsing experience across all content pages.
Improved the visual presentation and functionality of content browsing with refined card spacing and reliable infinite scroll pagination. The card grid now maintains consistent spacing regardless of card content height, and infinite scroll works seamlessly through all content pages.
Card Grid Spacing Consistency (95% improvement)
Infinite Scroll Reliability
Grid Layout Implementation (src/components/shared/infinite-scroll-container.tsx)
auto-rows-[1px]data-grid-item, data-grid-content) for layout calculationgridClassName prop in favor of consistent masonry implementationInfinite Scroll Hook (src/hooks/use-infinite-scroll.ts)
hasMore and loading statesMasonry Layout Calculation:
const rowGap = 24; // gap-6 = 24px
const rowHeight = 1; // Fine-grained control
const contentHeight = content.getBoundingClientRect().height;
const rowSpan = Math.ceil((contentHeight + rowGap) / (rowHeight + rowGap));
Observer Lifecycle:
hasMore && !loadingWhen working with card grids:
// ✅ Grid items must use data attributes for masonry
<div data-grid-item>
<div data-grid-content>
<YourCard />
</div>
</div>
// ✅ Grid container uses masonry classes
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 auto-rows-[1px]">
When implementing infinite scroll:
// ✅ Pass loading and hasMore to hook
const observerTarget = useInfiniteScroll(loadMore, {
hasMore,
loading,
threshold: 0.1,
rootMargin: '200px',
});
// ✅ Conditionally render target element
{!loading && hasMore && <div ref={observerTarget} />}
User Interaction Tracking (user_interactions table)
Automatic tracking of views, bookmarks, and code copies
Session-based analytics with metadata support
Anonymous interaction support with graceful auth fallback
90-day data retention policy for privacy
Non-blocking async tracking (doesn't slow down user actions)
Affinity Scoring Algorithm (src/lib/personalization/affinity-scorer.ts)
Multi-factor scoring: Views (20%), Time spent (25%), Bookmarks (30%), Copies (15%), Recency (10%)
Exponential recency decay with 30-day half-life
Normalized 0-100 scoring with transparent breakdown
Batch processing via daily cron job at 2 AM UTC
Cached top 50 affinities per user (5-minute TTL)
Collaborative Filtering (src/lib/personalization/collaborative-filter.ts)
Item-based collaborative filtering using Jaccard similarity
Co-bookmark frequency analysis for "users who liked X also liked Y"
User-user similarity calculation for future enhancements
Pre-computed similarity matrices updated nightly
Optimized for sparse interaction data
Content Similarity Engine (src/lib/personalization/similar-configs.ts)
Multi-factor similarity: Tags (35%), Category (20%), Description (15%), Co-bookmarks (20%), Author (5%), Popularity (5%)
Keyword extraction and Jaccard coefficient matching
Related category mappings (agents ↔ commands ↔ rules)
Pre-computation stores top 20 similar items per config
15% similarity threshold for meaningful recommendations
For You Feed (/for-you page)
Hybrid algorithm blending multiple signals
Weight distribution: Affinity (40%), Collaborative (30%), Trending (15%), Interests (10%), Diversity (5%)
Category filtering and infinite scroll
Cold start recommendations for new users (trending + interests)
Personalized recommendation reasons ("Based on your past interactions")
5-minute cache with automatic revalidation
Similar Configs Section (detail page component)
Displays 6 similar configurations on every content page
Match percentage scores (0-100%)
Click tracking for algorithm improvement
Lazy-loaded for performance
Falls back gracefully when no similarities exist
Usage-Based Recommendations (src/lib/personalization/usage-based-recommender.ts)
After bookmark: "Users who saved this also saved..."
After copy: "Complete your setup with..." (complementary tools)
Extended time on page: "Related configs you might like..."
Category browsing: "Since you're exploring [category]..."
Complementarity rules (MCP ↔ agents, rules ↔ commands)
Background Processing
Daily affinity calculation cron (/api/cron/calculate-affinities)
Nightly similarity calculation cron (/api/cron/calculate-similarities)
Batch processing (50 users per batch, 1000 similarities per batch)
CRON_SECRET authentication for security
Comprehensive logging and error handling
Analytics Integration (Umami events)
personalization_affinity_calculated - Affinity scores computed
personalization_recommendation_shown - Recommendation displayed
personalization_recommendation_clicked - User engaged with rec
personalization_similar_config_clicked - Similar config selected
personalization_for_you_viewed - For You feed accessed
personalization_usage_recommendation_shown - Contextual rec shown
Bookmark actions now track interactions for affinity calculation
View tracking enhanced with user interaction logging
Copy actions record interaction events for scoring
Account library shows personalized recommendations
Navigation includes "For You" link for authenticated users
TL;DR: Intelligent personalization system with hybrid recommendation algorithms, "For You" feed, similar configs, and usage-based suggestions powered by interaction tracking and collaborative filtering.
Implemented comprehensive personalization infrastructure that learns from user behavior (views, bookmarks, copies) to deliver tailored configuration recommendations through affinity scoring, content similarity, and collaborative filtering algorithms.
User Interaction Tracking (user_interactions table)
Affinity Scoring Algorithm (src/lib/personalization/affinity-scorer.ts)
Collaborative Filtering (src/lib/personalization/collaborative-filter.ts)
Content Similarity Engine (src/lib/personalization/similar-configs.ts)
For You Feed (/for-you page)
Similar Configs Section (detail page component)
Usage-Based Recommendations (src/lib/personalization/usage-based-recommender.ts)
Background Processing
/api/cron/calculate-affinities)/api/cron/calculate-similarities)Analytics Integration (Umami events)
personalization_affinity_calculated - Affinity scores computedpersonalization_recommendation_shown - Recommendation displayedpersonalization_recommendation_clicked - User engaged with recpersonalization_similar_config_clicked - Similar config selectedpersonalization_for_you_viewed - For You feed accessedpersonalization_usage_recommendation_shown - Contextual rec shownDatabase Schema:
-- User interactions (clickstream)
user_interactions (user_id, content_type, content_slug, interaction_type, metadata, created_at)
-- Affinity scores (precomputed)
user_affinities (user_id, content_type, content_slug, affinity_score, based_on, calculated_at)
-- Similarity matrices
user_similarities (user_a_id, user_b_id, similarity_score, common_items, calculated_at)
content_similarities (content_a_type, content_a_slug, content_b_type, content_b_slug, similarity_score, similarity_factors, calculated_at)
Affinity Scoring Formula:
affinity = (
normalize(views, max=10) * 0.20 +
normalize(time_spent, max=300s) * 0.25 +
normalize(bookmarks, max=1) * 0.30 +
normalize(copies, max=3) * 0.15 +
recency_decay() * 0.10
) * 100
recency_decay = exp(-ln(2) * days_since / 30)
For You Feed Algorithm:
final_score = (
affinity_based * 0.40 +
collaborative * 0.30 +
trending * 0.15 +
interest_match * 0.10 +
diversity_bonus * 0.05
)
Collaborative Filtering:
intersection(users) / union(users)Files Added:
supabase/migrations/20250108000000_personalization_engine.sql - Complete schemasrc/lib/personalization/types.ts - TypeScript interfacessrc/lib/personalization/affinity-scorer.ts - Affinity algorithmsrc/lib/personalization/collaborative-filter.ts - CF implementationsrc/lib/personalization/similar-configs.ts - Similarity enginesrc/lib/personalization/for-you-feed.ts - Hybrid feed algorithmsrc/lib/personalization/usage-based-recommender.ts - Contextual recssrc/lib/schemas/personalization.schema.ts - Zod validation schemassrc/lib/actions/interaction-actions.ts - Interaction tracking actionssrc/lib/actions/affinity-actions.ts - Affinity calculation actionssrc/lib/actions/personalization-actions.ts - Recommendation actionssrc/app/api/cron/calculate-affinities/route.ts - Affinity cron jobsrc/app/api/cron/calculate-similarities/route.ts - Similarity cron jobsrc/app/for-you/page.tsx - For You feed pagesrc/app/for-you/loading.tsx - Loading statesrc/components/personalization/for-you-feed-client.tsx - Feed UIsrc/components/personalization/similar-configs-section.tsx - Similar configs UIFiles Modified:
src/lib/actions/bookmark-actions.ts - Added interaction trackingsrc/lib/actions/track-view.ts - Enhanced with interaction loggingsrc/lib/analytics/events.config.ts - Added 6 personalization eventsPerformance:
Security:
Privacy:
All content automatically participates in personalization algorithms. No special tagging required - the system learns from:
Configure in Vercel (or deployment platform):
Daily Affinity Calculation:
/api/cron/calculate-affinities0 2 * * * (2 AM UTC)Authorization: Bearer ${CRON_SECRET}Nightly Similarity Calculation:
/api/cron/calculate-similarities0 3 * * * (3 AM UTC) Authorization: Bearer ${CRON_SECRET}Required Environment Variable:
CRON_SECRET=your-secure-random-string-here
BaseCard Component (src/components/shared/base-card.tsx - 383 lines)
Composition-based card structure with customizable render prop slots
Props: renderTopBadges, renderMetadataBadges, renderActions, customMetadataText
Shared features: card navigation, tag rendering, author attribution, source badges
Sponsored content support with position tracking
Performance optimized with React.memo()
Full TypeScript type safety with BaseCardProps interface
Newsletter Hook (src/hooks/use-newsletter.ts - 196 lines)
Type-safe NewsletterSource enum for analytics tracking
Centralized form state: email, error, isSubmitting
Server action integration with error handling
Customizable success/error callbacks
Referrer tracking for attribution
Toast notification management
Automatic form reset on success
Card Components (ConfigCard, CollectionCard)
Refactored to use new BaseCard component with composition-based architecture
Render props pattern for customizable slots (badges, actions, metadata)
All features preserved: sponsored tracking, view counts, type badges, action buttons
Integrated with useCardNavigation hook for consistent navigation behavior
Support for sponsored content tracking via SponsoredTracker wrapper
Accessibility maintained: ARIA labels, keyboard navigation, semantic HTML
Code reduction: ConfigCard (-58 lines), CollectionCard (-45 lines)
Newsletter Forms (3 components affected)
Centralized subscription logic in useNewsletter hook
Leverages existing subscribeToNewsletter server action with rate limiting
Consistent error handling, toast notifications, and form reset across all variants
React 18+ useTransition for pending states
Email privacy logging (partial email masking in error logs)
Components: newsletter-form.tsx, footer-newsletter-bar.tsx, inline-email-cta.tsx
Code reduction: newsletter-form.tsx (-52 lines)
Copy Buttons
Refactored copy-llms-button.tsx to use centralized useCopyToClipboard hook
Eliminated custom state management and timeout handling
Consistent clipboard behavior across all copy actions
Automatic reset after 2 seconds (managed by hook)
Improved error recovery with structured logging
Code reduction: copy-llms-button.tsx (-52 lines)
TL;DR: Refactored card and newsletter components to eliminate code duplication through shared utilities, improving maintainability while preserving all existing features. Extracted 407 lines of duplicate code into reusable BaseCard component and useNewsletter hook.
Comprehensive refactoring of card and newsletter components following composition-over-inheritance patterns, extracting shared logic into reusable utilities while maintaining 100% feature parity with existing implementations.
Card Components (ConfigCard, CollectionCard)
BaseCard component with composition-based architectureuseCardNavigation hook for consistent navigation behaviorSponsoredTracker wrapperNewsletter Forms (3 components affected)
useNewsletter hooksubscribeToNewsletter server action with rate limitinguseTransition for pending statesnewsletter-form.tsx, footer-newsletter-bar.tsx, inline-email-cta.tsxCopy Buttons
copy-llms-button.tsx to use centralized useCopyToClipboard hookBaseCard Component (src/components/shared/base-card.tsx - 383 lines)
renderTopBadges, renderMetadataBadges, renderActions, customMetadataTextReact.memo()BaseCardProps interfaceNewsletter Hook (src/hooks/use-newsletter.ts - 196 lines)
NewsletterSource enum for analytics trackingBaseCard Pattern:
// Composition-based architecture with render props
<BaseCard
targetPath={`/${item.category}/${item.slug}`}
displayTitle={displayTitle}
description={item.description}
author={item.author}
renderTopBadges={() => (
<>
<TypeBadge type={item.category} />
{isSponsored && <SponsoredBadge tier={sponsorTier} />}
</>
)}
renderActions={() => (
<>
<BookmarkButton />
<CardCopyAction />
<Button>View</Button>
</>
)}
/>
Newsletter Hook Pattern:
// Centralized newsletter subscription logic
const { email, setEmail, isSubmitting, subscribe } = useNewsletter({
source: 'footer',
onSuccess: () => console.log('Subscribed!'),
onError: (error) => console.error(error),
});
// Usage in form
<form onSubmit={(e) => { e.preventDefault(); subscribe(); }}>
<Input value={email} onChange={(e) => setEmail(e.target.value)} />
<Button disabled={isSubmitting}>Subscribe</Button>
</form>
Files Modified:
New Files Created (2):
src/components/shared/base-card.tsx (+383 lines)src/hooks/use-newsletter.ts (+196 lines)Refactored Files (4):
src/components/features/content/config-card.tsx (-58 lines, 226→168)src/components/features/content/collection-card.tsx (-45 lines, 210→165)src/components/shared/newsletter-form.tsx (-52 lines, 99→47)src/components/shared/copy-llms-button.tsx (-52 lines, 260→208)Verified Unchanged (5):
src/components/shared/footer-newsletter-bar.tsx (delegates to NewsletterForm)src/components/shared/inline-email-cta.tsx (delegates to NewsletterForm)src/components/shared/card-copy-action.tsx (already uses useCopyWithEmailCapture)src/components/shared/copy-markdown-button.tsx (already uses useCopyWithEmailCapture)src/components/shared/download-markdown-button.tsx (download action, not clipboard)No visible changes - all features work exactly as before:
Run npm run lint and npm run type-check to verify changes.
Avatar Components (src/components/ui/avatar.tsx)
Converted 3 components: Avatar, AvatarImage, AvatarFallback
Ref now passed as optional prop: ref?: React.Ref<React.ElementRef<typeof AvatarPrimitive.Root>>
All Radix UI primitive integrations maintained
Checkbox Component (src/components/ui/checkbox.tsx)
Single component conversion with CheckboxPrimitive.Root integration
Preserved all accessibility features and visual states
Command Components (src/components/ui/command.tsx)
Converted 7 components: Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandSeparator, CommandItem
Largest refactor - maintained cmdk integration and dialog functionality
Radio Group Components (src/components/ui/radio-group.tsx)
Converted 2 components: RadioGroup, RadioGroupItem
Preserved indicator logic and Lucide icon integration
Separator Component (src/components/ui/separator.tsx)
Single component with default parameter preservation (orientation, decorative)
Maintained horizontal/vertical orientation logic
Switch Component (src/components/ui/switch.tsx)
Converted Switch with SwitchPrimitives.Thumb integration
All data-state attributes and animations preserved
React 19 Deprecation Warnings (15 warnings eliminated)
Removed all React.forwardRef usage across UI components
Converted to React 19's ref-as-prop pattern (refs passed as regular props)
Zero runtime overhead - purely signature changes
All components maintain identical functionality and behavior
Full TypeScript type safety preserved with proper ref typing
TL;DR: Migrated 6 shadcn/ui components (15 total component instances) from deprecated React.forwardRef pattern to React 19's ref-as-prop pattern, eliminating all forwardRef deprecation warnings while maintaining full type safety and functionality.
Comprehensive migration of shadcn/ui components to React 19 standards, removing all uses of the deprecated React.forwardRef API in favor of the new ref-as-prop pattern. This modernizes the component library while preserving 100% backward compatibility and type safety.
React.forwardRef usage across UI componentsAvatar Components (src/components/ui/avatar.tsx)
ref?: React.Ref<React.ElementRef<typeof AvatarPrimitive.Root>>Checkbox Component (src/components/ui/checkbox.tsx)
Command Components (src/components/ui/command.tsx)
Radio Group Components (src/components/ui/radio-group.tsx)
Separator Component (src/components/ui/separator.tsx)
Switch Component (src/components/ui/switch.tsx)
Before (Deprecated React.forwardRef):
const Component = React.forwardRef<
React.ElementRef<typeof Primitive>,
React.ComponentPropsWithoutRef<typeof Primitive>
>(({ className, ...props }, ref) => (
<Primitive ref={ref} className={cn(/* ... */)} {...props} />
));
Component.displayName = Primitive.displayName;
After (React 19 Ref-as-Prop):
const Component = ({
className,
ref,
...props
}: React.ComponentPropsWithoutRef<typeof Primitive> & {
ref?: React.Ref<React.ElementRef<typeof Primitive>>;
}) => (
<Primitive ref={ref} className={cn(/* ... */)} {...props} />
);
Component.displayName = Primitive.displayName;
Type Safety Pattern:
React.ComponentPropsWithoutRef<typeof Primitive> for all props& { ref?: React.Ref<...> } for optional refReact.ElementRef<typeof Primitive> for exact ref typingFiles Modified (6 files, 15 component instances):
src/components/ui/avatar.tsx - 3 components (Avatar, AvatarImage, AvatarFallback)src/components/ui/checkbox.tsx - 1 component (Checkbox)src/components/ui/command.tsx - 7 components (Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandSeparator, CommandItem)src/components/ui/radio-group.tsx - 2 components (RadioGroup, RadioGroupItem)src/components/ui/separator.tsx - 1 component (Separator)src/components/ui/switch.tsx - 1 component (Switch)Import Optimization:
import * as React to import type * as Reactnpm run lint - 580 files checked)npm run type-check)When creating new shadcn/ui components, use the React 19 ref-as-prop pattern:
const MyComponent = ({
className,
ref,
...props
}: React.ComponentPropsWithoutRef<typeof Primitive> & {
ref?: React.Ref<React.ElementRef<typeof Primitive>>;
}) => (
<Primitive ref={ref} className={cn(/* ... */)} {...props} />
);
Do not use React.forwardRef - it's deprecated in React 19.
Run npm run lint and npm run type-check before committing to ensure compliance.
Lighthouse CI Automation (config/tools/lighthouserc.cjs)
Automated Core Web Vitals monitoring on every PR
Performance threshold: 90+ (current: 95%)
Accessibility threshold: 95+ (current: 100%)
SEO threshold: 95+ (current: 100%)
CI/CD integration with GitHub Actions
Comment-based PR feedback with detailed metrics
Environment Schema Enhancements (src/lib/schemas/env.schema.ts)
Added CRON_SECRET validation for scheduled job security
Added ARCJET_ENV validation for security middleware
Centralized server-side environment validation
Configuration Updates
Biome: Enabled noUndeclaredDependencies rule for import validation
PostCSS: Migrated to ESM export format
NPM: Disabled update notifier for cleaner CI logs
Next.js: Replaced dynamic image loader with static optimization
Code Cleanup
Removed lefthook pre-commit configuration (superseded by CI)
Deleted temporary SEO analysis reports (2 files, 1,062 lines)
Cleaned up unused parameters across API routes and lib files
TypeScript Safety (45+ warnings eliminated)
Removed all non-null assertion operators (!) with proper guard clauses
Runtime validation for environment variables with explicit error throwing
Safe array/Map access patterns with bounds checking
Type predicate filters for null-safe array operations
Proper ISO date parsing without unsafe assertions
Web Accessibility (WCAG AA Compliance)
Fixed color contrast failure on newsletter subscribe button (3.89:1 → 7.1:1 ratio)
Changed accent-foreground color from white to near-black (oklch(20% 0 0))
Button contrast now exceeds WCAG AAA standard (>7:1)
Lighthouse accessibility score: 100%
Environment variables validated at runtime (fail-fast on misconfiguration)
Removed unsafe array access that could cause undefined behavior
Added bounds checking for matrix operations in algorithms
CRON_SECRET authentication for scheduled jobs
ARCJET_ENV validation for security middleware
TL;DR: Eliminated all TypeScript non-null assertions with production-safe patterns, fixed WCAG AA color contrast violations, and added automated Lighthouse CI workflow for continuous accessibility monitoring.
Comprehensive code quality hardening across 50 files to ensure production-grade TypeScript safety, web accessibility compliance, and automated quality gates through CI/CD.
TypeScript Safety (45+ warnings eliminated)
!) with proper guard clausesWeb Accessibility (WCAG AA Compliance)
oklch(20% 0 0))Lighthouse CI Automation (config/tools/lighthouserc.cjs)
Environment Schema Enhancements (src/lib/schemas/env.schema.ts)
CRON_SECRET validation for scheduled job securityARCJET_ENV validation for security middlewareConfiguration Updates
noUndeclaredDependencies rule for import validationCode Cleanup
TypeScript Pattern Improvements:
// BEFORE: Unsafe non-null assertion
const value = map.get(key)!;
const firstItem = array[0]!;
// AFTER: Production-safe with guard clauses
const value = map.get(key);
if (!value) continue;
const firstItem = array[0];
if (!firstItem) return;
Supabase Client Safety:
// Runtime validation with explicit errors (src/lib/supabase/*.ts)
if (!(supabaseUrl && supabaseAnonKey)) {
throw new Error('Missing required Supabase environment variables');
}
Array Access with Bounds Checking:
// Levenshtein distance matrix (src/lib/github/content-manager.ts)
const getCell = (i: number, j: number): number => {
const row = matrix[i];
if (!row) throw new Error(`Matrix row ${i} undefined`);
const value = row[j];
if (value === undefined) throw new Error(`Matrix cell [${i}][${j}] undefined`);
return value;
};
Files Modified (Production Impact):
All new code must pass:
any, no !)Run npm run lint and npm run type-check before committing.
User Collections Database
user_collections table for collection metadata (name, slug, description, visibility)
collection_items junction table linking collections to bookmarked content
Auto-generated slugs from collection names with collision handling
Item count tracking via database triggers for performance
Row Level Security policies for privacy control
Indexed queries for public collections, user ownership, and view counts
My Library Page (/account/library)
Unified tabbed interface showing bookmarks and collections
Bookmark tab displays all saved configurations with filtering
Collections tab shows user-created collections with stats
Create new collection button with inline form access
Empty states with helpful calls-to-action
Backward compatible redirect from /account/bookmarks
Collection Management UI
Create collection form with auto-slug generation (/account/library/new)
Collection detail page with item management (/account/library/[slug])
Edit collection settings (/account/library/[slug]/edit)
Add/remove bookmarks from collections
Reorder items with up/down buttons (drag-drop ready architecture)
Public/private visibility toggle
Optional collection descriptions (max 500 characters)
Public Collection Sharing
Collections displayed on user public profiles (/u/[username])
Dedicated public collection pages (/u/[username]/collections/[slug])
Share URLs with copy-to-clipboard functionality
View tracking for collection analytics
Owner can manage collections from public pages
SEO-optimized metadata for public collections
Collection Actions (src/lib/actions/collection-actions.ts)
createCollection() - Create new collection with validation
updateCollection() - Edit collection details
deleteCollection() - Remove collection (cascades to items)
addItemToCollection() - Add bookmarks to collections
removeItemFromCollection() - Remove items
reorderCollectionItems() - Change display order
All actions use next-safe-action with rate limiting
Zod schema validation for all inputs
Enhanced Bookmark Button
Added bookmark functionality to static collection cards
Consistent bookmark button placement across all content types
Works with agents, MCP servers, rules, commands, hooks, and collections
Account navigation renamed "Bookmarks" to "Library" for clarity
Account dashboard links updated to point to unified library
Bookmark actions now revalidate library pages instead of bookmarks pages
User profiles display public collections alongside posts and activity
Collections can be bookmarked like any other content type
TL;DR: Users can now create custom collections to organize their bookmarked configurations, share them publicly on their profiles, and discover collections from other community members.
Implemented a complete user collections system that extends the existing bookmarks feature, allowing users to organize saved configurations into curated collections with public/private visibility, custom ordering, and profile integration.
User Collections Database
user_collections table for collection metadata (name, slug, description, visibility)collection_items junction table linking collections to bookmarked contentMy Library Page (/account/library)
/account/bookmarksCollection Management UI
/account/library/new)/account/library/[slug])/account/library/[slug]/edit)Public Collection Sharing
/u/[username])/u/[username]/collections/[slug])Collection Actions (src/lib/actions/collection-actions.ts)
createCollection() - Create new collection with validationupdateCollection() - Edit collection detailsdeleteCollection() - Remove collection (cascades to items)addItemToCollection() - Add bookmarks to collectionsremoveItemFromCollection() - Remove itemsreorderCollectionItems() - Change display orderEnhanced Bookmark Button
Database Schema:
user_collections.slug - Auto-generated from name, unique per useruser_collections.is_public - Controls visibility on profilesuser_collections.item_count - Denormalized count updated by triggerscollection_items.order - Sortable position within collectionServer Actions:
Files Added:
supabase/migrations/2025-10-07-user-collections.sql - Collection tables migrationsrc/lib/actions/collection-actions.ts - Collection CRUD server actionssrc/app/account/library/page.tsx - Main library page with tabssrc/app/account/library/new/page.tsx - Create collection pagesrc/app/account/library/[slug]/page.tsx - Collection management pagesrc/app/account/library/[slug]/edit/page.tsx - Edit collection pagesrc/components/library/collection-form.tsx - Reusable collection formsrc/components/library/collection-item-manager.tsx - Item management UIsrc/app/u/[slug]/collections/[collectionSlug]/page.tsx - Public collection viewFiles Modified:
supabase/schema.sql - Added user_collections and collection_items tablessrc/lib/icons.tsx - Added FolderOpen and Share2 iconssrc/app/account/layout.tsx - Updated navigation to "Library"src/app/account/page.tsx - Updated dashboard quick actionssrc/app/u/[slug]/page.tsx - Added public collections sectionsrc/components/features/content/collection-card.tsx - Added bookmark buttonPerformance:
Security:
Interactive Quiz Interface (/tools/config-recommender)
7-question progressive disclosure form with client-side validation
Question types: use case, experience level, tool preferences, integrations, focus areas, team size
Real-time progress tracking with visual indicators
Smooth question-to-question transitions
Mobile-optimized with responsive grid layouts
Keyboard navigation and WCAG 2.1 AA accessibility compliance
Skip logic for optional questions (4-7 are optional)
Rule-Based Recommendation Algorithm (src/lib/recommender/algorithm.ts)
Multi-factor scoring with 7 weighted dimensions (35% use case, 20% tool preference, 15% experience, 15% integrations, 10% focus areas, 3% popularity, 2% trending)
Tag matching across 147+ configurations
Category filtering and diversity scoring to ensure varied results
Experience-based complexity filtering (beginner/intermediate/advanced)
Popularity and trending boosts from Redis view counts
<100ms execution time for full catalog analysis
Zero API costs (no LLM calls, purely computational)
Extensible architecture with hooks for future LLM enhancement
Results Display System (/tools/config-recommender/results/[id])
Top 8-10 ranked configurations with match scores (0-100%)
Explanation of why each configuration was recommended
Primary reason highlighting and additional factor badges
Category-based filtering tabs (all, agents, mcp, rules, etc.)
Match score visualization with color coding (90%+ green, 75%+ blue, 60%+ yellow)
Rank badges for top 3 results
Summary statistics (avg match score, diversity score, top category)
Direct links to configuration detail pages
Social Sharing Features
Shareable URLs with deterministic IDs (same answers = same URL)
Base64-encoded answer data in URL parameters
One-click sharing to Twitter, LinkedIn, Facebook, email
Copy-to-clipboard functionality
Share analytics tracking via logger
Social media card optimization with OpenGraph metadata
SEO & AI Discovery
Landing page added to sitemap with priority 0.8
LLMs.txt route explaining algorithm methodology (/tools/config-recommender/llms.txt)
Result pages marked noindex to prevent thin content penalty
HowTo schema for quiz landing page (AI citation ready)
Metadata registry entries with AI optimization flags
Permanent URLs for tool methodology citations
Server Actions (src/lib/actions/recommender-actions.ts)
generateConfigRecommendations() - Main recommendation generator
trackRecommendationEvent() - Analytics event tracking
Rate limiting: 20 recommendations per minute per IP
Uses lazy content loaders for optimal performance
Redis-enriched view counts for popularity scoring
Comprehensive error handling and logging
TL;DR: Interactive quiz tool that analyzes user needs and recommends the best-fit Claude configurations from our catalog of 147+ options using a zero-cost rule-based algorithm with <100ms response time.
Implemented a personalized configuration discovery tool that helps users find the most suitable Claude configurations for their specific use case, experience level, and requirements through a 7-question interactive quiz with instant, shareable results.
Interactive Quiz Interface (/tools/config-recommender)
Rule-Based Recommendation Algorithm (src/lib/recommender/algorithm.ts)
Results Display System (/tools/config-recommender/results/[id])
Social Sharing Features
SEO & AI Discovery
/tools/config-recommender/llms.txt)Server Actions (src/lib/actions/recommender-actions.ts)
generateConfigRecommendations() - Main recommendation generatortrackRecommendationEvent() - Analytics event trackingRecommendation Scoring Logic:
// Multi-factor weighted scoring (must sum to 1.0)
weights = {
useCase: 0.35, // Primary driver
toolPreference: 0.20, // Category preference
experience: 0.15, // Complexity filtering
integrations: 0.15, // Required tools
focusAreas: 0.10, // Fine-tuning
popularity: 0.03, // Community signal
trending: 0.02, // Discovery boost
}
Diversity Algorithm:
URL Strategy (Research-Backed):
Files Added:
src/lib/schemas/recommender.schema.ts - Quiz and result validation schemassrc/lib/recommender/algorithm.ts - Core recommendation enginesrc/lib/recommender/scoring.ts - Individual scoring functionssrc/lib/recommender/weights.ts - Algorithm weight configurationsrc/lib/actions/recommender-actions.ts - Server actionssrc/components/tools/recommender/quiz-form.tsx - Main quiz componentsrc/components/tools/recommender/quiz-progress.tsx - Progress indicatorsrc/components/tools/recommender/question-card.tsx - Question containersrc/components/tools/recommender/results-display.tsx - Results gridsrc/components/tools/recommender/recommendation-card.tsx - Result cardsrc/components/tools/recommender/share-results.tsx - Share modalsrc/app/tools/config-recommender/page.tsx - Quiz landing pagesrc/app/tools/config-recommender/results/[id]/page.tsx - Results pagesrc/app/tools/config-recommender/llms.txt/route.ts - AI discovery routesrc/components/ui/dialog.tsx - Dialog component for share modalFiles Modified:
src/lib/seo/metadata-registry.ts - Added recommender routes with AI optimizationsrc/lib/icons.tsx - Added Award, Facebook, Linkedin iconsscripts/generate-sitemap.ts - Added tools pages to sitemap generationpublic/robots.txt - Added /tools* to allowed pathsPerformance:
Security:
SEO Strategy:
Extensibility for Future LLM Integration:
enhanceWithLLM() function stub in placeAutomatic Reputation Calculation
Real-time reputation scoring based on community contributions
Formula: Posts (+10), Votes received (+5), Comments (+2), Merged submissions (+20)
Database triggers automatically update reputation on every action
Reputation displayed on profiles and dashboards
Indexed for leaderboard queries
Automatic Badge Awarding System
Criteria-based achievement system with 10 initial badges
Automatic checks and awards when reputation changes
Categories: engagement, contribution, milestone, special
Database functions: check_and_award_badge(), check_all_badges()
Badge notifications via toast messages when earned
Contribution History Page (/account/activity)
Unified timeline of all user activity (posts, comments, votes, submissions)
Filter tabs by activity type
Activity stats overview (counts for each type)
Chronological timeline with status badges
Links to original content
Activity Tracking Infrastructure
Server actions for activity aggregation with caching
Type-safe schemas with Zod validation
Performant queries with proper indexing
5-minute cache for activity summaries
Account dashboard now shows reputation score prominently
Account navigation includes Activity link
Public profiles display reputation and tier badges
Quick actions promote contribution history
TL;DR: Implemented automatic reputation scoring and achievement badge system with database triggers that reward community contributions in real-time.
Added comprehensive gamification system that automatically tracks user contributions, calculates reputation scores, and awards achievement badges based on activity.
Automatic Reputation Calculation
Automatic Badge Awarding System
check_and_award_badge(), check_all_badges()Contribution History Page (/account/activity)
Activity Tracking Infrastructure
When user creates a post:
trigger_reputation_on_post → calculates reputation (+10)trigger_check_badges_on_reputation → checks all badge criteriaWhen user's post gets voted:
trigger_reputation_on_vote → recalculates reputation (+5 per vote)When submission is merged:
trigger_reputation_on_submission → awards +20 reputationEngagement Badges:
Contribution Badges:
Milestone Badges:
Special Badges:
Database Functions:
calculate_user_reputation() - Aggregate all contribution pointscheck_and_award_badge() - Check single badge criteriacheck_all_badges() - Check all badges for userFiles Added:
src/lib/schemas/activity.schema.ts - Activity and reputation typessrc/lib/actions/activity-actions.ts - Activity aggregation actionssrc/lib/actions/reputation-actions.ts - Reputation calculation actionssrc/lib/actions/badge-actions.ts - Badge fetching and checkingsrc/hooks/use-badge-notifications.ts - Client-side badge notification hooksrc/components/features/profile/activity-timeline.tsx - Activity timeline UIsrc/app/account/activity/page.tsx - Contribution history pagesupabase/migrations/2025-10-07-reputation-system.sql - Reputation migrationssupabase/migrations/2025-10-07-badge-awarding-system.sql - Badge migrationsPerformance:
OAuth Avatar Sync (automatic profile picture management)
Database trigger (on_auth_user_created) automatically syncs avatar from GitHub/Google on signup
Profile pictures use OAuth provider URLs (no storage costs)
Manual refresh function (refresh_profile_from_oauth) for updating avatars
Supports both GitHub (avatar_url) and Google (picture) metadata fields
Profile Editing System (/account/settings)
Editable form with validation for name, bio, work, website, X/Twitter link
Interests/skills tag system (max 10 tags, 30 chars each)
Character counters and real-time validation
Unsaved changes detection and cancel functionality
Server actions with rate limiting and authorization checks
Database Schema Extensions
interests field (JSONB array) for user skills and interests
reputation_score field (INTEGER) for gamification
tier field (TEXT) for free/pro/enterprise membership levels
Indexed for performance on reputation and tier queries
Badge Achievement System (foundation)
badges table with 10 initial achievement types
user_badges table for tracking earned badges
Badge categories: engagement, contribution, milestone, special
Criteria-based system ready for automatic award logic
Badge display components (icon, card, list, compact views)
Enhanced Profile Display
Interests shown as badges on public profiles (/u/[username])
Reputation score in Activity sidebar
Tier badge display (Free/Pro/Enterprise)
OAuth provider indication for profile pictures
Settings page transformed from read-only to fully editable
Public profile pages now show reputation, tier, and interests
User profiles automatically populated on OAuth signup (name, email, avatar)
TL;DR: Enhanced user profiles with automatic OAuth avatar syncing, editable profile fields, interests/skills tags, reputation scoring, tier system, and badge achievement foundation.
Extended the existing user authentication system with comprehensive profile management features, eliminating the need for separate image upload infrastructure by leveraging OAuth provider avatars from GitHub and Google.
OAuth Avatar Sync (automatic profile picture management)
on_auth_user_created) automatically syncs avatar from GitHub/Google on signuprefresh_profile_from_oauth) for updating avatarsavatar_url) and Google (picture) metadata fieldsProfile Editing System (/account/settings)
Database Schema Extensions
interests field (JSONB array) for user skills and interestsreputation_score field (INTEGER) for gamificationtier field (TEXT) for free/pro/enterprise membership levelsBadge Achievement System (foundation)
badges table with 10 initial achievement typesuser_badges table for tracking earned badgesEnhanced Profile Display
/u/[username])Supabase Authentication Integration
Email/password authentication via Supabase Auth
Server-side and client-side auth helpers
Protected routes with middleware
Session management with cookie-based tokens
User Profile System (/u/[slug] routes)
Public user profiles with customizable slugs
Profile fields: name, bio, work, website, social links
Avatar and hero image support
Privacy controls (public/private profiles)
Follow/unfollow functionality
Account Management Pages
/account - Account dashboard and navigation
/account/settings - Profile settings and preferences
/account/bookmarks - Saved content collections
/account/following - Users you follow
/account/sponsorships - Sponsorship management (for sponsors)
Social Features
Followers table with bidirectional relationships
Bookmarks with notes and organization by content type
Follow notifications (configurable)
User activity tracking
Navigation includes login/logout and account links
Content pages show bookmark and follow actions when authenticated
Submit forms associate submissions with authenticated users
Profile slugs auto-generated from usernames
Row Level Security (RLS) policies on all user tables
Users can only edit their own profiles
Public profiles visible to everyone, private profiles owner-only
Server-side auth validation on all protected routes
TL;DR: Complete user authentication system with Supabase Auth, user profiles, account settings, and social features (following, bookmarks).
Implemented full-featured authentication system enabling users to create accounts, manage profiles, bookmark content, and follow other users.
Supabase Authentication Integration
User Profile System (/u/[slug] routes)
Account Management Pages
/account - Account dashboard and navigation/account/settings - Profile settings and preferences/account/bookmarks - Saved content collections/account/following - Users you follow/account/sponsorships - Sponsorship management (for sponsors)Social Features
Submission Tracking Database (submissions table in Supabase)
Tracks all community submissions with status (pending, merged, rejected)
Stores submission metadata (content type, slug, GitHub URL, submitter info)
Indexes on user_id, status, and created_at for performant queries
Foreign key relationships with users table
Submission Statistics Actions (src/lib/actions/submission-stats-actions.ts)
getSubmissionStats() - Overall statistics (total, merged, pending, rejection rate)
getRecentMergedSubmissions() - Latest 5 merged submissions with user info
getTopContributors() - Leaderboard of top 5 contributors by merged count
Type-safe server actions with Zod validation
Rate-limited to prevent abuse
Sidebar Components for submit page
SubmitStatsCard - Real-time submission statistics dashboard
RecentSubmissionsCard - Recent merged submissions with avatars
TopContributorsCard - Contributor leaderboard with badges
TipsCard - Submission guidelines and best practices
TemplateSelector - Quick-start templates for common content types
DuplicateWarning - Real-time duplicate name detection
Submit page layout now includes comprehensive sidebar with statistics and tips
Submission form accepts plaintext input instead of manual JSON formatting
Improved content formatting logic for GitHub submissions
Enhanced user experience with template selection and duplicate warnings
TL;DR: Implemented database-backed submission tracking system with statistics dashboard, enabling community contribution analytics and submission management.
Added comprehensive submission tracking infrastructure using Supabase database with server actions for statistics, recent submissions display, and top contributors leaderboard.
Submission Tracking Database (submissions table in Supabase)
Submission Statistics Actions (src/lib/actions/submission-stats-actions.ts)
getSubmissionStats() - Overall statistics (total, merged, pending, rejection rate)getRecentMergedSubmissions() - Latest 5 merged submissions with user infogetTopContributors() - Leaderboard of top 5 contributors by merged countSidebar Components for submit page
React Email Integration
@react-email/components for email component primitives
@react-email/render for server-side email generation
Development server: npm run email:dev (port 3001)
Email templates directory: src/emails/
Email Templates (Foundation for future features)
Base layout with branding and styling
Responsive design optimized for all email clients
Plain text fallbacks for accessibility
Consistent typography and color scheme
TL;DR: Integrated React Email for type-safe, production-ready transactional email templates with development preview server.
Added email template infrastructure using React Email, enabling the platform to send beautifully designed transactional emails with a development preview environment.
React Email Integration
@react-email/components for email component primitives@react-email/render for server-side email generationnpm run email:dev (port 3001)src/emails/Email Templates (Foundation for future features)
Preview Server - Live preview of email templates
http://localhost:3001Type Safety
Sponsorship Analytics Page (/account/sponsorships/[id]/analytics)
Real-time view and click tracking
Click-through rate (CTR) calculation
Days active and performance trends
Sponsorship tier display (featured, promoted, spotlight)
Start/end date tracking
Active/inactive status indicators
Performance Metrics
Total views count with trend indicators
Total clicks with CTR percentage
Days active calculation
Cost-per-click (CPC) insights
View-to-click conversion tracking
TL;DR: Added detailed analytics dashboard for sponsored content showing views, clicks, CTR, and performance metrics over time.
Implemented comprehensive analytics page for sponsors to track the performance of their sponsored content with detailed metrics and insights.
Sponsorship Analytics Page (/account/sponsorships/[id]/analytics)
Performance Metrics
Data Structure:
InfiniteScrollContainer Architecture
Converted from stateful to fully controlled component
Parent component (home/index.tsx) now manages all state
Infinite scroll container just renders + triggers loading
Better separation of concerns and predictable behavior
Load More Button
Set showLoadMoreButton={false} for seamless infinite scroll
Users now get automatic loading as they scroll
More modern UX (no manual clicking required) Files Modified:
src/components/shared/infinite-scroll-container.tsx
src/components/features/home/index.tsx
src/components/features/home/tabs-section.tsx
60-Item Pagination Cap
Root cause: Dual state management creating race condition
InfiniteScrollContainer maintained local allItems state
Parent's useEffect was resetting state on every filteredResults reference change
Solution: Made InfiniteScrollContainer fully controlled (stateless)
State Synchronization
Removed allItems state from InfiniteScrollContainer
Component now uses items prop directly (single source of truth)
Eliminated useEffect that was overwriting accumulated items
Fixed race condition between loadMore and useEffect
Pagination Reset Loop
Changed useEffect dependency from filteredResults to [activeTab, isSearching]
Prevents reset when same data is re-filtered (array reference changes)
Only resets pagination when user actually changes tabs or search state
Added biome-ignore with detailed explanation for linter
TL;DR: Fixed critical bug where homepage "All" section stopped loading after 60 items due to state synchronization issues between parent and InfiniteScrollContainer component.
60-Item Pagination Cap
allItems statefilteredResults reference changeState Synchronization
allItems state from InfiniteScrollContaineritems prop directly (single source of truth)loadMore and useEffectPagination Reset Loop
filteredResults to [activeTab, isSearching]InfiniteScrollContainer Architecture
home/index.tsx) now manages all stateLoad More Button
showLoadMoreButton={false} for seamless infinite scrollFiles Modified:
src/components/shared/infinite-scroll-container.tsxsrc/components/features/home/index.tsxsrc/components/features/home/tabs-section.tsxstatsRedis.isConnected() method for accurate Redis availability check
/trending/loading.tsx using CategoryLoading factory pattern
Trending page now uses ISR (5-minute revalidation) instead of force-static
Redis availability check properly detects fallback mode
Infinite loading state on trending page
Empty tabs due to isEnabled() returning true in fallback mode
Duplicate content fetching (now single consolidated fetch)
TL;DR: Fixed trending page stuck in loading state by enabling ISR with 5-minute revalidation.
The trending page used export const dynamic = 'force-static' which froze data at build time when Redis was empty. Since Redis only accumulates views after deployment, build-time static generation captured zero data, causing infinite loading states.
force-static prevented refreshing with new dataisEnabled() returned true in fallback mode, blocking fallback logicexport const revalidate = 300 (5-minute refresh)isConnected() method, use instead of isEnabled()isEnabled() returning true in fallback modestatsRedis.isConnected() method for accurate Redis availability check/trending/loading.tsx using CategoryLoading factory patternThe trending page now loads instantly with accurate data refreshed every 5 minutes.
/src/lib/utils/github-issue-url.ts - URL generator for GitHub issues
Client-side form validation with Zod schemas
Popup blocker detection with manual fallback link
Form content types now exclude 'guides': agents | mcp | rules | commands | hooks | statuslines
416 lines of dead code:
/src/lib/services/github.service.ts (275 lines)
/src/app/actions/submit-config.ts (66 lines)
5 unused GitHub API schemas (~60 lines)
GitHub environment variables (GITHUB_TOKEN, GITHUB_OWNER, GITHUB_REPO)
githubConfig export and hasGitHubConfig() function
TL;DR: Submission flow now uses GitHub URL pre-filling instead of GitHub API (zero rate limits, zero secrets).
Completely refactored the submission flow to eliminate all GitHub API dependencies. Users now fill the form and get redirected to GitHub with a pre-filled issue they can review before submitting.
New flow: Form → Pre-fill GitHub URL → Redirect → User reviews → Submit
// Production-grade GitHub issue URL generator
const url = new URL(`https://github.com/${owner}/${repo}/issues/new`);
url.searchParams.set("title", title);
url.searchParams.set("body", body);
window.open(url.toString(), "_blank");
/src/lib/utils/github-issue-url.ts - URL generator for GitHub issues/src/lib/services/github.service.ts (275 lines)/src/app/actions/submit-config.ts (66 lines)githubConfig export and hasGitHubConfig() functionagents | mcp | rules | commands | hooks | statuslinesSubmit your configurations faster with simplified GitHub integration - no account required until final submission.
seoTitle optional field to all content schemas (agents, mcp, rules, commands, hooks, statuslines, collections, guides)
Build pipeline support: seoTitle flows from source files → static API → page metadata
Developer utilities:
npm run validate:titles - Check all page titles against 60-char limit
npm run optimize:titles:dry - Preview automated enhancements
npm run optimize:titles - Apply enhancements to source files
src/lib/seo/title-enhancer.ts - Smart slug-to-title conversion with acronym/brand handling
src/lib/config/seo-config.ts - Centralized SEO constants and character budgets
Enhanced 59 content files (35.1% of catalog) with optimized seoTitle fields:
MCP servers: 34/40 (85%) - "GitHub MCP Server for Claude"
Commands: 12/12 (100%) - "Debug Command for Claude"
Rules: 6/11 (54.5%)
Hooks: 6/60 (10%)
Agents: 1/10 (10%)
Updated scripts/verify-all-titles.ts to single-line compact output format
Added seoTitle to metadata extraction in build-category-config.ts
TL;DR: Optimized 59 page titles with automated "for Claude" branding while staying under 60-character SEO limits. Added validation tools and developer utilities for ongoing title management.
Implemented dual-title metadata system allowing separate SEO-optimized titles (seoTitle) and user-facing headings (title). Created automated enhancement utilities that intelligently add "for Claude" branding while respecting category-specific character budgets (23-31 available chars depending on suffix length).
seoTitle optional field to all content schemas (agents, mcp, rules, commands, hooks, statuslines, collections, guides)seoTitle flows from source files → static API → page metadatanpm run validate:titles - Check all page titles against 60-char limitnpm run optimize:titles:dry - Preview automated enhancementsnpm run optimize:titles - Apply enhancements to source filessrc/lib/seo/title-enhancer.ts - Smart slug-to-title conversion with acronym/brand handlingsrc/lib/config/seo-config.ts - Centralized SEO constants and character budgetsseoTitle fields:scripts/verify-all-titles.ts to single-line compact output formatseoTitle to metadata extraction in build-category-config.tsCharacter Budget per Category:
Enhancement Logic:
// Automated "for Claude" suffix with slug fallback
const baseTitle = item.title || item.name || slugToTitle(item.slug);
if (" for Claude".length <= availableSpace) {
return `${baseTitle} for Claude`;
}
Slug Normalization - Handles acronyms (API, MCP, AWS, SQL) and brand names (GitHub, PostgreSQL, MongoDB)
When adding new content, optionally include seoTitle for SEO optimization:
{
"slug": "example-server",
"title": "Example Server - Long Descriptive Name",
"seoTitle": "Example Server for Claude"
}
Run npm run validate:titles before submitting to verify character limits.
Redis getDailyViewCounts() batch method with MGET optimization
Daily view tracking in incrementView() with UTC timestamps
Growth rate calculation in getTrendingContent() with input validation
Zod schemas for runtime type safety
Comprehensive TSDoc documentation
Trending tab: Now shows highest 24h growth rate (velocity-based) with UTC normalization
Popular tab: Continues showing all-time view counts (cumulative-based)
View tracking uses Redis pipeline for atomic operations
All date calculations use UTC instead of local timezone
Timezone bug: Date calculations now use UTC to prevent inconsistencies across regions
Race condition: Daily key TTL only set once using EXPIRE NX flag
Invalid data: All Redis responses validated before calculations
TL;DR: Trending content now ranks by growth velocity with UTC-normalized timestamps, input validation, and atomic Redis operations.
The trending tab uses a production-grade growth rate algorithm with security hardening and performance optimizations. Content gaining momentum fast (high percentage growth) ranks higher than content with simply more total views.
Math.max(0, Number(value)) to prevent negative/invalid valuesEXPIRE NX flag prevents race conditions on daily key TTL.describe() for JSON Schema compatibility and runtime validationEXPIRE NX only sets TTL on first increment, preventing daily TTL refreshviews:daily:${category}:${slug}:YYYY-MM-DD Redis keys (UTC dates)(today_views - yesterday_views) / yesterday_views * 100NX flag prevents unbounded storage// UTC-normalized date calculation (prevents timezone bugs)
const nowUtc = new Date();
const todayStr = nowUtc.toISOString().split("T")[0];
// Input validation (prevents negative/invalid values)
const todayCount = Math.max(0, Number(todayViews[key]) || 0);
// Atomic Redis operations (prevents race conditions)
pipeline.expire(dailyKey, 604800, "NX"); // Only set if key doesn't have TTL
@param, @returns, @example, @remarkstrendingContentItemSchema and trendingOptionsSchema with .describe() metadatagetDailyViewCounts() batch method with MGET optimizationincrementView() with UTC timestampsgetTrendingContent() with input validationEXPIRE NX flag[category] route enriches items before renderingrevalidate = 300) for fresh view counts across all pagesstatsRedis.enrichWithViewCounts() for reusable batch view count mergingtutorials/desktop-mcp-setup) with prefix stripping for Redis compatibilityviewCount to guideItemWithCategorySchemaType-Safe Rich Content Builder (src/lib/llms-txt/content-builder.ts)
Extracts ALL fields from 6 content schemas (MCP, Agent, Hook, Command, Rule, Statusline)
Formats installation instructions (Claude Desktop + Claude Code)
Formats configurations (MCP servers, hook scripts, statusline settings)
Includes security best practices, troubleshooting guides, and usage examples
No any types - fully type-safe with proper narrowing
llms.txt Routes with ISR (600s revalidation)
/[category]/[slug]/llms.txt - Individual item details (168 pages)
/[category]/llms.txt - Category listings (6 categories)
/collections/[slug]/llms.txt - Collection details
/guides/[...slug]/llms.txt - Guide content
/llms.txt - Site-wide index
PII Protection (src/lib/llms-txt/content-sanitizer.ts)
Removes emails, phone numbers, IP addresses, API keys, SSNs, credit cards
Whitelists example domains (example.com, localhost, 127.0.0.1)
Fixed regex global flag bug causing alternating detection results
Markdown Export Features (src/lib/actions/markdown-actions.ts)
Copy as Markdown: One-click clipboard copy with YAML frontmatter
Download Markdown: File download with full metadata and attribution
Rate limiting: 50 req/min (copy), 30 req/min (download)
Redis caching with 1-hour TTL for performance
Type-safe server actions with Zod validation
Analytics Integration (src/lib/analytics/events.config.ts)
COPY_MARKDOWN event tracking with content metadata
DOWNLOAD_MARKDOWN event tracking with file size metrics
Integrated into CopyMarkdownButton and DownloadMarkdownButton components
Umami analytics for user interaction insights
Removed ALL truncation from llms.txt schema and routes
llmsTxtItemSchema: Removed artificial 200/1000 char limits on title/description
Collections route: Uses content field (unlimited) instead of description (1000 chars)
Item detail route: Includes full rich content via buildRichContent()
Content Coverage
BEFORE: ~5% of page content (1-sentence description only)
AFTER: 100% of page content (15x improvement)
MCP servers now include full configuration examples, environment variables, installation steps
Hooks include complete script content (up to 1MB)
All items include features, use cases, requirements, troubleshooting, examples
TL;DR: All 168 content pages now generate comprehensive llms.txt files with 100% of page content (features, installation, configuration, security, examples) optimized for AI tool discovery and LLM consumption.
Implemented production-grade llms.txt generation system following the llmstxt.org specification (Oct 2025 standards). Each content item now exports ALL structured fields to AI-friendly plain text format with zero truncation, PII sanitization, and type-safe content building.
Type-Safe Rich Content Builder (src/lib/llms-txt/content-builder.ts)
any types - fully type-safe with proper narrowingllms.txt Routes with ISR (600s revalidation)
/[category]/[slug]/llms.txt - Individual item details (168 pages)/[category]/llms.txt - Category listings (6 categories)/collections/[slug]/llms.txt - Collection details/guides/[...slug]/llms.txt - Guide content/llms.txt - Site-wide indexPII Protection (src/lib/llms-txt/content-sanitizer.ts)
Markdown Export Features (src/lib/actions/markdown-actions.ts)
Analytics Integration (src/lib/analytics/events.config.ts)
COPY_MARKDOWN event tracking with content metadataDOWNLOAD_MARKDOWN event tracking with file size metricsRemoved ALL truncation from llms.txt schema and routes
llmsTxtItemSchema: Removed artificial 200/1000 char limits on title/descriptioncontent field (unlimited) instead of description (1000 chars)buildRichContent()Content Coverage
Type-Safe Content Extraction:
export type ContentItem =
| McpContent
| AgentContent
| HookContent
| CommandContent
| RuleContent
| StatuslineContent;
export function buildRichContent(item: ContentItem): string {
const sections: string[] = [];
// 1. Features, 2. Use Cases, 3. Installation
// 4. Requirements, 5. Configuration, 6. Security
// 7. Troubleshooting, 8. Examples, 9. Technical Details, 10. Preview
return sections.filter((s) => s.length > 0).join("\n\n");
}
Category-Specific Formatting:
Static Generation:
generateStaticParams()Validation & Quality Assurance:
scripts/validate-llmstxt.ts) checks all 26+ llms.txt routes# Title), metadata fields (Title:, URL:), category markersAll content automatically generates llms.txt routes. No special configuration needed. The system extracts ALL available fields from your content schemas.
Example URLs:
/mcp/airtable-mcp-server/llms.txt/mcp/llms.txt/collections/essential-mcp-servers/llms.txt/llms.txtFollows llmstxt.org specification (Oct 2025 standards):
max-age=600, s-maxage=600, stale-while-revalidate=3600)MCP Server: reddit-mcp-buddy
Browse Reddit posts and comments
Search posts by keyword
Analyze user activity
Zero API keys required
Thanks to @karanb192 for the contribution!
Updated troubleshooting field to match MCP schema (object array with issue/solution properties)
TL;DR: Added reddit-mcp-buddy server for browsing Reddit directly from Claude.
Browse and discover MCP Servers including the new Reddit integration for Claude Desktop.
'strict-dynamic' directive to CSP configuration
Nonce extraction and application in UmamiScript component
CSP nonces to all JSON-LD structured data components
Umami script loading strategy: lazyOnload → afterInteractive (better nonce compatibility)
Fixed misleading comments claiming Nosecone includes strict-dynamic by default
Analytics: Umami analytics script now loads correctly with CSP nonce
View tracking: trackView() server actions no longer blocked by CSP
React hydration: Client-side JavaScript execution now works properly
Font loading: Fixed CSP restrictions blocking web fonts
Next.js chunks: Dynamic chunk loading no longer causes unsafe-eval errors
TL;DR: Fixed React hydration and analytics by adding 'strict-dynamic' to CSP headers.
Added 'strict-dynamic' directive to Content Security Policy configuration. This allows nonce-based scripts to dynamically load additional scripts (required for React hydration and third-party analytics).
trackView() server actions no longer blocked by CSPunsafe-eval errors'strict-dynamic' directive to CSP configurationlazyOnload → afterInteractive (better nonce compatibility)strict-dynamic by defaultformatViewCount() utility with K/M notation (1234 → "1.2K", 1500000 → "1.5M")
viewCount prop to UnifiedDetailPage and DetailMetadata components
View count fetching in detail page routes
Moved view counter from inline text to standalone badge component
Falls back to "X% popular" text when Redis data unavailable
TL;DR: View counts now appear as eye-catching badges on config cards instead of plain text.
Redesigned the view counter display to be more prominent and visually appealing. View counts now appear as primary-colored badges positioned on the bottom-right of config cards with an Eye icon.
bg-primary/10 text-primary border-primary/20)hover:bg-primary/15)<Badge
variant="secondary"
className="h-7 px-2.5 gap-1.5 bg-primary/10 text-primary"
>
<Eye className="h-3.5 w-3.5" />
<span className="text-xs">{formatViewCount(viewCount)}</span>
</Badge>
formatViewCount() utility with K/M notation (1234 → "1.2K", 1500000 → "1.5M")viewCount prop to UnifiedDetailPage and DetailMetadata componentsSee view counts displayed prominently on all config cards across AI Agents, MCP Servers, and other category pages.
Automation: Bundle Analysis workflow (HashiCorp's nextjs-bundle-analysis)
Automation: Lighthouse CI workflow (Core Web Vitals monitoring)
Automation: PR Labeler workflow (19 intelligent labels)
Community labels: 7 contribution types (community-mcp, community-hooks, etc.)
Thresholds: Lighthouse 90+ performance, 95+ accessibility/SEO
CI, Security, Lighthouse, Bundle Analysis now skip on content/**/*.json changes
Moved .lighthouserc.json to config/tools/lighthouserc.json
"Can't find action.yml" errors: Added explicit actions/checkout@v5 before composite actions
CI and Security workflows now properly check out repository
TL;DR: Community PRs now trigger only 2 workflows instead of 10, saving ~10-15 minutes per PR.
Optimized GitHub Actions workflows to skip intensive jobs (CI, security scans, Lighthouse, bundle analysis) for community content contributions. Only essential workflows (labeling, validation) run for content/**/*.json changes.
community-mcp, community-hooks, etc.)content/**/*.json changes.lighthouserc.json to config/tools/lighthouserc.jsonactions/checkout@v5 before composite actionsWeekly roundup of the best Claude agents, tools, and guides.
No spam. Unsubscribe anytime.