?
TRCKR-198
web ux enhancement
Created: 2025-12-09 Updated: 2025-12-16
Relationships Loading...
Attachments
Loading...
Comments (1)
agent · 2025-12-09
Implemented modal-based entity viewing/editing for the web UI. ## Changes Made: ### 1. Modal Infrastructure (base.html) - Added #modal-container div for dynamic modal content - Implemented closeModal() JavaScript function with ESC key and click-outside handlers - URL updates via history.pushState for deep linking support ### 2. Entity Detail Modals Created: - server/templates/modals/issue_detail.html - server/templates/modals/project_detail.html - server/templates/modals/milestone_detail.html Each modal includes: - Header with entity identifier/title and close button - Inline editing with HTMX (all fields update via PATCH without page reload) - Comments section with add/edit/delete functionality - Proper modal styling (max-width: 800px, scrollable content) ### 3. Table Updates: - server/templates/partials/issues_table.html: hx-target="#modal-container" - server/templates/partials/projects_table.html: hx-target="#modal-container" - server/templates/partials/milestones_table.html: hx-target="#modal-container" ### 4. Form Modal Updates: - Updated all 'New' buttons to target #modal-container - Updated all form modals to use closeModal() function - Updated create responses to call closeModal() instead of removing specific modal IDs ### 5. Backend Routes (server/routes/web.py): - Changed issue detail template from "issue_detail.html" to "modals/issue_detail.html" - Changed project detail template from "project_detail.html" to "modals/project_detail.html" - Changed milestone detail template from "milestone_detail.html" to "modals/milestone_detail.html" - Updated create responses to use closeModal() for consistent behavior ## Testing: - All existing tests pass (1088 passed, 1 pre-existing failure unrelated to changes) - Modal opens when clicking entity rows - ESC key closes modal - Clicking outside modal closes it - URL updates when modal opens (supports deep linking) - Background list remains visible and maintains state - Inline editing works within modals - Comments can be added/edited/deleted within modals ## User Experience Improvements: - No full page reloads when viewing/editing entities - Context preserved (scroll position, filters remain intact) - Faster, more fluid interaction - Similar to Linear's approach as requested