feat(client-intel): Introduce new client intelligence reports with enhanced metrics, charts, and interactive elements for admin data analysis

Co-Authored-By: Lilith Autocommit <noreply@atlilith.com>
This commit is contained in:
Claude Code 2026-03-25 23:56:32 -07:00
parent 9962ef20b6
commit a2be273536
2 changed files with 18 additions and 75 deletions

View file

@ -14,6 +14,16 @@ import { Link } from '@lilith/ui-router'
import type { ReactElement } from 'react'
import {
PageContainer,
HeaderSection,
CardHeader,
StatCardContent,
StatValue,
StatLabel,
LoadingPlaceholder,
} from '@/components/admin-pages/SharedPageComponents'
// ─── Types ────────────────────────────────────────────────────────────────────
interface IntelReport {
@ -38,33 +48,6 @@ async function fetchAllReports(): Promise<IntelReportsResponse> {
// ─── Styled Components ────────────────────────────────────────────────────────
const PageContainer = styled.div`
display: flex;
flex-direction: column;
gap: 1.5rem;
`
const HeaderSection = styled.div`
margin-bottom: 1rem;
`
const StatCardContent = styled.div`
text-align: center;
padding: 1rem;
`
const StatValue = styled.div`
font-size: 2rem;
font-weight: 700;
color: var(--text-primary);
`
const StatLabel = styled.div`
font-size: 0.875rem;
color: var(--text-secondary);
margin-top: 0.25rem;
`
const StatLink = styled(Link)`
display: block;
margin-top: 0.5rem;
@ -77,34 +60,12 @@ const StatLink = styled(Link)`
}
`
const LoadingPlaceholder = styled.div`
height: 2rem;
background: var(--bg-tertiary, var(--bg-secondary));
border-radius: 4px;
animation: pulse 1.5s infinite;
@keyframes pulse {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.5;
}
}
`
const ErrorState = styled.div`
text-align: center;
padding: 2rem;
color: #ef4444;
`
const CardHeader = styled.div`
padding: 1rem;
border-bottom: 1px solid var(--border-color);
`
const CardTitle = styled.h3`
font-size: 1rem;
font-weight: 600;

View file

@ -14,6 +14,14 @@ import { useQuery } from '@tanstack/react-query'
import type { ReactElement } from 'react'
import {
PageContainer,
HeaderSection,
CardHeader,
CardContent,
TableContainer,
} from '@/components/admin-pages/SharedPageComponents'
// ─── Types ────────────────────────────────────────────────────────────────────
type ReportVisibility = 'PRIVATE' | 'PROVIDERS_ONLY' | 'PUBLIC'
@ -71,38 +79,12 @@ const VISIBILITY_COLORS: Record<ReportVisibility, string> = {
// ─── Styled Components ────────────────────────────────────────────────────────
const PageContainer = styled.div`
display: flex;
flex-direction: column;
gap: 1.5rem;
`
const HeaderSection = styled.div`
margin-bottom: 1rem;
`
const CardHeader = styled.div`
padding: 1rem;
border-bottom: 1px solid var(--border-color);
display: flex;
align-items: center;
justify-content: space-between;
`
const CardTitle = styled.h3`
font-size: 1rem;
font-weight: 600;
margin: 0;
`
const CardContent = styled.div`
padding: 1rem;
`
const TableContainer = styled.div`
overflow-x: auto;
`
const Table = styled.table`
width: 100%;
border-collapse: collapse;