|
|
@@ -0,0 +1,62 @@
|
|
|
+# Add History Tags Feature - 2025-06-01
|
|
|
+
|
|
|
+## User Request
|
|
|
+> in the history view of the popup menu, there are toggleable tags for each video. currently only "notable" is an option; add three more: "reference", "to rewatch", and "to save".
|
|
|
+
|
|
|
+## Implementation Summary
|
|
|
+
|
|
|
+Modified the history view in the Firefox extension popup to add three new toggleable tags alongside the existing "notable" tag.
|
|
|
+
|
|
|
+### Changes Made
|
|
|
+
|
|
|
+1. **popup/popup.html**: Added three new tag chip buttons in the history view:
|
|
|
+ - "reference" tag
|
|
|
+ - "to rewatch" tag
|
|
|
+ - "to save" tag
|
|
|
+
|
|
|
+The tags were added to the `.history-tags` div on lines 142-175, following the same pattern as the existing "notable" tag:
|
|
|
+
|
|
|
+```html
|
|
|
+<button
|
|
|
+ class="tag-chip"
|
|
|
+ :data-video-id="videoHistory.videoId"
|
|
|
+ data-tag="reference"
|
|
|
+ x-bind="tagChip"
|
|
|
+>
|
|
|
+ reference
|
|
|
+</button>
|
|
|
+<button
|
|
|
+ class="tag-chip"
|
|
|
+ :data-video-id="videoHistory.videoId"
|
|
|
+ data-tag="to rewatch"
|
|
|
+ x-bind="tagChip"
|
|
|
+>
|
|
|
+ to rewatch
|
|
|
+</button>
|
|
|
+<button
|
|
|
+ class="tag-chip"
|
|
|
+ :data-video-id="videoHistory.videoId"
|
|
|
+ data-tag="to save"
|
|
|
+ x-bind="tagChip"
|
|
|
+>
|
|
|
+ to save
|
|
|
+</button>
|
|
|
+```
|
|
|
+
|
|
|
+### Technical Notes
|
|
|
+
|
|
|
+- The existing tag functionality in `popup.js` handles all the logic:
|
|
|
+ - `toggleTag(videoId, tag)` method handles adding/removing tags from video history
|
|
|
+ - `isTagActive(videoId, tag)` method checks if a tag is active for a video
|
|
|
+ - `tagChip` binding handles click events and active state styling
|
|
|
+- CSS styles for `.tag-chip` are already implemented and work for all tags
|
|
|
+- Alpine.js CSP compliance maintained (no JavaScript expressions in HTML attributes)
|
|
|
+- All new tags use the same data binding pattern as the existing "notable" tag
|
|
|
+
|
|
|
+The implementation leverages the existing tag infrastructure, so no changes to the JavaScript logic were needed.
|
|
|
+
|
|
|
+### Files Modified
|
|
|
+- `popup/popup.html` - Added three new tag buttons to history view
|
|
|
+
|
|
|
+### Commits
|
|
|
+- eb406c5: Added three new tag buttons to history view: reference, to rewatch, and to save
|