Show channel counts in the left CategoryNav sidebar (Feed/Channels/Saved)

Same "channels per category" counts as the categories management page,
now next to each button in the sidebar used across all three pages.
Categories already carry channel_count; "Все"/"Без категории" counts are
derived client-side from one extra unfiltered channels query, reused
across the three pages via a shared ['channels', 'all-for-counts'] key.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
vrubelroman 2026-09-16 20:38:06 +00:00
parent cdb1c2ded2
commit 44f81f0f0d
5 changed files with 62 additions and 6 deletions

View file

@ -1,6 +1,6 @@
import { useMutation, useInfiniteQuery, useQuery, useQueryClient } from '@tanstack/react-query'
import { Link } from 'react-router-dom'
import { getFeed, getSyncStatus, listCategories, logout, syncVideos } from '../api/client'
import { getFeed, getSyncStatus, listCategories, listChannels, logout, syncVideos } from '../api/client'
import CategoryNav, { type CategoryFilter } from '../components/CategoryNav'
import VideoCard from '../components/VideoCard'
import { useState } from 'react'
@ -12,6 +12,13 @@ function Feed() {
const categoriesQuery = useQuery({ queryKey: ['categories'], queryFn: listCategories })
const categories = categoriesQuery.data ?? []
const allChannelsQuery = useQuery({
queryKey: ['channels', 'all-for-counts'],
queryFn: () => listChannels({ subscribed: true }),
})
const allChannels = allChannelsQuery.data ?? []
const uncategorizedCount = allChannels.filter((c) => c.category_ids.length === 0).length
const feedQuery = useInfiniteQuery({
queryKey: ['feed', filter],
queryFn: ({ pageParam }) =>
@ -69,7 +76,13 @@ function Feed() {
)}
<div className="layout">
<CategoryNav categories={categories} value={filter} onChange={setFilter} />
<CategoryNav
categories={categories}
value={filter}
onChange={setFilter}
allCount={allChannels.length}
uncategorizedCount={uncategorizedCount}
/>
<div className="content">
{feedQuery.isLoading && <p>Загрузка...</p>}