Backend: - @active_required + @with_user_context applied to all LLM-invoking routes in personas.py, focus_group_ai.py, ai_personas.py - backend/app/routes/usage.py: GET /api/usage/me (MTD summary by feature), GET /api/usage/focus-groups/<id> (owner or admin) - Registered usage_bp in app/__init__.py - llm_service._record_usage now emits usage_update WS event to focus group room Frontend: - useMyUsage + useFocusGroupUsage hooks - MyUsage.tsx: personal billing dashboard (cost cards + per-feature table) - /billing route (ProtectedRoute) + Billing nav link - FocusGroupSession: quota_warning amber banner with Progress bar, quota_exceeded + quota_warning WS events wired via websocketServiceNew Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
19 lines
511 B
TypeScript
19 lines
511 B
TypeScript
import { useQuery } from '@tanstack/react-query';
|
|
import api from '@/lib/api';
|
|
|
|
export function useMyUsage() {
|
|
return useQuery({
|
|
queryKey: ['usage', 'me'],
|
|
queryFn: () => api.get('/usage/me').then(r => r.data),
|
|
staleTime: 60_000,
|
|
});
|
|
}
|
|
|
|
export function useFocusGroupUsage(fgId: string | undefined) {
|
|
return useQuery({
|
|
queryKey: ['usage', 'focus-group', fgId],
|
|
queryFn: () => api.get(`/usage/focus-groups/${fgId}`).then(r => r.data),
|
|
staleTime: 60_000,
|
|
enabled: !!fgId,
|
|
});
|
|
}
|