feat(v11-a): hashtags 4 categories capsules monospace + selecteur Politique

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Jules Neny
2026-05-11 15:03:45 +02:00
parent 5589678abc
commit 62794459ac
2 changed files with 262 additions and 70 deletions

View File

@@ -20,6 +20,7 @@ interface JournalPayload {
const items = ref<JournalItem[]>([])
const filters = ref<Record<string, boolean>>({})
const platformFilter = ref<string | null>(null)
const loading = ref(true)
const errored = ref(false)
const empty = ref(false)
@@ -45,9 +46,15 @@ const onFilterChange = (e: Event) => {
}
}
const onPlatformChange = (e: Event) => {
const ce = e as CustomEvent
platformFilter.value = ce.detail?.platform ?? null
}
onMounted(async () => {
loadFilters()
window.addEventListener('hashtag-filter-change', onFilterChange as EventListener)
window.addEventListener('platform-filter-change', onPlatformChange as EventListener)
try {
const res = await fetch(JOURNAL_URL, { cache: 'no-store' })
if (!res.ok) {
@@ -67,17 +74,28 @@ onMounted(async () => {
onUnmounted(() => {
window.removeEventListener('hashtag-filter-change', onFilterChange as EventListener)
window.removeEventListener('platform-filter-change', onPlatformChange as EventListener)
})
const visibleItems = computed(() => {
// Tous les filtres faux = aucun affiche ; tous true ou aucune cle = tout afficher
const keys = Object.keys(filters.value)
if (keys.length === 0) return items.value
const activeKeys = keys.filter((k) => filters.value[k])
// Si l'utilisateur a explicitement décoché tous les hashtags, on n'affiche rien
if (activeKeys.length === 0 && keys.some((k) => filters.value[k] === false)) return []
if (activeKeys.length === 0) return items.value
return items.value.filter((it) => activeKeys.includes(it.hashtag))
let filtered: JournalItem[]
if (keys.length === 0) {
filtered = items.value
} else {
const activeKeys = keys.filter((k) => filters.value[k])
if (activeKeys.length === 0 && keys.some((k) => filters.value[k] === false)) {
filtered = []
} else if (activeKeys.length === 0) {
filtered = items.value
} else {
filtered = items.value.filter((it) => activeKeys.includes(it.hashtag))
}
}
if (platformFilter.value) {
filtered = filtered.filter((it) => it.platform === platformFilter.value)
}
return filtered
})
const formatDate = (iso: string) => {