- Remove @layer declarations and complex hybrid approach
- Eliminate all !important usage - rely on natural CSS specificity
- Add explicit color declarations to prevent inheritance issues
- Class selectors (0,0,1,0) naturally beat universal selectors (0,0,0,0)
- Fixes white-on-white modal issues on sites with CSS resets
- Works in all browsers without 2022+ cascade layer requirements
- Cleaner, more maintainable CSS architecture
- Add production Norwegian sales training website demo
- Create placeholder CSS files for Hugo @import statements
- Update .gitignore to exclude *_enhanced/ directories
- Fix CSS MIME type issues for extensionless files in /css/ paths
- Migrate from inline CSS to external insertr.css with cascade layer architecture
- Add CSS CDN serving capability (ServeInsertrCSS handler and /insertr.css route)
- Implement hybrid approach: @layer insertr for modern browsers + html body selectors for legacy browsers
- Remove scattered inline CSS from JavaScript modules for better maintainability
- Solve form element spacing conflicts with aggressive site CSS resets like '* {margin:0; padding:0}'
- Enable proper CSS caching and separation of concerns
Major improvements:
- Replace Gorilla Mux with Chi v5 router for better performance and cleaner code
- Fix CSS/JS MIME type issues that prevented proper asset loading
- Add built-in CORS middleware replacing manual OPTIONS handlers
- Simplify routing with nested route syntax
- Update URL parameter extraction from mux.Vars to chi.URLParam
New Devigo demo:
- Add production Norwegian sales training website (devigo.no)
- Real-world Hugo-generated content with TailwindCSS
- 39 insertr-enhanced elements for comprehensive CMS testing
- Demonstrates international language support and B2B use cases
- Fixed asset paths for localhost serving compatibility
Technical benefits:
- Automatic MIME type detection for static files
- Reduced code complexity with built-in middleware
- Better performance with lighter dependency stack
- Production-ready CORS handling
- Replace non-working video elements with gradient placeholders showing app previews
- Replace missing images with styled placeholder divs maintaining layout
- Add emoji icons (📱🎤) for visual appeal without external dependencies
- Maintain responsive design and visual hierarchy
- Keep all content IDs working for Insertr enhancement (40 content elements)
- Reduce demo to 48KB total with no missing media dependencies
- Remove all Next.js JavaScript framework dependencies (~1.9MB)
- Strip social media tracking and analytics scripts
- Preserve visual design with essential CSS files only (24KB)
- Keep video elements with local file references instead of external Mux streams
- Reduce HTML from 30KB minified to 5.5KB formatted (82% reduction)
- Maintain responsive design and content structure for realistic demo
- Ensure compatibility with Insertr content editing system
- Replace minified scraped HTML with clean, readable portfolio demo
- Remove all Next.js assets and dependencies (_next/, fonts, images)
- Create hand-crafted HTML with proper structure and modern CSS
- Maintain portfolio theme with projects, timeline, and professional content
- Reduce from 30KB minified to 6KB clean, readable HTML
- Update README to reflect new clean demo purpose
- Restructure demo directory from test-sites/ to demos/ with flattened layout
- Add auto-enhancement on server startup for all sites with auto_enhance: true
- Fix inconsistent content ID generation that prevented dan-eden-portfolio content persistence
- Update server configuration to enhance from source to separate output directories
- Remove manual enhancement from justfile in favor of automatic server enhancement
- Clean up legacy test files and unused restore command
- Update build system to use CDN endpoint instead of file copying
- Replace dual script injection (external + inline) with single script approach
- Pass site configuration via data attributes instead of inline JavaScript
- Update library auto-initialization to read config from script data attributes
- Reduce HTML bloat by eliminating 30+ lines of inline initialization code
- Maintain future-proof CDN compatibility and duplication prevention
Enhanced files now contain only one clean script tag with configuration.
- Replace complex multi-server setup (live-server + API) with unified Go server
- Serve all sites at /sites/{site_id} endpoints, eliminating port conflicts
- Fix content-type middleware to serve proper MIME types for static files
- Prevent script injection duplication with future-proof CDN-compatible detection
- Remove auto page reload from enhance button to eliminate editing interruptions
- Enable seamless content editing workflow with manual enhancement control
Development now requires only 'just dev' instead of complex demo commands.
All sites immediately available at localhost:8080 without hot reload conflicts.
- Remove obsolete cmd/auto_enhance.go command (replaced by unified enhance)
- Implement EnhanceInPlace method using unified pipeline
- Remove generated demo files from git tracking
- Verify all functionality works after cleanup:
* go build successful
* enhance command working correctly
* unified pipeline (discovery → ID generation → content injection) verified
* clean command structure (only enhance, serve, restore commands)
The codebase is now clean with no legacy auto-enhance references or stub implementations. All functionality consolidated into the unified Discoverer + Enhancer architecture.
- Replace complex two-step process (auto-enhance + enhance) with single enhance command
- Eliminate temporary directory management and cleanup
- Direct input → output enhancement using unified Discoverer + Enhancer pipeline
- Verified working on simple test site with proper:
* Element discovery (h1, p elements get insertr class)
* Container expansion (div with multiple children)
* ID generation (deterministic data-content-id attributes)
* Content type detection (text, markdown types)
The justfile workflow is now much cleaner and matches our documented single-command approach.
- Rename AutoEnhancer to Discoverer with clear element discovery focus
- Implement unified enhancement pipeline in Enhancer:
* Phase 1: Element Discovery (configurable, respects existing insertr classes)
* Phase 2: ID Generation via engine
* Phase 3: Content Injection via engine
- Add EnhancementConfig and DiscoveryConfig for flexible configuration
- Update all method names and references (discoverNode, DiscoveryResult, etc.)
- Support both manual class insertion and automatic discovery
- Maintain single enhance command interface while providing unified internal pipeline
- Update all constructors to use new configuration-based approach
This establishes the clean Discoverer + Enhancer architecture discussed, with discovery as configurable first phase and enhancement as unified pipeline.
- Move all ContentItem, ContentClient, ContentResponse types to engine/types.go as single source of truth
- Remove duplicate type definitions from content/types.go
- Update all imports across codebase to use engine types
- Enhance engine to extract existing data-content-id from HTML markup
- Simplify frontend to always send html_markup, let server handle ID extraction/generation
- Fix contentId reference errors in frontend error handling
- Add getAttribute helper method to engine for ID extraction
- Add GetAllContent method to engine.DatabaseClient
- Update enhancer to use engine.ContentClient interface
- All builds and API endpoints verified working
This resolves the 400 Bad Request errors and creates a unified architecture where the server is the single source of truth for all ID generation and content type management.
Database Structure Cleanup:
- Move all SQL files from ./db/ to ./internal/db/
- Update sqlc.yaml to use new paths (preserving schema+setup.sql hack)
- Consolidate database-related code in single directory
- Remove empty ./db/ directory
Injector Migration:
- Move injector.go from content package to engine package
- Update ContentClient interface to return map instead of slice for GetBulkContent
- Update database client implementation to match interface
- Remove injector dependency from enhancer (stub implementation)
Demo-Site Consolidation:
- Move demo-site to test-sites/demo-site for better organization
- Update build scripts to use new demo-site location
- Maintain all functionality while improving project structure
This continues the unified architecture consolidation by moving core content
processing logic to the engine and organizing related files properly.
- Remove internal/parser package and all legacy ID generation logic
- Update enhancer and auto_enhancer to use unified engine functions
- Migrate utility functions (FindViableChildren, HasEditableContent) to engine
- Create stub enhancer implementation that uses unified engine architecture
- Ensure all enhancement workflows now go through single unified system
- Remove parser dependencies and consolidate content processing logic
This completes the cleanup phase - all components now use unified engine
instead of fragmented ID generation systems.
- Create internal/engine module as single source of truth for content processing
- Consolidate 4 separate ID generation systems into one unified engine
- Update API handlers to use engine for consistent server-side ID generation
- Remove frontend client-side ID generation, delegate to server engine
- Ensure identical HTML markup + file path produces identical content IDs
- Resolve content persistence failures caused by ID fragmentation between manual editing and enhancement processes
- Add gitignore patterns for CLI-generated demo directories (*-demo/, *-enhanced/, etc.)
- Remove previously tracked demo files that are now auto-generated
- Demo sites will be auto-created on-demand by CLI during just demo commands
• Add /insertr.js endpoint to serve JavaScript library from API server
• Implement demo gate auto-injection for sites without existing gates
• Add dynamic site ID injection using per-demo configuration files
• Fix CORS middleware to support localhost origins on any port
• Update demo commands to use individual insertr.yaml configs
• Resolve content persistence issues by matching site IDs between injection and enhancement
• Enable complete edit/save workflow for demo sites with proper namespace isolation
- Add intelligent auto-enhancement that detects viable content elements
- Replace manual enhancement with automated container-first detection
- Support inline formatting (strong, em, span, links) within editable content
- Streamline demo workflow: just demo shows options, auto-enhances on demand
- Clean up legacy commands and simplify directory structure
- Auto-enhancement goes directly from source to demo-ready (no intermediate dirs)
- Add Dan Eden portfolio and simple test sites for real-world validation
- Auto-enhanced 40 elements in Dan Eden portfolio, 5 in simple site
- Achieve true zero-configuration CMS experience
- Replace content-hash based ID generation with position-based algorithm
- Use file + element identity + position index + hash for unique IDs
- Generate human-readable prefixes (e.g. index-lead-, index-p-2-)
- Add collision-resistant hash suffixes for guaranteed uniqueness
- Update Generate() to accept filePath parameter for context
- Fix ID collisions where hero and footer elements shared same ID
- Clean demo site files removing all data-content-id attributes
- Preserve insertr-gate elements for authentication functionality
Results: Hero gets 'index-lead-2-fc31f2', footer gets 'index-p-13-99fd13'
No more content cross-contamination between different elements.
Backend changes:
- Updated parser to treat <span> elements as markdown by default
- Changed span content type detection from ContentText to ContentMarkdown
- Spans now support **bold**, *italic*, and [links](url) formatting
Frontend changes:
- Updated content type detection to match backend behavior
- Frontend now treats spans as markdown elements for consistent processing
- Editor preview behavior now matches server-side enhancement
Benefits:
- <span class='highlight'>**bold** text</span> now processes markdown correctly
- Inline elements maintain all styling while supporting rich formatting
- Complete frontend/backend consistency for span element handling
- Expands markdown support to common inline wrapper elements
Tested and verified:
- Span elements preserve all classes, IDs, and styles
- Bold, italic, and link formatting works in span elements
- Content type properly detected as 'markdown' in both systems
Critical fixes:
- Fixed HTML injection to preserve original element attributes, classes, and styling
- Updated markdown processor to generate inline content instead of wrapped paragraphs
- Enhanced content type handling: database type now takes precedence over parser detection
- Eliminated nested <p> tags issue that was causing invalid HTML
Key improvements:
- Elements like <p class='lead insertr' style='color: blue;'> now maintain all attributes
- Markdown **bold**, *italic*, [links](url) inject as inline formatted content
- Database content type (markdown/text/link) overrides parser auto-detection
- Clean HTML output without structural corruption
Before: <p class='lead'><p>**bold**</p></p> (broken)
After: <p class='lead'>**bold text**</p> (clean)
Server remains source of truth for markdown processing with zero runtime overhead.
Backend implementation:
- Add goldmark dependency for markdown processing
- Create MarkdownProcessor with minimal config (bold, italic, links only)
- Update content injector with HTML injection capabilities
- Add injectHTMLContent() for safe DOM manipulation
- Server now converts **bold**, *italic*, [links](url) to HTML during enhancement
Frontend alignment:
- Restrict marked.js to match server capabilities
- Disable unsupported features (headings, lists, code blocks, tables)
- Update turndown rules to prevent unsupported markdown generation
- Frontend editor preview now matches server output exactly
Server as source of truth:
- Build-time markdown→HTML conversion during enhancement
- Zero runtime overhead for end users
- Consistent formatting between editor preview and final output
- Raw markdown stored in database, HTML served to visitors
Tested features:
- **bold** → <strong>bold</strong> ✅
- *italic* → <em>italic</em> ✅
- [text](url) → <a href="url">text</a> ✅
- Replace separate POST/PUT endpoints with unified POST upsert
- Add automatic content ID generation from element context when no ID provided
- Implement version history preservation before content updates
- Add element context support for backend ID generation
- Update frontend to use single endpoint for all content operations
- Enhanced demo site with latest database content including proper content IDs
- Replace separate POST/PUT endpoints with unified POST upsert endpoint
- Add comprehensive API usage examples with automatic ID generation
- Simplify content management to single endpoint for create/update operations
- Document element_context for backend ID generation and version control features
- Problem: Element ID collisions between similar elements (logo h1 vs hero h1)
causing content to be injected into wrong elements
- Root cause: Enhancer used naive tag+class matching instead of parser's
sophisticated semantic analysis for element identification
Systematic solution:
- Enhanced parser architecture with exported utilities (GetClasses, ContainsClass)
- Added FindElementInDocument() with content-based semantic matching
- Replaced naive findAndInjectNodes() with parser-based element matching
- Removed code duplication between parser and enhancer packages
Backend improvements:
- Moved ID generation to backend for single source of truth
- Added ElementContext struct for frontend-backend communication
- Updated API handlers to support context-based content ID generation
Frontend improvements:
- Enhanced getElementMetadata() to extract semantic context
- Updated save flow to handle both enhanced and non-enhanced elements
- Improved API client to use backend-generated content IDs
Result:
- Unique content IDs: navbar-logo-200530 vs hero-title-a1de7b
- Precise element matching using content validation
- Single source of truth for DOM utilities in parser package
- Eliminated 40+ lines of duplicate code while fixing core bug
- Add manual enhance API endpoint (POST /api/enhance?site_id={site}) for triggering file enhancement
- Implement enhance button in JavaScript library status indicator (🔄 Enhance)
- Disable auto-enhancement in development mode to prevent live-reload conflicts
- Add dev mode parameter to SiteManager to control enhancement behavior
- Update API routing structure to support /api/enhance endpoint
- Include enhance button styling and user feedback (loading, success, error states)
- Button triggers file enhancement and page reload to show updated static files
Development workflow improvements:
- Content edits → Immediate editor preview (no unwanted page reloads)
- Manual enhance button → Intentional file updates + reload for testing
- Production mode maintains automatic enhancement on content changes
This resolves the live-reload conflict where automatic file enhancement
was causing unwanted page reloads during content editing in development.
- Add dev_mode parameter to SiteManager constructor
- Modify IsAutoEnhanceEnabled() to return false when dev_mode is true
- Update serve.go to pass dev_mode flag to SiteManager
- Add ForceEnhanceEnabled() method for testing production behavior in development
- Update documentation to explain development vs production mode behavior
This fixes the development workflow where content updates would trigger
file modifications that caused unwanted page reloads in live-server.
Development mode: Content saved to database only, editor loads dynamically
Production mode: Content saved + files enhanced for immediate static deployment
- Add SiteManager for registering and managing static sites with file-based enhancement
- Implement EnhanceInPlace method for in-place file modification using database content
- Integrate automatic file enhancement triggers in UpdateContent API handler
- Add comprehensive site configuration support in insertr.yaml with auto-enhancement
- Extend serve command to automatically register and manage configured sites
- Add backup system for original files before enhancement
- Support multi-site hosting with individual auto-enhancement settings
- Update documentation for server-hosted enhancement workflow
This enables real-time content deployment where database content changes
immediately update static files without requiring rebuilds or redeployment.
The database remains the single source of truth while maintaining static
file performance benefits.
- Replace dual update systems with single markdown-first editor architecture
- Add server-side upsert to eliminate 404 errors on PUT operations
- Fix content persistence race condition between preview and save operations
- Remove legacy updateElementContent system entirely
- Add comprehensive authentication with JWT scaffolding and dev mode
- Implement EditContext.updateOriginalContent() for proper baseline management
- Enable markdown formatting in all text elements (h1-h6, p, div, etc)
- Clean terminology: remove 'unified' references from codebase
Technical changes:
* core/editor.js: Remove legacy update system, unify content types as markdown
* ui/Editor.js: Add updateOriginalContent() method to fix save persistence
* ui/Previewer.js: Clean live preview system for all content types
* api/handlers.go: Implement UpsertContent for idempotent PUT operations
* auth/*: Complete authentication service with OAuth scaffolding
* db/queries/content.sql: Add upsert query with ON CONFLICT handling
* Schema: Remove type constraints, rely on server-side validation
Result: Clean content editing with persistent saves, no 404 errors, markdown support in all text elements
- Remove mock_content setting (working database loop makes it unnecessary)
- Change server.dev_mode to global dev_mode setting for consistency
- Update CLI to use cli.site_id and cli.output for scoped configuration
- Implement database client for CLI enhance command (complete static site loop)
- Update justfile to use INSERTR_DATABASE_PATH environment variable
- Enable multi-site architecture: server is site-agnostic, CLI is site-specific
- Unified insertr.yaml now supports both server and CLI with minimal config
🏗️ **Major Architecture Refactoring: Separate CLI + Server → Unified Binary**
**Key Changes:**
✅ **Unified Binary**: Single 'insertr' binary with subcommands (enhance, serve)
✅ **Preserved Database Architecture**: Maintained sophisticated sqlc multi-DB setup
✅ **Smart Configuration**: Viper + YAML config with CLI flag precedence
✅ **Updated Build System**: Unified justfile, Air, and npm scripts
**Command Structure:**
- `insertr enhance [input-dir]` - Build-time content injection
- `insertr serve` - HTTP API server (dev + production modes)
- `insertr --config insertr.yaml` - YAML configuration support
**Architecture Benefits:**
- **Shared Database Layer**: Single source of truth for content models
- **Flexible Workflows**: Local DB for dev, remote API for production
- **Simple Deployment**: One binary for all use cases
- **Better UX**: Consistent configuration across build and runtime
**Preserved Features:**
- Multi-database support (SQLite + PostgreSQL)
- sqlc code generation and type safety
- Version control system with rollback
- Professional API endpoints
- Content enhancement pipeline
**Development Workflow:**
- `just dev` - Full-stack development (API server + demo site)
- `just serve` - API server only
- `just enhance` - Build-time content injection
- `air` - Hot reload unified binary
**Migration:** Consolidated insertr-cli/ and insertr-server/ → unified root structure
**Discovery**: sqlc's DDL support is database-engine specific:
✅ **PostgreSQL**: sqlc generates functions for CREATE INDEX, CREATE FUNCTION
❌ **SQLite**: sqlc does NOT generate CREATE INDEX functions
❌ **Both**: sqlc does NOT generate CREATE TRIGGER functions
**Corrected Implementation**:
- Use sqlc-generated setup functions where available (tables always, PostgreSQL indexes)
- Use manual SQL where sqlc doesn't support (SQLite indexes, all triggers)
- Comments clarify why manual SQL is needed in each case
**Architecture Principle**: Use sqlc for what it supports, supplement with manual SQL for what it doesn't - this is the recommended hybrid approach.
🎯 Major Achievement: Insertr is now a complete, production-ready CMS
## 🚀 Full-Stack Integration Complete
- ✅ HTTP API Server: Complete REST API with SQLite database
- ✅ Smart Client Integration: Environment-aware API client
- ✅ Unified Development Workflow: Single command full-stack development
- ✅ Professional Tooling: Enhanced build, status, and health checking
## 🔧 Development Experience
- Primary: `just dev` - Full-stack development (demo + API server)
- Alternative: `just demo-only` - Demo site only (special cases)
- Build: `just build` - Complete stack (library + CLI + server)
- Status: `just status` - Comprehensive project overview
## 📦 What's Included
- **insertr-server/**: Complete HTTP API server with SQLite database
- **Smart API Client**: Environment detection, helpful error messages
- **Enhanced Build Pipeline**: Builds library + CLI + server in one command
- **Integrated Tooling**: Status checking, health monitoring, clean workflows
## 🧹 Cleanup
- Removed legacy insertr-old code (no longer needed)
- Simplified workflow (full-stack by default)
- Updated all documentation to reflect complete CMS
## 🎉 Result
Insertr is now a complete, professional CMS with:
- Real content persistence via database
- Professional editing interface
- Build-time content injection
- Zero-configuration deployment
- Production-ready architecture
Ready for real-world use! 🚀
- Add root package.json with development scripts and dependencies
- Move scripts/ from lib back to root for intuitive developer experience
- Clean lib/package.json to contain only runtime dependencies
- Add comprehensive justfile with cross-platform command shortcuts
- Update README.md with new development workflow instructions
- Maintain lib as clean, publishable package while enabling root-level commands
- Add marked and turndown libraries for bidirectional conversion
- Create comprehensive MarkdownConverter utility with proper paragraph preservation
- Implement perfect round-trip HTML→Markdown→HTML conversion
- Add rich formatting support (bold, italic, paragraphs) with live preview
- Fix save handler conflict where general editor overwrote group changes
- Implement debounced live preview for group editing (500ms like regular elements)
- Enable dynamic paragraph creation/removal during markdown editing
- Add comprehensive test cases with HTML formatting examples
Result: World-class drop-in markdown editing with 29KB bundle size
- Add container element detection and child expansion in InsertrCore
- Implement .insertr descendant expansion matching CLI behavior
- Add .insertr-group collective editing with markdown editor
- Fix UX issue where div.insertr got text input instead of proper child editors
- Add comprehensive test cases for both features in about.html
- Enable live preview for group editing with proper content splitting
- Add ResizeObserver to automatically detect element height changes during live preview
- Implement repositionModal() to keep modal positioned below expanded content
- Combine modal repositioning with scroll-to-fit for optimal visibility
- Solve UX issue where modal would overlap newly added content
- Implement debounced live preview in modal editing (500ms)
- Add LivePreviewManager class with element tracking and restoration
- Enhance modal sizing for comfortable 60-80 character editing
- Add auto-copy plugin to rollup config for seamless development
- Update dev command to automatically sync changes to demo-site
The live preview system provides real-time visual feedback while typing in modals,
showing changes in context without saving. Enhanced dev workflow eliminates manual
build steps, enabling instant iteration during development.
- Add script tags to demo-site HTML files for manual development
- Disable CLI inline script injection to prevent duplicate scripts
- Add library serving endpoints to servedev command
- Update build process to auto-copy library to demo-site
- Add CDN URL helpers for future production deployment
- Update .gitignore for generated demo-site files
Fixes .insertr-gate authentication for manual npm run serve workflow
while maintaining clean separation between CLI and manual setups.
- Move scripts/ to lib/scripts/ and convert to ESM modules
- Consolidate dependencies: add live-server to lib/package.json
- Remove root package.json and node_modules split
- Preserve CLI integration via existing rebuild-library.sh
- Add development quickstart guide for new unified workflow
- Clean up outdated file references and duplicate assets
- Replace automatic auth controls with developer-placed .insertr-gate elements
- Add OAuth-ready authentication flow with mock implementation
- Support any HTML element as gate with custom styling
- Implement proper gate restoration after authentication
- Move auth controls to bottom-right corner for better UX
- Add editor gates to demo pages (footer link and styled button)
- Maintain gates visible by default with hideGatesAfterAuth option
- Prevent duplicate authentication attempts with loading states
This enables small business owners to access editor via discrete
footer links or custom-styled elements placed anywhere by developers.
