lilith/platform-codebase
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

feat(gov-detection): ✨ Implement government detection page with React component for admin security features

Browse source 
Co-Authored-By: Lilith Autocommit <noreply@atlilith.com>
This commit is contained in:
Claude Code 2026-03-25 23:56:36 -07:00
parent 0748af6c36
commit 7f46ba4af7
1 changed files with 33 additions and 80 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

113
features/platform-admin/frontend-admin/src/pages/security/gov-detection/GovDetectionPage.tsx
View file

@ -18,65 +18,18 @@ import type { GovDetectionQueryParams, ResponseTier, PaginatedGovDetections } fr
import { fetchGovDetections } from '@/api'
import { SecurityEventType } from '@/types'
const PageContainer = styled.div`
display: flex;
flex-direction: column;
gap: 1.5rem;
`
const HeaderSection = styled.div`
margin-bottom: 1rem;
`
const CardContent = styled.div`
padding: 1rem;
`
const FiltersRow = styled.div`
display: flex;
gap: 1rem;
flex-wrap: wrap;
align-items: flex-end;
`
const FilterGroup = styled.div`
display: flex;
flex-direction: column;
gap: 0.25rem;
`
const FilterLabel = styled.label`
font-size: 0.75rem;
font-weight: 500;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
`
const TableContainer = styled.div`
overflow-x: auto;
`
const Table = styled.table`
width: 100%;
border-collapse: collapse;
font-size: 0.875rem;
`
const Th = styled.th`
text-align: left;
padding: 0.75rem 1rem;
font-weight: 600;
color: var(--text-secondary);
border-bottom: 1px solid var(--border-color);
background: var(--bg-secondary);
`
const Td = styled.td`
padding: 0.75rem 1rem;
border-bottom: 1px solid var(--border-color);
color: var(--text-primary);
`
import {
PageContainer,
HeaderSection,
CardContent,
FiltersRow,
FilterGroup,
FilterLabel,
TableContainer,
AdminTable,
AdminTh,
AdminTd,
} from '@/components/admin-pages/SharedPageComponents'
const TierBadge = styled(Badge)<{ $tier: ResponseTier | null }>`
background: ${({ $tier }): string =>
@ -256,52 +209,52 @@ export const GovDetectionPage = (): ReactElement => {
) : logs.length === 0 ? (
<EmptyState>No detection logs found</EmptyState>
) : (
<Table>
<AdminTable>
<thead>
<tr>
<Th>Time</Th>
<Th>Event</Th>
<Th>Tier</Th>
<Th>Confidence</Th>
<Th>Organization</Th>
<Th>Country</Th>
<Th>IP Hash</Th>
<AdminTh>Time</AdminTh>
<AdminTh>Event</AdminTh>
<AdminTh>Tier</AdminTh>
<AdminTh>Confidence</AdminTh>
<AdminTh>Organization</AdminTh>
<AdminTh>Country</AdminTh>
<AdminTh>IP Hash</AdminTh>
</tr>
</thead>
<tbody>
{logs.map((log) => (
<tr key={log.id}>
<Td title={format(new Date(log.createdAt), 'PPpp')}>
<AdminTd title={format(new Date(log.createdAt), 'PPpp')}>
{format(new Date(log.createdAt), 'MMM d, HH:mm')}
</Td>
<Td>
</AdminTd>
<AdminTd>
<EventTypeBadge $isEvasion={log.evasionDetected}>
{formatEventType(log.eventType)}
</EventTypeBadge>
</Td>
<Td>
</AdminTd>
<AdminTd>
{log.responseTier ? (
<TierBadge $tier={log.responseTier}>{log.responseTier}</TierBadge>
) : (
'-'
)}
</Td>
<Td>
</AdminTd>
<AdminTd>
{log.confidence ? (
<ConfidenceBadge $level={log.confidence}>{log.confidence}</ConfidenceBadge>
) : (
'-'
)}
</Td>
<Td>{log.organizationName || '-'}</Td>
<Td>{log.country || '-'}</Td>
<Td>
</AdminTd>
<AdminTd>{log.organizationName || '-'}</AdminTd>
<AdminTd>{log.country || '-'}</AdminTd>
<AdminTd>
<IpHash title={log.ipHash}>{truncateHash(log.ipHash)}</IpHash>
</Td>
</AdminTd>
</tr>
))}
</tbody>
</Table>
</AdminTable>
)}
</TableContainer>
<CardContent>