[PR #1729] [MERGED] Implement tags editor widget for Django admin #1481

New issue

Closed

opened 2026-03-01 14:49:58 +03:00 by kerem · 0 comments

kerem commented

2026-03-01 14:49:58 +03:00

Owner

📋 Pull Request Information

Original PR: https://github.com/ArchiveBox/ArchiveBox/pull/1729
Author: @pirate
Created: 12/30/2025
Status: ✅ Merged
Merged: 12/30/2025
Merged by: @pirate

Base: dev ← Head: claude/tags-editor-widget-0Dq7f

📝 Commits (5)

202e5b2 Add interactive tags editor widget for Django admin
dcf1136 Merge branch 'dev' into claude/tags-editor-widget-0Dq7f
a648c17 Merge branch 'dev' into claude/tags-editor-widget-0Dq7f
03b96ef Fix security issues in tag editor widgets
0dee662 Use bulk operations for add/remove tags actions

📊 Changes

4 files changed (+1005 additions, -26 deletions)

View changed files

📝 archivebox/api/v1_core.py (+157 -0)
📝 archivebox/core/admin_snapshots.py (+153 -26)
➕ archivebox/core/widgets.py (+512 -0)
📝 archivebox/templates/admin/base.html (+183 -0)

📄 Description

Implement a sleek inline tag editor with autocomplete and AJAX support:

Create TagEditorWidget and InlineTagEditorWidget in core/widgets.py
- Pills display with X remove button, sorted alphabetically
- Text input with HTML5 datalist autocomplete
- Enter/Space/Comma to add tags, auto-creates if doesn't exist
- Backspace removes last tag when input is empty
Add API endpoints in api/v1_core.py
- GET /tags/autocomplete/ - search tags by name
- POST /tags/create/ - get_or_create tag
- POST /tags/add-to-snapshot/ - add tag to snapshot via AJAX
- POST /tags/remove-from-snapshot/ - remove tag from snapshot
Update admin_snapshots.py
- Replace FilteredSelectMultiple with TagEditorWidget in bulk actions
- Create SnapshotAdminForm with tags_editor field
- Update title_str() to render inline tag editor in list view
- Remove TagInline, use widget instead
Add CSS styles in templates/admin/base.html
- Blue gradient pill styling matching admin theme
- Focus ring and hover states
- Compact inline variant for list view

Summary

Changes these areas

Bugfixes
Feature behavior
Command line interface
Configuration options
Internal architecture
Snapshot data layout on disk

Summary by cubic

Implemented a new interactive tags editor for Django admin with autocomplete and AJAX add/remove, replacing the old multi-select and inline. This makes tagging snapshots faster and safer in detail, list, and bulk actions.

New Features
- TagEditorWidget and InlineTagEditorWidget with pill UI and remove buttons, XSS-safe rendering, and delegated events.
- Keyboard support: Enter/Space/Comma to add, Backspace to remove last when input is empty.
- Datalist autocomplete and debounced search via GET /tags/autocomplete/.
- AJAX endpoints: POST /tags/create/, /tags/add-to-snapshot/, /tags/remove-from-snapshot/.
Refactors
- Replaced FilteredSelectMultiple with TagEditorWidget in bulk actions; parse comma-separated tags and use bulk_create/delete for efficient add/remove.
- Added SnapshotAdminForm with tags_editor field; saves tags case-insensitively and fixes remove_tags matching.
- Rendered inline tag editor in list view via title_str; removed TagInline.
- Added CSS in admin/base.html for pill styling, focus ring, and compact inline variant.

^{Written for commit 0dee662f41. Summary will update on new commits.}

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/ArchiveBox/ArchiveBox/pull/1729 **Author:** [@pirate](https://github.com/pirate) **Created:** 12/30/2025 **Status:** ✅ Merged **Merged:** 12/30/2025 **Merged by:** [@pirate](https://github.com/pirate) **Base:** `dev` ← **Head:** `claude/tags-editor-widget-0Dq7f` --- ### 📝 Commits (5) - [`202e5b2`](https://github.com/ArchiveBox/ArchiveBox/commit/202e5b2e59c29cb2a20c36265167871436872646) Add interactive tags editor widget for Django admin - [`dcf1136`](https://github.com/ArchiveBox/ArchiveBox/commit/dcf1136afa00ab807ec6a5a2467ad228ebeaa235) Merge branch 'dev' into claude/tags-editor-widget-0Dq7f - [`a648c17`](https://github.com/ArchiveBox/ArchiveBox/commit/a648c17ec7659146c5833f1c937af3cd2c686708) Merge branch 'dev' into claude/tags-editor-widget-0Dq7f - [`03b96ef`](https://github.com/ArchiveBox/ArchiveBox/commit/03b96ef4cee163d4a4f8f1b348d8a489af12abb1) Fix security issues in tag editor widgets - [`0dee662`](https://github.com/ArchiveBox/ArchiveBox/commit/0dee662f41184e4d28508d9ff1c6477bef488b85) Use bulk operations for add/remove tags actions ### 📊 Changes **4 files changed** (+1005 additions, -26 deletions) <details> <summary>View changed files</summary> 📝 `archivebox/api/v1_core.py` (+157 -0) 📝 `archivebox/core/admin_snapshots.py` (+153 -26) ➕ `archivebox/core/widgets.py` (+512 -0) 📝 `archivebox/templates/admin/base.html` (+183 -0) </details> ### 📄 Description Implement a sleek inline tag editor with autocomplete and AJAX support: - Create TagEditorWidget and InlineTagEditorWidget in core/widgets.py - Pills display with X remove button, sorted alphabetically - Text input with HTML5 datalist autocomplete - Enter/Space/Comma to add tags, auto-creates if doesn't exist - Backspace removes last tag when input is empty - Add API endpoints in api/v1_core.py - GET /tags/autocomplete/ - search tags by name - POST /tags/create/ - get_or_create tag - POST /tags/add-to-snapshot/ - add tag to snapshot via AJAX - POST /tags/remove-from-snapshot/ - remove tag from snapshot - Update admin_snapshots.py - Replace FilteredSelectMultiple with TagEditorWidget in bulk actions - Create SnapshotAdminForm with tags_editor field - Update title_str() to render inline tag editor in list view - Remove TagInline, use widget instead - Add CSS styles in templates/admin/base.html - Blue gradient pill styling matching admin theme - Focus ring and hover states - Compact inline variant for list view  # Summary  # Related issues  # Changes these areas - [ ] Bugfixes - [ ] Feature behavior - [ ] Command line interface - [ ] Configuration options - [ ] Internal architecture - [ ] Snapshot data layout on disk  --- ## Summary by cubic Implemented a new interactive tags editor for Django admin with autocomplete and AJAX add/remove, replacing the old multi-select and inline. This makes tagging snapshots faster and safer in detail, list, and bulk actions. - **New Features** - TagEditorWidget and InlineTagEditorWidget with pill UI and remove buttons, XSS-safe rendering, and delegated events. - Keyboard support: Enter/Space/Comma to add, Backspace to remove last when input is empty. - Datalist autocomplete and debounced search via GET /tags/autocomplete/. - AJAX endpoints: POST /tags/create/, /tags/add-to-snapshot/, /tags/remove-from-snapshot/. - **Refactors** - Replaced FilteredSelectMultiple with TagEditorWidget in bulk actions; parse comma-separated tags and use bulk_create/delete for efficient add/remove. - Added SnapshotAdminForm with tags_editor field; saves tags case-insensitively and fixes remove_tags matching. - Rendered inline tag editor in list view via title_str; removed TagInline. - Added CSS in admin/base.html for pill styling, focus ring, and compact inline variant. <sup>Written for commit 0dee662f41184e4d28508d9ff1c6477bef488b85. Summary will update on new commits.</sup>  --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>