>['scans'][number] }) {
- const content = <>{scan.job}{scan.status === 'success' ? 'Completed successfully · Open scan details' : scan.error ?? scan.status}
+ const outcome = scanOutcomeTone(scan.status)
+ const content = <>{scan.job}{scan.status === 'success' ? 'Completed successfully · Open scan details' : scan.error ?? scan.status}
if (scan.job_id) return {content}
return {content}
}
diff --git a/src/pages/HostDetail.tsx b/src/pages/HostDetail.tsx
index 26145954..150f7bf8 100644
--- a/src/pages/HostDetail.tsx
+++ b/src/pages/HostDetail.tsx
@@ -7,13 +7,14 @@ import { ErrorNotice } from '../components/ErrorNotice'
import { PortScopeDetails } from '../components/PortScopeDetails'
import type { HostObservation, PortObservation, ProtocolObservation, RdapResult } from '../types'
import { formatDate, formatDateTime } from '../format'
+import { hostStatusLabel } from '../status'
function displayStatusReason(reason?: string) {
return reason === 'scan-complete' ? 'full-range scan complete' : reason
}
function HostIdentity({ host }: { host: HostObservation }) {
- return
{host.address}
{host.address_family ?? (host.address.includes(':') ? 'IPv6' : 'IPv4')}{host.status ?? 'up'}{host.status_reason && {displayStatusReason(host.status_reason)}{host.reason_ttl ? ` · TTL ${host.reason_ttl}` : ''}}
{host.address}
{host.address_family ?? (host.address.includes(':') ? 'IPv6' : 'IPv4')}{hostStatusLabel(host.status ?? 'up')}{host.status_reason && {displayStatusReason(host.status_reason)}{host.reason_ttl ? ` · TTL ${host.reason_ttl}` : ''}}
{detail.data.changes.map((change, index) => (
- {change.kind}
+ {changeKindLabel(change.kind, change.old, change.new)}
{change.target}{change.port ? ` · ${change.protocol}:${change.port}` : ''}
{change.old ?? '—'} → {change.new ?? '—'}
@@ -340,6 +341,7 @@ export function JobDetail() {
) : null
const selectedScanIsVisible = Boolean(selectedScan && scans.data?.scans.some((scan) => scan.id === selectedScan))
const baselineStatus = baselinePresentation(value.baseline)
+ const jobStatus = jobStatePresentation(value.archived, value.enabled)
return (
@@ -348,9 +350,7 @@ export function JobDetail() {
← Jobs
{value.job.name}
-
- {value.archived ? 'Archived' : value.enabled ? 'Scheduled' : 'Paused'}
-
+ {jobStatus.label}
Revision {value.revision} · Updated {formatDateTime(value.updated_at)}
{formatDateTime(scan.finished_at)}
diff --git a/src/pages/platform/PlatformAdmins.tsx b/src/pages/platform/PlatformAdmins.tsx
index ffeddee9..b52d16f4 100644
--- a/src/pages/platform/PlatformAdmins.tsx
+++ b/src/pages/platform/PlatformAdmins.tsx
@@ -151,8 +151,8 @@ export function PlatformAdmins() {
{admin.display_name}{self ? ' (you)' : ''}{admin.username}{lastSignIn(admin.last_login_at)}
{admin.pending ? 'Pending activation' : admin.enabled ? 'Enabled' : 'Disabled'}{admin.totp_enabled ? 'TOTP on' : 'No TOTP'}
{!self && {admin.pending
- ? (Object.keys(pendingActions) as PendingAction[]).map(action => )
- : }
}
+ ? (Object.keys(pendingActions) as PendingAction[]).map(action => )
+ : } }
})}}
diff --git a/src/pages/platform/PlatformPages.test.tsx b/src/pages/platform/PlatformPages.test.tsx
index e735dd4c..14a5b2d7 100644
--- a/src/pages/platform/PlatformPages.test.tsx
+++ b/src/pages/platform/PlatformPages.test.tsx
@@ -65,9 +65,14 @@ describe('platform administrators', () => {
// A pending administrator has not redeemed its invitation, which is
// renewed or revoked, or the account removed, instead of disabled.
expect(within(screen.getByTestId('admin-lee')).getAllByRole('button').map(button => button.textContent)).toEqual(['Renew invitation', 'Revoke invitation', 'Remove'])
+ const pendingActions = within(screen.getByTestId('admin-lee')).getAllByRole('button')
+ expect(pendingActions[0]).not.toHaveClass('danger-text')
+ expect(pendingActions[1]).toHaveClass('danger-text')
+ expect(pendingActions[2]).toHaveClass('danger-text')
expect(within(screen.getByTestId('admin-lee')).getByText('Pending activation')).toBeInTheDocument()
expect(within(screen.getByTestId('admin-sam')).getByText('No TOTP')).toBeInTheDocument()
expect(within(screen.getByTestId('admin-kim')).getByRole('button', { name: 'Enable' })).toBeInTheDocument()
+ expect(within(screen.getByTestId('admin-sam')).getByRole('button', { name: 'Disable' })).toHaveClass('danger-text')
vi.mocked(setPlatformAdminEnabled).mockRejectedValueOnce(new APIError('the platform keeps at least one enabled platform administrator', 'last_platform_admin'))
fireEvent.click(within(screen.getByTestId('admin-sam')).getByRole('button', { name: 'Disable' }))
diff --git a/src/pages/platform/UnitAccounts.tsx b/src/pages/platform/UnitAccounts.tsx
index 73895d0d..f1b9da86 100644
--- a/src/pages/platform/UnitAccounts.tsx
+++ b/src/pages/platform/UnitAccounts.tsx
@@ -154,7 +154,7 @@ function AccountRow({ account, unitActive, onAction }: { account: UnitAccount; u
{account.display_name}{account.username} · {unitRoleLabels[account.role] ?? account.role}{lastSignIn(account.last_login_at)}
{status[0]}{account.totp_enabled ? 'TOTP on' : 'No TOTP'}
{(offered.sessions || offered.reset) &&
- {offered.sessions && }
+ {offered.sessions && }
{offered.reset && }
}
diff --git a/src/pages/platform/UnitDetail.test.tsx b/src/pages/platform/UnitDetail.test.tsx
index e0512aed..b520c839 100644
--- a/src/pages/platform/UnitDetail.test.tsx
+++ b/src/pages/platform/UnitDetail.test.tsx
@@ -108,6 +108,7 @@ describe('business unit detail', () => {
expect(within(row(username)).queryByRole('button', { name: /Reset password|New activation link/ })).not.toBeInTheDocument()
}
for (const username of ['riley', 'jordan', 'dana', 'casey', 'taylor']) expect(within(row(username)).getByRole('button', { name: /Revoke sessions/ })).toBeInTheDocument()
+ expect(within(row('casey')).getByRole('button', { name: /Revoke sessions/ })).toHaveClass('danger-text')
expect(within(row('sam')).queryByRole('button', { name: /Revoke sessions/ })).not.toBeInTheDocument()
expect(within(row('casey')).getByText('casey · Operator')).toBeInTheDocument()
expect(within(row('sam')).getByText('Pending activation')).toBeInTheDocument()
diff --git a/src/status.test.ts b/src/status.test.ts
new file mode 100644
index 00000000..f881e29c
--- /dev/null
+++ b/src/status.test.ts
@@ -0,0 +1,34 @@
+import { describe, expect, it } from 'vitest'
+import { changeKindLabel, hostStatusLabel, jobStatePresentation, scanOutcomeTone, severityLabel } from './status'
+
+describe('shared status presentation', () => {
+ it('uses consistent job labels and tones', () => {
+ expect(jobStatePresentation(false, true)).toEqual({ label: 'Scheduled', tone: 'green' })
+ expect(jobStatePresentation(false, false)).toEqual({ label: 'Paused', tone: 'amber' })
+ expect(jobStatePresentation(true, false)).toEqual({ label: 'Archived', tone: 'gray' })
+ })
+
+ it('emphasizes failed scans while keeping canceled and incomplete scans neutral', () => {
+ expect(scanOutcomeTone('success')).toBe('success')
+ expect(scanOutcomeTone('failed')).toBe('fail')
+ expect(scanOutcomeTone('canceled')).toBe('neutral')
+ expect(scanOutcomeTone('cancelled')).toBe('neutral')
+ expect(scanOutcomeTone('incomplete')).toBe('neutral')
+ })
+
+ it('turns change identifiers into readable labels', () => {
+ expect(changeKindLabel('Port_closed')).toBe('Port closed')
+ expect(changeKindLabel('dns')).toBe('DNS')
+ expect(changeKindLabel('service')).toBe('Service')
+ expect(changeKindLabel('port', 'closed', 'open')).toBe('Port opened')
+ expect(changeKindLabel('port', 'open', 'not-open')).toBe('Port closed')
+ expect(changeKindLabel('other_change')).toBe('Other change')
+ })
+
+ it('uses explicit readable labels for lower-case severity and host states', () => {
+ expect(severityLabel('critical')).toBe('Critical')
+ expect(severityLabel('warning')).toBe('Warning')
+ expect(hostStatusLabel('no-response')).toBe('No response')
+ expect(hostStatusLabel('up')).toBe('Up')
+ })
+})
diff --git a/src/status.ts b/src/status.ts
new file mode 100644
index 00000000..d7d758e3
--- /dev/null
+++ b/src/status.ts
@@ -0,0 +1,59 @@
+/** User-facing labels and tones for recurring job, scan, and change states. */
+
+export type StateTone = 'green' | 'amber' | 'gray' | 'red'
+
+export function jobStatePresentation(archived: boolean, enabled: boolean): { label: string; tone: StateTone } {
+ if (archived) return { label: 'Archived', tone: 'gray' }
+ if (enabled) return { label: 'Scheduled', tone: 'green' }
+ return { label: 'Paused', tone: 'amber' }
+}
+
+/** Success and failure are emphasized; canceled and incomplete scans stay neutral. */
+export function scanOutcomeTone(status: string): 'success' | 'fail' | 'neutral' {
+ switch (status.trim().toLowerCase()) {
+ case 'success': return 'success'
+ case 'failed':
+ case 'error': return 'fail'
+ default: return 'neutral'
+ }
+}
+
+export function changeKindLabel(kind: string, oldValue?: string, newValue?: string): string {
+ const normalized = kind.trim().toLowerCase().replace(/[^a-z0-9]+/g, '_').replace(/^_+|_+$/g, '')
+ if (['port_open', 'port_opened'].includes(normalized)) return 'Port opened'
+ if (['port_closed', 'port_removed'].includes(normalized)) return 'Port closed'
+ if (['port', 'port_state', 'port_changed'].includes(normalized)) {
+ const oldPositive = isPositivePortState(oldValue)
+ const newPositive = isPositivePortState(newValue)
+ if (newPositive && !oldPositive) return 'Port opened'
+ if (oldPositive && !newPositive) return 'Port closed'
+ return 'Port state'
+ }
+ if (normalized === 'dns' || normalized.startsWith('dns_')) return 'DNS'
+ if (normalized === 'service' || normalized.startsWith('service_')) return 'Service'
+ return humanize(normalized || kind)
+}
+
+export function severityLabel(severity: string): string {
+ const normalized = severity.trim().toLowerCase()
+ if (normalized === 'critical') return 'Critical'
+ if (normalized === 'warning') return 'Warning'
+ if (normalized === 'info') return 'Info'
+ return humanize(severity)
+}
+
+export function hostStatusLabel(status: string): string {
+ const normalized = status.trim().toLowerCase().replace(/[_-]+/g, ' ')
+ if (normalized === 'no response') return 'No response'
+ return humanize(normalized)
+}
+
+function isPositivePortState(state?: string) {
+ const normalized = state?.trim().toLowerCase()
+ return normalized === 'open' || normalized === 'open|filtered'
+}
+
+function humanize(value: string) {
+ const words = value.trim().replace(/[_-]+/g, ' ').replace(/\s+/g, ' ')
+ return words ? words[0].toUpperCase() + words.slice(1) : value
+}
diff --git a/src/styles.css b/src/styles.css
index e2203dc3..9b6e83eb 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -2007,3 +2007,11 @@ label small,
flex-direction: column;
}
}
+
+/* Keep pill copy intentional; identifiers are formatted by the UI. */
+.pill { text-transform: none; }
+
+/* Archived is a compact marker, not a full-width grid row. */
+.public-picker-archived { justify-self: start; margin-left: 0; }
+
+.legacy-banner-recheck { flex: 0 0 auto; white-space: nowrap; }