Summary
Add ability to filter or view only bookmarks that have annotations attached.
Context
Users can now annotate bookmarks with personal notes. However, there's no easy way to:
- See which bookmarks have annotations at a glance
- Filter the bookmarks list to show only annotated items
- Search through annotation text
Related: #136 (original annotation feature), #233 (cloud sync)
Current Behavior
- Bookmarks shown in chronological order
- No visual indicator of which bookmarks have annotations
- Must open each bookmark to see if it has an annotation
Expected Behavior
- Visual indicator (icon/badge) on bookmarks that have annotations
- Filter option to show "Only annotated" bookmarks
- Optionally: Search within annotation text
Potential Implementation
Visual Indicator
- Add annotation icon/badge to PostCard when
hasAnnotation(tweetId) is true
- Files:
src/components/PostCard.tsx, src/components/PostList.tsx
Filter Option
- Add filter toggle in BookmarksScreen header (e.g.,
a key to toggle)
- Filter bookmarks list using
getAnnotatedTweetIds()
- Files:
src/screens/BookmarksScreen.tsx
UI Mockup
Bookmarks [a] Annotated only: ON
─────────────────────────────────────────────────────
📝 Tweet with annotation...
@user · 2h
[annotation preview]
📝 Another annotated tweet...
@user2 · 5h
Additional Context
The useAnnotations hook already exposes:
hasAnnotation(tweetId) - check if tweet has annotation
getAnnotatedTweetIds() - get all annotated tweet IDs
getAnnotation(tweetId) - get annotation text
These can be used directly to implement the filter.
Summary
Add ability to filter or view only bookmarks that have annotations attached.
Context
Users can now annotate bookmarks with personal notes. However, there's no easy way to:
Related: #136 (original annotation feature), #233 (cloud sync)
Current Behavior
Expected Behavior
Potential Implementation
Visual Indicator
hasAnnotation(tweetId)is truesrc/components/PostCard.tsx,src/components/PostList.tsxFilter Option
akey to toggle)getAnnotatedTweetIds()src/screens/BookmarksScreen.tsxUI Mockup
Additional Context
The
useAnnotationshook already exposes:hasAnnotation(tweetId)- check if tweet has annotationgetAnnotatedTweetIds()- get all annotated tweet IDsgetAnnotation(tweetId)- get annotation textThese can be used directly to implement the filter.