feat(gallery,tags): clear active filters
Two gaps where a filter couldn't be removed:
- Gallery: a tag_id filter (from clicking a tag) had no indicator or clear
control — only post_id did (PostInfoHeader). Add an "Tag: <name> ✕" chip
that clears the filter by dropping tag_id from the URL. New lightweight
GET /api/tags/<id> resolves the name; the store fetches it on filter set.
- Tags view: the kind chip-group used mandatory="false" — a STRING ("false"
is truthy in JS), which made the group mandatory so the active kind chip
couldn't be deselected. Fixed to :mandatory="false" so the filter clears.
Tests: GET /tags/<id> shape + 404; gallery store resolves filterTagName.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -22,6 +22,9 @@ export const useGalleryStore = defineStore('gallery', () => {
|
||||
const loading = ref(false)
|
||||
const error = ref(null)
|
||||
const filter = ref({ tag_id: null, post_id: null })
|
||||
// Display name for the active tag filter, so the gallery can label a
|
||||
// "Tag: X ✕" chip instead of leaving the filter invisible/unclearable.
|
||||
const filterTagName = ref(null)
|
||||
|
||||
const timelineBuckets = ref([])
|
||||
const timelineLoading = ref(false)
|
||||
@@ -94,10 +97,20 @@ export const useGalleryStore = defineStore('gallery', () => {
|
||||
function setTagFilter(tagId) {
|
||||
filter.value.tag_id = tagId
|
||||
filter.value.post_id = null
|
||||
filterTagName.value = null
|
||||
if (tagId) _resolveTagName(tagId) // fire-and-forget; chip label only
|
||||
loadInitial()
|
||||
loadTimeline()
|
||||
}
|
||||
|
||||
async function _resolveTagName(tagId) {
|
||||
try {
|
||||
filterTagName.value = (await api.get(`/api/tags/${tagId}`)).name
|
||||
} catch {
|
||||
// Leave null — the chip falls back to "#<id>".
|
||||
}
|
||||
}
|
||||
|
||||
function setPostFilter(postId) {
|
||||
filter.value.post_id = postId
|
||||
filter.value.tag_id = null
|
||||
@@ -110,7 +123,7 @@ export const useGalleryStore = defineStore('gallery', () => {
|
||||
|
||||
return {
|
||||
images, dateGroups, hasMore, isEmpty, loading, error,
|
||||
filter, timelineBuckets, timelineLoading,
|
||||
filter, filterTagName, timelineBuckets, timelineLoading,
|
||||
loadInitial, loadMore, loadTimeline, jumpTo, setTagFilter, setPostFilter
|
||||
}
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user