Show channel count for "Без категории" on the categories management page

Reuses the existing GET /api/channels?uncategorized=true endpoint client-side
rather than changing the /api/categories response shape, which stays a
plain array (kept several existing call sites simple).
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
vrubelroman 2026-09-16 20:35:39 +00:00
parent b29bcfb8d7
commit cdb1c2ded2
2 changed files with 23 additions and 0 deletions

View file

@ -239,6 +239,16 @@
padding: 8px 12px;
}
.category-row-virtual {
background: #f7f7f7;
border-style: dashed;
color: #888;
}
.category-row-virtual .reorder-buttons {
width: 14px;
}
.reorder-buttons {
display: flex;
flex-direction: column;

View file

@ -5,6 +5,7 @@ import {
createCategory,
deleteCategory,
listCategories,
listChannels,
reorderCategories,
updateCategory,
} from '../api/client'
@ -16,6 +17,10 @@ function Categories() {
const [editingName, setEditingName] = useState('')
const categoriesQuery = useQuery({ queryKey: ['categories'], queryFn: listCategories })
const uncategorizedQuery = useQuery({
queryKey: ['channels', 'uncategorized-count'],
queryFn: () => listChannels({ subscribed: true, uncategorized: true }),
})
const invalidate = () => {
queryClient.invalidateQueries({ queryKey: ['categories'] })
@ -85,6 +90,14 @@ function Categories() {
{createMutation.isError && <p className="error">{(createMutation.error as Error).message}</p>}
<ul className="category-list">
<li className="category-row category-row-virtual">
<div className="reorder-buttons" />
<span className="category-name">Без категории</span>
<span className="category-count">
{uncategorizedQuery.isLoading ? '…' : `${uncategorizedQuery.data?.length ?? 0} канал(ов)`}
</span>
</li>
{categories.map((category, index) => (
<li key={category.id} className="category-row">
<div className="reorder-buttons">