fix: complete analytics edge cases

frontend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@family-budget/frontend",
-  "version": "0.10.2",
+  "version": "0.11.0",
   "private": true,
   "type": "module",
   "scripts": {

frontend/src/pages/AnalyticsPage.tsx

@@ -1,12 +1,14 @@
 import { useState, useEffect, useCallback } from 'react';
 import type {
   Account,
+  Category,
   AnalyticsSummaryResponse,
   ByCategoryItem,
   TimeseriesItem,
   Granularity,
 } from '@family-budget/shared';
 import { getAccounts } from '../api/accounts';
+import { getCategories } from '../api/categories';
 import { getSummary, getByCategory, getTimeseries } from '../api/analytics';
 import {
   PeriodSelector,
@@ -29,8 +31,10 @@ function getDefaultPeriod(): PeriodState {
 export function AnalyticsPage() {
   const [period, setPeriod] = useState<PeriodState>(getDefaultPeriod);
   const [accountId, setAccountId] = useState<string>('');
+  const [categoryId, setCategoryId] = useState<string>('');
   const [onlyConfirmed, setOnlyConfirmed] = useState(false);
   const [accounts, setAccounts] = useState<Account[]>([]);
+  const [categories, setCategories] = useState<Category[]>([]);
   const [summary, setSummary] = useState<AnalyticsSummaryResponse | null>(
     null,
   );
@@ -40,6 +44,7 @@ export function AnalyticsPage() {
 
   useEffect(() => {
     getAccounts().then(setAccounts).catch(() => {});
+    getCategories({ isActive: true }).then(setCategories).catch(() => {});
   }, []);
 
   const fetchAll = useCallback(async () => {
@@ -63,6 +68,7 @@ export function AnalyticsPage() {
       from: period.from,
       to: period.to,
       ...(accountId ? { accountId: Number(accountId) } : {}),
+      ...(categoryId ? { categoryId: Number(categoryId) } : {}),
       ...(onlyConfirmed ? { onlyConfirmed: true } : {}),
     };
 
@@ -80,7 +86,7 @@ export function AnalyticsPage() {
     } finally {
       setLoading(false);
     }
-  }, [period, accountId, onlyConfirmed]);
+  }, [period, accountId, categoryId, onlyConfirmed]);
 
   useEffect(() => {
     fetchAll();
@@ -122,6 +128,14 @@ export function AnalyticsPage() {
               Только подтверждённые
             </label>
           </div>
+          <div className="field">
+            <label className="field__label">Категория</label>
+            <select value={categoryId} onChange={(e) => setCategoryId(e.target.value)}>
+              <option value="">Все категории</option>
+              <option value="0">Без категории</option>
+              {categories.map((c) => <option key={c.id} value={c.id}>{c.name}</option>)}
+            </select>
+          </div>
         </div>
       </div>