The Jinja |tojson filter outputs JSON with double quotes. When used
inside a double-quoted HTML attribute, these quotes break the attribute
parsing causing "expected expression, got '}'" errors.
Solution: Use single quotes for x-data attributes so JSON double quotes
don't conflict:
<div x-data='languageSelector("fr", {{ langs|tojson }})'>
Updated:
- language_selector.html macro (all 3 variants)
- shop/base.html language selector
- LANG-002 and LANG-003 architecture rules documentation
- Validator to detect double-quoted x-data with tojson
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Remove |safe from |tojson in HTML attributes (x-data) - quotes must
become " for browsers to parse correctly
- Update LANG-002 and LANG-003 architecture rules to document correct
|tojson usage patterns:
- HTML attributes: |tojson (no |safe)
- Script blocks: |tojson|safe
- Fix validator to warn when |tojson|safe is used in x-data (breaks
HTML attribute parsing)
- Improve code quality across services, APIs, and tests
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Nested {# ... #} comments caused outer comment to close early,
leading to template execution errors when importing the macro file.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add language_selector.html to the Jinja Macros section with:
- Entry in Available Macro Files grid
- Live demo showing all three variants:
- language_selector() - full dropdown with labels
- language_selector_compact() - flag icon only
- language_toggle() - toggle for 2 languages
- Code examples with copy functionality
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add database fields for language preferences:
- Vendor: dashboard_language, storefront_language, storefront_languages
- User: preferred_language
- Customer: preferred_language
- Add language middleware for request-level language detection:
- Cookie-based persistence
- Browser Accept-Language fallback
- Vendor storefront language constraints
- Add language API endpoints (/api/v1/language/*):
- POST /set - Set language preference
- GET /current - Get current language info
- GET /list - List available languages
- DELETE /clear - Clear preference
- Add i18n utilities (app/utils/i18n.py):
- JSON-based translation loading
- Jinja2 template integration
- Language resolution helpers
- Add reusable language selector macros for templates
- Add languageSelector() Alpine.js component
- Add translation files (en, fr, de, lb) in static/locales/
- Add architecture rules documentation for language implementation
- Update marketplace-product-detail.js to use native language names
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Sorting:
- Add id DESC as tiebreaker when created_at timestamps are equal
- Ensures consistent newest-first ordering on imports and marketplace pages
Language bug fix:
- Add language field to startImport() payload in marketplace.js
- Add language column to MarketplaceImportJob database model
- Store and return language in API responses
- Add cache-busting version parameter to script tag
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Import Error Tracking:
- Add MarketplaceImportError model to store detailed error information
- Store row number, identifier, error type, message, and row data for each error
- Add API endpoint GET /admin/marketplace-import-jobs/{job_id}/errors
- Add UI to view and browse import errors in job details modal
- Support pagination and error type filtering
Translation Tabs:
- Replace flat translation list with tabbed interface on product detail page
- Add language tabs with full language names
- Add copy-to-clipboard functionality for translation content
- Improved UX with better visual separation of translations
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Service layer:
- Remove db.commit() calls from credentials_service.py (SVC-006)
- Move transaction control to API endpoint level
- Rename client.py -> client_service.py (NAM-002)
- Rename credentials.py -> credentials_service.py (NAM-002)
JavaScript:
- Use centralized logger in admin letzshop.js (JS-001)
- Replace console.log/error with LogConfig logger
Frontend templates:
- Use page_header_flex macro for page header (FE-007)
- Use error_state macro for error display (FE-003)
- Use table_wrapper macro for vendors table (FE-005)
- Use modal macro for configuration and orders modals (FE-004)
All 31 Letzshop tests pass. Architecture validation: 0 errors, 0 warnings.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add complete frontend UI for Letzshop marketplace integration:
Admin portal (/admin/letzshop):
- Vendor overview with Letzshop status cards
- Vendor table with configuration state and sync info
- Configuration modal for API credentials
- Connection testing and manual sync triggers
- Orders modal for viewing vendor orders
Vendor portal (/vendor/{code}/letzshop):
- Orders tab with import, confirm, reject actions
- Settings tab for API credentials management
- Tracking modal for shipment updates
- Order details modal with line items
- Stats display for order status counts
Also includes:
- Routes for both admin and vendor Letzshop pages
- Sidebar navigation updates for both portals
- Alpine.js data functions for reactive UI state
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Fix collect_tests to use JSON report parsing (was returning 0 tests)
- Add Test Collection panel to testing dashboard showing total tests,
unit/integration/performance breakdown, and file count
- Reorganize sidebar: create Platform Health section with Testing Hub,
Code Quality, and Background Tasks
- Keep Developer Tools for Components and Icons only
- Platform Monitoring now contains Import Jobs and Application Logs
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Adds a unified view of all background tasks (imports and test runs)
under Platform Monitoring. Includes real-time status polling,
statistics overview, and task history.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Improve the testing dashboard to run pytest in the background:
- Add background task execution using FastAPI's BackgroundTasks
- Create test_runner_tasks.py following existing background task pattern
- API now returns immediately after starting the test run
- Frontend polls for status every 2 seconds until completion
- Show running indicator with elapsed time counter
- Resume polling if user navigates away and returns while tests running
- Tests continue running even if user closes the page
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add a new Testing Dashboard page that replaces the old Testing Hub with
pytest integration:
- Database models for test runs, results, and collections (TestRun,
TestResult, TestCollection)
- Test runner service that executes pytest with JSON reporting and
stores results in the database
- REST API endpoints for running tests, viewing history, and statistics
- Dashboard UI showing pass rates, trends, tests by category, and top
failing tests
- Alembic migration for the new test_* tables
The dashboard allows admins to:
- Run pytest directly from the UI
- View test run history with pass/fail statistics
- See trend data across recent runs
- Identify frequently failing tests
- Collect test information without running
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add admin marketplace products page to browse imported products
- Add admin vendor products page to manage vendor catalog
- Add product detail pages for both marketplace and vendor products
- Implement copy-to-vendor API to copy marketplace products to vendor catalogs
- Add vendor product service with CRUD operations
- Update sidebar navigation with new product management links
- Add integration and unit tests for new endpoints and services
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add missing icons: chat-alt, exclamation-circle, clipboard-copy
- Replace x-collapse with x-transition in category-nav and filter-sidebar
(x-collapse requires the Collapse plugin which isn't loaded)
- Fix review_form macro call to include images_model parameter
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add Details Modal (Table Layout) example to components page
- Shows header with icon and status badge
- Stats cards grid (imported, updated, errors, total)
- Key-value table with icon-labeled rows
- Add Log Details Modal example with live demo
- Level-based coloring (warning=yellow, error=red, critical=purple)
- Message, exception, and stack trace sections
- Copy-to-clipboard for stack traces
- Both error and warning log demo buttons
- Update jinja-macros.md with Details Modal Pattern documentation
- Document the pattern structure and key features
- Link to components library for live examples
- Add Alpine.js state variables for new modal demos
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add header with log level icon and colored badge
- Replace grid layout with table for log metadata (timestamp, logger, module)
- Add icons to table rows for better visual hierarchy
- Improve message section with card styling and pre-wrap text
- Enhance exception section with icon and red styling
- Add stack trace section with dark theme, monospace font, and copy button
- Include proper footer with close button
- Support dark mode throughout all new elements
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Fix field name mismatch: use 'imported' and 'updated' instead of
'imported_count' and 'updated_count' to match API response schema
- Add progress stats cards with color-coded metrics (imported, updated,
errors, total) for better visual hierarchy
- Replace grid layout with structured table for job details
- Add Language field to display import language
- Add error_message display with icon
- Improve header with icon and subtitle
- Better dark mode support with consistent styling
- Add border and rounded corners to table container
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add interactive demos for all new e-commerce macros:
Priority 4 - Navigation & Discovery:
- Category navigation with mega menu
- Breadcrumb variants
- Search bar with autocomplete
- Filter sidebar with all filter types
- Sort dropdown
Priority 5 - Social Proof & Trust:
- Star ratings (static, dynamic, sizes)
- Compact ratings for lists
- Interactive rating input
- Rating summary with distribution
- Review cards with helpful voting
- Review form
- Trust badges grid
- Trust banner variants
- Payment method icons
- Guarantee badges
- Security seals
- Checkout trust section
Demo state includes sample data for categories, filters,
reviews, and ratings to showcase all component features.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add navigation and discovery components for shop templates:
- category-nav.html: Category navigation with mega menu, mobile drawer,
featured categories, and breadcrumb integration
- breadcrumbs.html: Breadcrumb navigation with schema.org markup,
multiple variants (default, simple, with-home)
- search-bar.html: Search with autocomplete, recent/popular suggestions,
mobile-optimized search drawer
- filter-sidebar.html: Product filtering with price range, rating filter,
color/size selectors, sort dropdown, mobile filter drawer
All macros support:
- Alpine.js reactive bindings
- Dark mode via Tailwind dark: prefix
- Mobile-responsive layouts
- Accessibility features
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add live demos for:
- Product Gallery with image navigation and thumbnails
- Variant Selector with size buttons and color swatches
- Product Info with title, price, rating, stock status
- Product Tabs with description, specifications, reviews
Add demoProductDetail state with full product data including
images, sizes, colors, specifications, and sample reviews.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Migrate all admin templates to use standardized components:
- Use tabs macros (tabs_nav, tab_button) for tab navigation
- Use number_stepper for quantity/numeric inputs
- Use headers macros for consistent page layouts
- Use modals macros for dialog components
Affected pages: dashboard, settings, logs, content-pages, companies,
vendors, users, imports, marketplace, code-quality, and more.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- headers.html: Add new header layout macros
- modals.html: Improve modal component styling and functionality
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add E-commerce section with live demos for all shop macros
- Add demo products and cart state to components.js
- Add demo methods: demoAddToCart, demoToggleWishlist, demoRemoveFromCart
- Showcase product cards, mini cart, add-to-cart functionality
- Add Macros section navigation
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- inputs.html: number_stepper macro with +/- buttons, size variants
(sm/md/lg), min/max validation, dark mode support
- tabs.html: tabs_nav, tabs_inline, tab_button macros with icon and
count badge support, custom click handlers
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Migrated marketplace.js, imports.js, and logs.js to use the same
pagination pattern as companies.js, users.js, and vendors.js:
- pagination: { page, per_page, total, pages }
- Computed getters: totalPages, startIndex, endIndex, pageNumbers
- Methods: previousPage(), nextPage(), goToPage()
Updated templates to use the shared pagination macro:
- marketplace.html
- imports.html
- logs.html
All admin pages now use consistent pagination behavior and styling.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Migrated templates to use shared pagination macro:
- companies.html, users.html, vendors.html, code-quality-violations.html
Added noqa comments for templates with custom pagination variables:
- marketplace.html (page/limit/totalJobs)
- imports.html (page/limit/totalJobs)
- logs.html (filters.skip/limit/totalLogs)
- login.html (inline spinner SVG for loading state)
Also updated validate_architecture.py to:
- Support noqa: FE-001 comments for custom pagination
- Support noqa: FE-002 comments for intentional inline SVGs
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add missing features identified in TailAdmin gap analysis:
cards.html:
- stat_card_with_trend: Stats card with up/down trend indicator and percentage
- card_with_menu: Card with dropdown menu in header
- card_with_menu_simple: Simplified version with menu_items parameter
tables.html:
- sortable_table_header: Table header with sortable columns, sort indicators,
and Alpine.js integration for sort state management
forms.html:
- searchable_select: Dropdown with search/filter functionality
- multi_select: Multi-select dropdown with tag display
This completes feature parity with TailAdmin free template.
The tailadmin-free-tailwind-dashboard-template folder can now be deleted.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update admin components page with documentation for:
- New Macros section listing all available shared macros with imports
- Pagination section with live interactive examples
- Copy-to-clipboard functionality for code snippets
- Dark mode support for all new sections
This serves as a living style guide for developers implementing
new admin pages using the shared component library.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update pagination in code-quality-violations to match companies/vendors:
- Add numbered page buttons with ellipsis for large page counts
- Add startIndex and endIndex computed properties
- Add goToPage(pageNum) method for direct page navigation
- Use consistent grid layout (col-span-3, col-span-9)
This standardizes pagination UI across all admin tables.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Sidebar sections can now be collapsed/expanded by clicking the header.
State is persisted to localStorage so sections remain open/closed
across page navigation and browser sessions.
Changes:
- init-alpine.js: Added openSections state, toggleSection(),
expandSectionForCurrentPage(), and localStorage helpers
- sidebar.html: Refactored with Jinja2 macros for DRY code,
added collapsible sections with CSS transitions and rotating
chevron icons
Features:
- Click section header to toggle expand/collapse
- Chevron rotates 180 degrees when expanded
- Smooth CSS transitions (no extra Alpine plugins needed)
- State persists in localStorage (admin_sidebar_sections key)
- Default: Platform Administration open, others closed
- Dashboard and Settings always visible (not collapsible)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Contact fields now look consistent with other fields (like Letzshop URLs).
The "(from company)" label still indicates inheritance status.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Added company_business_address and company_tax_number to:
- VendorDetailResponse schema
- API response builder
Template now shows actual company values as placeholders instead of
generic "Using company address/tax number" text.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Fixed the inheritance UI to be based on formData content rather than
stale server state (vendor._inherited flags):
- "(from company)" shows when formData field is empty
- "Reset" shows when formData field has a value
- Purple border shows when formData field is empty
- formData initialization: empty for inherited, actual value for overrides
This ensures each field's UI is independent and reactive to user input.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Add UI for vendor contact field inheritance from company:
- Show "(from company)" indicator for inherited fields
- Add "Reset" button per field to clear override
- Add "Reset All to Company" button for bulk reset
- Purple border styling for inherited fields
- Dynamic placeholder showing company values
JavaScript methods:
- resetFieldToCompany(fieldName): Reset individual field
- resetAllContactToCompany(): Reset all contact fields
- hasAnyContactOverride(): Check if any field is overridden
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- seed_demo.py: Change company owner role from "user" to "vendor"
- header.html: Update header partial styling/content
- marketplace.js: Minor JS updates
- marketplace.html: Template updates
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Companies and Vendors pages now use server-side pagination:
- Moved from client-side to server-side pagination
- Added search with debounced input
- Added status and verification filters
- Added pagination state object (page, per_page, total, pages)
- Added pageNumbers computed with ellipsis support
- Updated templates with search bar and filter dropdowns
Benefits:
- Better performance with large datasets
- Consistent UX across all admin list pages
- Reduced initial page load time
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
API endpoints (app/api/v1/admin/users.py):
- GET /users: Paginated list with search and filters
- POST /users: Create new user
- GET /users/{id}: Get user details with related counts
- PUT /users/{id}: Update user information
- PUT /users/{id}/status: Toggle active status
- DELETE /users/{id}: Delete user (with ownership check)
Pydantic schemas (models/schema/auth.py):
- UserCreate: For creating new users
- UserUpdate: For updating user information
- UserDetailResponse: Extended user details with counts
- UserListResponse: Paginated list response
Frontend:
- Updated users.html with server-side pagination and filters
- New user-create.html/js for user creation form
- New user-detail.html/js for viewing user details
- New user-edit.html/js for editing users
Routes added for user create, detail, and edit pages.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
