From cdb1c2ded2820f7462105b6abdc633b7e263d2b3 Mon Sep 17 00:00:00 2001
From: vrubelroman <vrubelroman@gmail.com>
Date: Wed, 16 Sep 2026 20:35:39 +0000
Subject: [PATCH] =?UTF-8?q?Show=20channel=20count=20for=20"=D0=91=D0=B5?=
 =?UTF-8?q?=D0=B7=20=D0=BA=D0=B0=D1=82=D0=B5=D0=B3=D0=BE=D1=80=D0=B8=D0=B8?=
 =?UTF-8?q?"=20on=20the=20categories=20management=20page?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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>
---
 frontend/src/App.css              | 10 ++++++++++
 frontend/src/pages/Categories.tsx | 13 +++++++++++++
 2 files changed, 23 insertions(+)

diff --git a/frontend/src/App.css b/frontend/src/App.css
index 6448b72..b62c032 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -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;
diff --git a/frontend/src/pages/Categories.tsx b/frontend/src/pages/Categories.tsx
index e7b415c..d5ed522 100644
--- a/frontend/src/pages/Categories.tsx
+++ b/frontend/src/pages/Categories.tsx
@@ -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">