feat: add certificate management security and cleanup dialog
- Documented certificate management security features in security.md, including backup and recovery processes. - Implemented CertificateCleanupDialog component for confirming deletion of orphaned certificates when deleting proxy hosts. - Enhanced ProxyHosts page to check for orphaned certificates and prompt users accordingly during deletion. - Added tests for certificate cleanup prompts and behaviors in ProxyHosts, ensuring correct handling of unique, shared, and production certificates.
This commit is contained in:
GitHub Actions
@@ -0,0 +1,117 @@
|
||||
import { AlertTriangle } from 'lucide-react'
|
||||
|
||||
interface CertificateCleanupDialogProps {
|
||||
onConfirm: (deleteCerts: boolean) => void
|
||||
onCancel: () => void
|
||||
certificates: Array<{ id: number; name: string; domain: string }>
|
||||
hostNames: string[]
|
||||
isBulk?: boolean
|
||||
}
|
||||
|
||||
export default function CertificateCleanupDialog({
|
||||
onConfirm,
|
||||
onCancel,
|
||||
certificates,
|
||||
hostNames,
|
||||
isBulk = false
|
||||
}: CertificateCleanupDialogProps) {
|
||||
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault()
|
||||
const formData = new FormData(e.currentTarget)
|
||||
const deleteCerts = formData.get('delete_certs') === 'on'
|
||||
onConfirm(deleteCerts)
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
className="fixed inset-0 bg-black/50 flex items-center justify-center z-50"
|
||||
onClick={onCancel}
|
||||
>
|
||||
<div
|
||||
className="bg-dark-card border border-orange-900/50 rounded-lg p-6 max-w-lg w-full mx-4"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="flex items-start gap-3 mb-4">
|
||||
<div className="flex-shrink-0 w-10 h-10 rounded-full bg-orange-900/30 flex items-center justify-center">
|
||||
<AlertTriangle className="h-5 w-5 text-orange-400" />
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<h2 className="text-xl font-bold text-white">
|
||||
Delete {isBulk ? `${hostNames.length} Proxy Hosts` : 'Proxy Host'}?
|
||||
</h2>
|
||||
<p className="text-sm text-gray-400 mt-1">
|
||||
{isBulk ? 'These hosts will be permanently deleted.' : 'This host will be permanently deleted.'}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Host names */}
|
||||
<div className="bg-gray-900/50 border border-gray-800 rounded-lg p-4 mb-4">
|
||||
<p className="text-xs font-medium text-gray-400 uppercase mb-2">
|
||||
{isBulk ? 'Hosts to be deleted:' : 'Host to be deleted:'}
|
||||
</p>
|
||||
<ul className="space-y-1 max-h-32 overflow-y-auto">
|
||||
{hostNames.map((name, idx) => (
|
||||
<li key={idx} className="text-sm text-white flex items-center gap-2">
|
||||
<span className="text-red-400">•</span>
|
||||
<span className="font-medium">{name}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Certificate cleanup option */}
|
||||
{certificates.length > 0 && (
|
||||
<div className="bg-orange-900/10 border border-orange-800/50 rounded-lg p-4 mb-4">
|
||||
<div className="flex items-start gap-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="delete_certs"
|
||||
name="delete_certs"
|
||||
className="mt-1 w-4 h-4 rounded border-gray-600 text-orange-500 focus:ring-orange-500 focus:ring-offset-0 bg-gray-700"
|
||||
/>
|
||||
<div className="flex-1">
|
||||
<label htmlFor="delete_certs" className="text-sm text-orange-300 font-medium cursor-pointer">
|
||||
Also delete {certificates.length === 1 ? 'orphaned certificate' : `${certificates.length} orphaned certificates`}
|
||||
</label>
|
||||
<p className="text-xs text-gray-400 mt-1">
|
||||
{certificates.length === 1
|
||||
? 'This custom/staging certificate will no longer be used by any hosts.'
|
||||
: 'These custom/staging certificates will no longer be used by any hosts.'}
|
||||
</p>
|
||||
<ul className="mt-2 space-y-1">
|
||||
{certificates.map((cert) => (
|
||||
<li key={cert.id} className="text-xs text-gray-300 flex items-center gap-2">
|
||||
<span className="text-orange-400">→</span>
|
||||
<span className="font-medium">{cert.name || cert.domain}</span>
|
||||
<span className="text-gray-500">({cert.domain})</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Confirmation buttons */}
|
||||
<div className="flex justify-end gap-2">
|
||||
<button
|
||||
type="button"
|
||||
onClick={onCancel}
|
||||
className="px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg font-medium transition-colors"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
className="px-4 py-2 bg-red-600 hover:bg-red-700 text-white rounded-lg font-medium transition-colors"
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -7,6 +7,7 @@ import { useCertificates } from '../hooks/useCertificates'
|
||||
import { useAccessLists } from '../hooks/useAccessLists'
|
||||
import { getSettings } from '../api/settings'
|
||||
import { createBackup } from '../api/backups'
|
||||
import { deleteCertificate } from '../api/certificates'
|
||||
import type { ProxyHost } from '../api/proxyHosts'
|
||||
import compareHosts from '../utils/compareHosts'
|
||||
import type { AccessList } from '../api/accessLists'
|
||||
@@ -15,6 +16,7 @@ import { Switch } from '../components/ui/Switch'
|
||||
import { toast } from 'react-hot-toast'
|
||||
import { formatSettingLabel, settingHelpText, applyBulkSettingsToHosts } from '../utils/proxyHostsHelpers'
|
||||
import { ConfigReloadOverlay } from '../components/LoadingStates'
|
||||
import CertificateCleanupDialog from '../components/dialogs/CertificateCleanupDialog'
|
||||
|
||||
// Helper functions extracted for unit testing and reuse
|
||||
// Helpers moved to ../utils/proxyHostsHelpers to keep component files component-only for fast refresh
|
||||
@@ -35,6 +37,13 @@ export default function ProxyHosts() {
|
||||
const [showBulkApplyModal, setShowBulkApplyModal] = useState(false)
|
||||
const [showBulkDeleteModal, setShowBulkDeleteModal] = useState(false)
|
||||
const [isCreatingBackup, setIsCreatingBackup] = useState(false)
|
||||
const [showCertCleanupDialog, setShowCertCleanupDialog] = useState(false)
|
||||
const [certCleanupData, setCertCleanupData] = useState<{
|
||||
hostUUIDs: string[]
|
||||
hostNames: string[]
|
||||
certificates: Array<{ id: number; name: string; domain: string }>
|
||||
isBulk: boolean
|
||||
} | null>(null)
|
||||
const [selectedACLs, setSelectedACLs] = useState<Set<number>>(new Set())
|
||||
const [bulkACLAction, setBulkACLAction] = useState<'apply' | 'remove'>('apply')
|
||||
const [applyProgress, setApplyProgress] = useState<{ current: number; total: number } | null>(null)
|
||||
@@ -139,6 +148,44 @@ export default function ProxyHosts() {
|
||||
const host = hosts.find(h => h.uuid === uuid)
|
||||
if (!host) return
|
||||
|
||||
// Check for orphaned certificates that would need cleanup
|
||||
const orphanedCerts: Array<{ id: number; name: string; domain: string }> = []
|
||||
|
||||
if (host.certificate_id && host.certificate) {
|
||||
const cert = host.certificate
|
||||
|
||||
// Check if this is the ONLY proxy host using this certificate
|
||||
const otherHostsUsingCert = hosts.filter(h =>
|
||||
h.uuid !== uuid && h.certificate_id === host.certificate_id
|
||||
).length
|
||||
|
||||
if (otherHostsUsingCert === 0) {
|
||||
// This is the only host using the certificate
|
||||
// Only consider custom/staging certs (not production Let's Encrypt)
|
||||
const isCustomOrStaging = cert.provider === 'custom' || cert.provider?.toLowerCase().includes('staging')
|
||||
if (isCustomOrStaging) {
|
||||
orphanedCerts.push({
|
||||
id: cert.id!,
|
||||
name: cert.name || '',
|
||||
domain: cert.domains
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// If there are orphaned certificates, show cleanup dialog
|
||||
if (orphanedCerts.length > 0) {
|
||||
setCertCleanupData({
|
||||
hostUUIDs: [uuid],
|
||||
hostNames: [host.name || host.domain_names],
|
||||
certificates: orphanedCerts,
|
||||
isBulk: false
|
||||
})
|
||||
setShowCertCleanupDialog(true)
|
||||
return
|
||||
}
|
||||
|
||||
// No orphaned certificates, proceed with standard deletion
|
||||
if (!confirm('Are you sure you want to delete this proxy host?')) return
|
||||
|
||||
try {
|
||||
@@ -162,6 +209,95 @@ export default function ProxyHosts() {
|
||||
}
|
||||
}
|
||||
|
||||
const handleCertCleanupConfirm = async (deleteCerts: boolean) => {
|
||||
if (!certCleanupData) return
|
||||
|
||||
setShowCertCleanupDialog(false)
|
||||
|
||||
try {
|
||||
// Delete hosts first
|
||||
if (certCleanupData.isBulk) {
|
||||
// Bulk deletion
|
||||
let deleted = 0
|
||||
let failed = 0
|
||||
|
||||
for (const uuid of certCleanupData.hostUUIDs) {
|
||||
try {
|
||||
await deleteHost(uuid)
|
||||
deleted++
|
||||
} catch {
|
||||
failed++
|
||||
}
|
||||
}
|
||||
|
||||
// Delete certificates if user confirmed
|
||||
if (deleteCerts && certCleanupData.certificates.length > 0) {
|
||||
let certsDeleted = 0
|
||||
let certsFailed = 0
|
||||
|
||||
for (const cert of certCleanupData.certificates) {
|
||||
try {
|
||||
await deleteCertificate(cert.id)
|
||||
certsDeleted++
|
||||
} catch {
|
||||
certsFailed++
|
||||
}
|
||||
}
|
||||
|
||||
if (certsFailed > 0) {
|
||||
toast.error(`Deleted ${deleted} host(s) and ${certsDeleted} certificate(s), ${certsFailed} certificate(s) failed`)
|
||||
} else {
|
||||
toast.success(`Deleted ${deleted} host(s) and ${certsDeleted} certificate(s)`)
|
||||
}
|
||||
} else {
|
||||
if (failed > 0) {
|
||||
toast.error(`Deleted ${deleted} host(s), ${failed} failed`)
|
||||
} else {
|
||||
toast.success(`Successfully deleted ${deleted} host(s)`)
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// Single deletion
|
||||
const uuid = certCleanupData.hostUUIDs[0]
|
||||
const host = hosts.find(h => h.uuid === uuid)
|
||||
|
||||
// Check for uptime monitors
|
||||
let associatedMonitors: UptimeMonitor[] = []
|
||||
try {
|
||||
const monitors = await getMonitors()
|
||||
associatedMonitors = monitors.filter(m =>
|
||||
host && (m.upstream_host === host.forward_host || (m.proxy_host_id && m.proxy_host_id === (host as unknown as { id?: number }).id))
|
||||
)
|
||||
} catch {
|
||||
// ignore errors
|
||||
}
|
||||
|
||||
if (associatedMonitors.length > 0) {
|
||||
const deleteUptime = confirm('This proxy host has uptime monitors associated with it. Delete the monitors as well?')
|
||||
await deleteHost(uuid, deleteUptime)
|
||||
} else {
|
||||
await deleteHost(uuid)
|
||||
}
|
||||
|
||||
// Delete certificate if user confirmed
|
||||
if (deleteCerts && certCleanupData.certificates.length > 0) {
|
||||
try {
|
||||
await deleteCertificate(certCleanupData.certificates[0].id)
|
||||
toast.success('Proxy host and certificate deleted')
|
||||
} catch (err) {
|
||||
toast.error(`Proxy host deleted but failed to delete certificate: ${err instanceof Error ? err.message : 'Unknown error'}`)
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
toast.error(err instanceof Error ? err.message : 'Failed to delete')
|
||||
} finally {
|
||||
setCertCleanupData(null)
|
||||
setSelectedHosts(new Set())
|
||||
setShowBulkDeleteModal(false)
|
||||
}
|
||||
}
|
||||
|
||||
const toggleHostSelection = (uuid: string) => {
|
||||
setSelectedHosts(prev => {
|
||||
const next = new Set(prev)
|
||||
@@ -212,7 +348,51 @@ export default function ProxyHosts() {
|
||||
toast.dismiss()
|
||||
toast.success(`Backup created: ${backup.filename}`)
|
||||
|
||||
// Delete each host
|
||||
// Collect certificates to potentially delete
|
||||
const certsToConsider: Map<number, { id: number; name: string; domain: string }> = new Map()
|
||||
|
||||
hostUUIDs.forEach(uuid => {
|
||||
const host = hosts.find(h => h.uuid === uuid)
|
||||
if (host?.certificate_id && host.certificate) {
|
||||
const cert = host.certificate
|
||||
// Only consider custom/staging certs
|
||||
const isCustomOrStaging = cert.provider === 'custom' || cert.provider?.toLowerCase().includes('staging')
|
||||
if (isCustomOrStaging) {
|
||||
// Check if this cert is ONLY used by hosts being deleted
|
||||
const otherHosts = hosts.filter(h =>
|
||||
h.certificate_id === host.certificate_id &&
|
||||
!hostUUIDs.includes(h.uuid)
|
||||
)
|
||||
if (otherHosts.length === 0 && cert.id) {
|
||||
certsToConsider.set(cert.id, {
|
||||
id: cert.id,
|
||||
name: cert.name || '',
|
||||
domain: cert.domains
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
// If there are orphaned certificates, show cleanup dialog
|
||||
if (certsToConsider.size > 0) {
|
||||
const hostNames = hostUUIDs.map(uuid => {
|
||||
const host = hosts.find(h => h.uuid === uuid)
|
||||
return host?.name || host?.domain_names || 'Unnamed'
|
||||
})
|
||||
|
||||
setCertCleanupData({
|
||||
hostUUIDs,
|
||||
hostNames,
|
||||
certificates: Array.from(certsToConsider.values()),
|
||||
isBulk: true
|
||||
})
|
||||
setShowCertCleanupDialog(true)
|
||||
setIsCreatingBackup(false)
|
||||
return
|
||||
}
|
||||
|
||||
// No orphaned certificates, proceed with deletion
|
||||
let deleted = 0
|
||||
let failed = 0
|
||||
|
||||
@@ -908,6 +1088,20 @@ export default function ProxyHosts() {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Certificate Cleanup Dialog */}
|
||||
{showCertCleanupDialog && certCleanupData && (
|
||||
<CertificateCleanupDialog
|
||||
onConfirm={handleCertCleanupConfirm}
|
||||
onCancel={() => {
|
||||
setShowCertCleanupDialog(false)
|
||||
setCertCleanupData(null)
|
||||
}}
|
||||
certificates={certCleanupData.certificates}
|
||||
hostNames={certCleanupData.hostNames}
|
||||
isBulk={certCleanupData.isBulk}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
|
||||
@@ -0,0 +1,442 @@
|
||||
import { render, screen, waitFor, within } from '@testing-library/react'
|
||||
import userEvent from '@testing-library/user-event'
|
||||
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
|
||||
import { MemoryRouter } from 'react-router-dom'
|
||||
import { vi, describe, it, expect, beforeEach } from 'vitest'
|
||||
import type { ProxyHost, Certificate } from '../../api/proxyHosts'
|
||||
import ProxyHosts from '../ProxyHosts'
|
||||
import * as proxyHostsApi from '../../api/proxyHosts'
|
||||
import * as certificatesApi from '../../api/certificates'
|
||||
import * as accessListsApi from '../../api/accessLists'
|
||||
import * as settingsApi from '../../api/settings'
|
||||
import * as uptimeApi from '../../api/uptime'
|
||||
import * as backupsApi from '../../api/backups'
|
||||
import { createMockProxyHost } from '../../testUtils/createMockProxyHost'
|
||||
|
||||
vi.mock('react-hot-toast', () => ({
|
||||
toast: {
|
||||
success: vi.fn(),
|
||||
error: vi.fn(),
|
||||
loading: vi.fn(),
|
||||
dismiss: vi.fn()
|
||||
}
|
||||
}))
|
||||
|
||||
vi.mock('../../api/proxyHosts', () => ({
|
||||
getProxyHosts: vi.fn(),
|
||||
createProxyHost: vi.fn(),
|
||||
updateProxyHost: vi.fn(),
|
||||
deleteProxyHost: vi.fn(),
|
||||
bulkUpdateACL: vi.fn(),
|
||||
testProxyHostConnection: vi.fn(),
|
||||
}))
|
||||
|
||||
vi.mock('../../api/certificates', () => ({
|
||||
getCertificates: vi.fn(),
|
||||
deleteCertificate: vi.fn(),
|
||||
}))
|
||||
vi.mock('../../api/accessLists', () => ({ accessListsApi: { list: vi.fn() } }))
|
||||
vi.mock('../../api/settings', () => ({ getSettings: vi.fn() }))
|
||||
vi.mock('../../api/backups', () => ({ createBackup: vi.fn() }))
|
||||
vi.mock('../../api/uptime', () => ({ getMonitors: vi.fn() }))
|
||||
|
||||
const createQueryClient = () => new QueryClient({
|
||||
defaultOptions: {
|
||||
queries: { retry: false, gcTime: 0 },
|
||||
mutations: { retry: false }
|
||||
}
|
||||
})
|
||||
|
||||
const renderWithProviders = (ui: React.ReactNode) => {
|
||||
const queryClient = createQueryClient()
|
||||
return render(
|
||||
<QueryClientProvider client={queryClient}>
|
||||
<MemoryRouter>{ui}</MemoryRouter>
|
||||
</QueryClientProvider>
|
||||
)
|
||||
}
|
||||
|
||||
const baseHost = (overrides: Partial<ProxyHost> = {}) => createMockProxyHost(overrides)
|
||||
|
||||
describe('ProxyHosts - Certificate Cleanup Prompts', () => {
|
||||
beforeEach(() => {
|
||||
vi.clearAllMocks()
|
||||
vi.mocked(accessListsApi.accessListsApi.list).mockResolvedValue([])
|
||||
vi.mocked(settingsApi.getSettings).mockResolvedValue({})
|
||||
vi.mocked(uptimeApi.getMonitors).mockResolvedValue([])
|
||||
vi.mocked(backupsApi.createBackup).mockResolvedValue({ filename: 'backup.db' } as any)
|
||||
})
|
||||
|
||||
it('prompts to delete certificate when deleting proxy host with unique custom cert', async () => {
|
||||
const cert: Certificate = {
|
||||
id: 1,
|
||||
uuid: 'cert-1',
|
||||
provider: 'custom',
|
||||
name: 'CustomCert',
|
||||
domains: 'test.com',
|
||||
expires_at: '2026-01-01T00:00:00Z'
|
||||
}
|
||||
const host = baseHost({
|
||||
uuid: 'h1',
|
||||
name: 'Host1',
|
||||
certificate_id: 1,
|
||||
certificate: cert
|
||||
})
|
||||
|
||||
vi.mocked(proxyHostsApi.getProxyHosts).mockResolvedValue([host])
|
||||
vi.mocked(certificatesApi.getCertificates).mockResolvedValue([])
|
||||
vi.mocked(proxyHostsApi.deleteProxyHost).mockResolvedValue()
|
||||
vi.mocked(certificatesApi.deleteCertificate).mockResolvedValue()
|
||||
|
||||
renderWithProviders(<ProxyHosts />)
|
||||
await waitFor(() => expect(screen.getByText('Host1')).toBeTruthy())
|
||||
|
||||
const deleteBtn = screen.getByRole('button', { name: /delete/i })
|
||||
await userEvent.click(deleteBtn)
|
||||
|
||||
// Certificate cleanup dialog should appear
|
||||
await waitFor(() => {
|
||||
expect(screen.getByText('Delete Proxy Host?')).toBeTruthy()
|
||||
expect(screen.getByText(/Also delete.*orphaned certificate/i)).toBeTruthy()
|
||||
expect(screen.getByText('CustomCert')).toBeTruthy()
|
||||
})
|
||||
|
||||
// Checkbox for certificate deletion (should be unchecked by default)
|
||||
const checkbox = screen.getByRole('checkbox', { name: /Also delete/i }) as HTMLInputElement
|
||||
expect(checkbox.checked).toBe(false)
|
||||
|
||||
// Check the checkbox to delete certificate
|
||||
await userEvent.click(checkbox)
|
||||
|
||||
// Confirm deletion - get all Delete buttons and use the one in the dialog (last one)
|
||||
const deleteButtons = screen.getAllByRole('button', { name: 'Delete' })
|
||||
await userEvent.click(deleteButtons[deleteButtons.length - 1])
|
||||
|
||||
await waitFor(() => {
|
||||
expect(proxyHostsApi.deleteProxyHost).toHaveBeenCalledWith('h1')
|
||||
expect(certificatesApi.deleteCertificate).toHaveBeenCalledWith(1)
|
||||
})
|
||||
})
|
||||
|
||||
it('does NOT prompt for certificate deletion when cert is shared by multiple hosts', async () => {
|
||||
const cert: Certificate = {
|
||||
id: 1,
|
||||
uuid: 'cert-1',
|
||||
provider: 'custom',
|
||||
name: 'SharedCert',
|
||||
domains: 'shared.com',
|
||||
expires_at: '2026-01-01T00:00:00Z'
|
||||
}
|
||||
const host1 = baseHost({ uuid: 'h1', name: 'Host1', certificate_id: 1, certificate: cert })
|
||||
const host2 = baseHost({ uuid: 'h2', name: 'Host2', certificate_id: 1, certificate: cert })
|
||||
|
||||
vi.mocked(proxyHostsApi.getProxyHosts).mockResolvedValue([host1, host2])
|
||||
vi.mocked(certificatesApi.getCertificates).mockResolvedValue([])
|
||||
vi.mocked(proxyHostsApi.deleteProxyHost).mockResolvedValue()
|
||||
|
||||
const confirmSpy = vi.spyOn(window, 'confirm').mockReturnValue(true)
|
||||
|
||||
renderWithProviders(<ProxyHosts />)
|
||||
await waitFor(() => expect(screen.getByText('Host1')).toBeTruthy())
|
||||
|
||||
const deleteButtons = screen.getAllByRole('button', { name: /delete/i })
|
||||
await userEvent.click(deleteButtons[0])
|
||||
|
||||
// Should show standard confirmation, not certificate cleanup dialog
|
||||
await waitFor(() => expect(confirmSpy).toHaveBeenCalledWith('Are you sure you want to delete this proxy host?'))
|
||||
expect(proxyHostsApi.deleteProxyHost).toHaveBeenCalledWith('h1')
|
||||
expect(certificatesApi.deleteCertificate).not.toHaveBeenCalled()
|
||||
|
||||
confirmSpy.mockRestore()
|
||||
})
|
||||
|
||||
it('does NOT prompt for production Let\'s Encrypt certificates', async () => {
|
||||
const cert: Certificate = {
|
||||
id: 1,
|
||||
uuid: 'cert-1',
|
||||
provider: 'letsencrypt',
|
||||
name: 'LE Prod',
|
||||
domains: 'prod.com',
|
||||
expires_at: '2026-01-01T00:00:00Z'
|
||||
}
|
||||
const host = baseHost({ uuid: 'h1', name: 'Host1', certificate_id: 1, certificate: cert })
|
||||
|
||||
vi.mocked(proxyHostsApi.getProxyHosts).mockResolvedValue([host])
|
||||
vi.mocked(certificatesApi.getCertificates).mockResolvedValue([])
|
||||
vi.mocked(proxyHostsApi.deleteProxyHost).mockResolvedValue()
|
||||
|
||||
const confirmSpy = vi.spyOn(window, 'confirm').mockReturnValue(true)
|
||||
|
||||
renderWithProviders(<ProxyHosts />)
|
||||
await waitFor(() => expect(screen.getByText('Host1')).toBeTruthy())
|
||||
|
||||
const deleteBtn = screen.getByRole('button', { name: /delete/i })
|
||||
await userEvent.click(deleteBtn)
|
||||
|
||||
// Should show standard confirmation only
|
||||
await waitFor(() => expect(confirmSpy).toHaveBeenCalledTimes(1))
|
||||
expect(certificatesApi.deleteCertificate).not.toHaveBeenCalled()
|
||||
|
||||
confirmSpy.mockRestore()
|
||||
})
|
||||
|
||||
it('prompts for staging certificates', async () => {
|
||||
const cert: Certificate = {
|
||||
id: 1,
|
||||
uuid: 'cert-1',
|
||||
provider: 'letsencrypt-staging',
|
||||
name: 'Staging Cert',
|
||||
domains: 'staging.com',
|
||||
expires_at: '2026-01-01T00:00:00Z'
|
||||
}
|
||||
const host = baseHost({ uuid: 'h1', name: 'Host1', certificate_id: 1, certificate: cert })
|
||||
|
||||
vi.mocked(proxyHostsApi.getProxyHosts).mockResolvedValue([host])
|
||||
vi.mocked(certificatesApi.getCertificates).mockResolvedValue([])
|
||||
vi.mocked(proxyHostsApi.deleteProxyHost).mockResolvedValue()
|
||||
|
||||
renderWithProviders(<ProxyHosts />)
|
||||
await waitFor(() => expect(screen.getByText('Host1')).toBeTruthy())
|
||||
|
||||
const deleteBtn = screen.getByRole('button', { name: /delete/i })
|
||||
await userEvent.click(deleteBtn)
|
||||
|
||||
// Certificate cleanup dialog should appear
|
||||
await waitFor(() => {
|
||||
expect(screen.getByText('Delete Proxy Host?')).toBeTruthy()
|
||||
expect(screen.getByText(/Also delete.*orphaned certificate/i)).toBeTruthy()
|
||||
})
|
||||
|
||||
// Decline certificate deletion (click Delete without checking the box)
|
||||
const deleteButtons = screen.getAllByRole('button', { name: 'Delete' })
|
||||
await userEvent.click(deleteButtons[deleteButtons.length - 1])
|
||||
|
||||
await waitFor(() => {
|
||||
expect(proxyHostsApi.deleteProxyHost).toHaveBeenCalledWith('h1')
|
||||
expect(certificatesApi.deleteCertificate).not.toHaveBeenCalled()
|
||||
})
|
||||
})
|
||||
|
||||
it('handles certificate deletion failure gracefully', async () => {
|
||||
const cert: Certificate = {
|
||||
id: 1,
|
||||
uuid: 'cert-1',
|
||||
provider: 'custom',
|
||||
name: 'CustomCert',
|
||||
domains: 'custom.com',
|
||||
expires_at: '2026-01-01T00:00:00Z'
|
||||
}
|
||||
const host = baseHost({ uuid: 'h1', name: 'Host1', certificate_id: 1, certificate: cert })
|
||||
|
||||
vi.mocked(proxyHostsApi.getProxyHosts).mockResolvedValue([host])
|
||||
vi.mocked(certificatesApi.getCertificates).mockResolvedValue([])
|
||||
vi.mocked(proxyHostsApi.deleteProxyHost).mockResolvedValue()
|
||||
vi.mocked(certificatesApi.deleteCertificate).mockRejectedValue(
|
||||
new Error('Certificate is still in use')
|
||||
)
|
||||
|
||||
renderWithProviders(<ProxyHosts />)
|
||||
await waitFor(() => expect(screen.getByText('Host1')).toBeTruthy())
|
||||
|
||||
const deleteBtn = screen.getByRole('button', { name: /delete/i })
|
||||
await userEvent.click(deleteBtn)
|
||||
|
||||
await waitFor(() => expect(screen.getByText('Delete Proxy Host?')).toBeTruthy())
|
||||
|
||||
// Check the certificate deletion checkbox
|
||||
const checkbox = screen.getByRole('checkbox', { name: /Also delete/i })
|
||||
await userEvent.click(checkbox)
|
||||
|
||||
// Confirm deletion
|
||||
const deleteButtons = screen.getAllByRole('button', { name: 'Delete' })
|
||||
await userEvent.click(deleteButtons[deleteButtons.length - 1])
|
||||
|
||||
await waitFor(() => {
|
||||
expect(proxyHostsApi.deleteProxyHost).toHaveBeenCalledWith('h1')
|
||||
expect(certificatesApi.deleteCertificate).toHaveBeenCalledWith(1)
|
||||
})
|
||||
|
||||
// Toast should show error about certificate but host was deleted
|
||||
const toast = await import('react-hot-toast')
|
||||
await waitFor(() => {
|
||||
expect(toast.toast.error).toHaveBeenCalledWith(
|
||||
expect.stringContaining('failed to delete certificate')
|
||||
)
|
||||
})
|
||||
})
|
||||
|
||||
it('bulk delete prompts for orphaned certificates', async () => {
|
||||
const cert: Certificate = {
|
||||
id: 1,
|
||||
uuid: 'cert-1',
|
||||
provider: 'custom',
|
||||
name: 'BulkCert',
|
||||
domains: 'bulk.com',
|
||||
expires_at: '2026-01-01T00:00:00Z'
|
||||
}
|
||||
const host1 = baseHost({ uuid: 'h1', name: 'Host1', certificate_id: 1, certificate: cert })
|
||||
const host2 = baseHost({ uuid: 'h2', name: 'Host2', certificate_id: 1, certificate: cert })
|
||||
|
||||
vi.mocked(proxyHostsApi.getProxyHosts).mockResolvedValue([host1, host2])
|
||||
vi.mocked(certificatesApi.getCertificates).mockResolvedValue([])
|
||||
vi.mocked(proxyHostsApi.deleteProxyHost).mockResolvedValue()
|
||||
vi.mocked(certificatesApi.deleteCertificate).mockResolvedValue()
|
||||
|
||||
renderWithProviders(<ProxyHosts />)
|
||||
await waitFor(() => expect(screen.getByText('Host1')).toBeTruthy())
|
||||
|
||||
// Select all hosts
|
||||
const selectAllCheckbox = screen.getAllByRole('checkbox')[0]
|
||||
await userEvent.click(selectAllCheckbox)
|
||||
|
||||
// Click bulk delete button (the one with Trash icon in toolbar)
|
||||
const bulkDeleteButtons = screen.getAllByRole('button', { name: /delete/i })
|
||||
await userEvent.click(bulkDeleteButtons[0]) // First is the bulk delete button in the toolbar
|
||||
|
||||
// Confirm in bulk delete modal
|
||||
await waitFor(() => expect(screen.getByText(/Delete 2 Proxy Hosts/)).toBeTruthy())
|
||||
const deletePermBtn = screen.getByRole('button', { name: /Delete Permanently/i })
|
||||
await userEvent.click(deletePermBtn)
|
||||
|
||||
// Should show certificate cleanup dialog
|
||||
await waitFor(() => {
|
||||
expect(screen.getByText(/Also delete.*orphaned certificate/i)).toBeTruthy()
|
||||
expect(screen.getByText('BulkCert')).toBeTruthy()
|
||||
})
|
||||
|
||||
// Check the certificate deletion checkbox
|
||||
const certCheckbox = screen.getByRole('checkbox', { name: /Also delete/i })
|
||||
await userEvent.click(certCheckbox)
|
||||
|
||||
// Confirm
|
||||
const deleteButtons = screen.getAllByRole('button', { name: 'Delete' })
|
||||
await userEvent.click(deleteButtons[deleteButtons.length - 1])
|
||||
|
||||
await waitFor(() => {
|
||||
expect(proxyHostsApi.deleteProxyHost).toHaveBeenCalledWith('h1')
|
||||
expect(proxyHostsApi.deleteProxyHost).toHaveBeenCalledWith('h2')
|
||||
expect(certificatesApi.deleteCertificate).toHaveBeenCalledWith(1)
|
||||
})
|
||||
})
|
||||
|
||||
it('bulk delete does NOT prompt when certificate is still used by other hosts', async () => {
|
||||
const cert: Certificate = {
|
||||
id: 1,
|
||||
uuid: 'cert-1',
|
||||
provider: 'custom',
|
||||
name: 'SharedCert',
|
||||
domains: 'shared.com',
|
||||
expires_at: '2026-01-01T00:00:00Z'
|
||||
}
|
||||
const host1 = baseHost({ uuid: 'h1', name: 'Host1', certificate_id: 1, certificate: cert })
|
||||
const host2 = baseHost({ uuid: 'h2', name: 'Host2', certificate_id: 1, certificate: cert })
|
||||
const host3 = baseHost({ uuid: 'h3', name: 'Host3', certificate_id: 1, certificate: cert })
|
||||
|
||||
vi.mocked(proxyHostsApi.getProxyHosts).mockResolvedValue([host1, host2, host3])
|
||||
vi.mocked(certificatesApi.getCertificates).mockResolvedValue([])
|
||||
vi.mocked(proxyHostsApi.deleteProxyHost).mockResolvedValue()
|
||||
|
||||
renderWithProviders(<ProxyHosts />)
|
||||
await waitFor(() => expect(screen.getByText('Host1')).toBeTruthy())
|
||||
|
||||
// Select only host1 and host2 (host3 still uses the cert)
|
||||
const host1Row = screen.getByText('Host1').closest('tr') as HTMLTableRowElement
|
||||
const host2Row = screen.getByText('Host2').closest('tr') as HTMLTableRowElement
|
||||
const host1Checkbox = within(host1Row).getByRole('checkbox', { name: /Select Host1/ })
|
||||
const host2Checkbox = within(host2Row).getByRole('checkbox', { name: /Select Host2/ })
|
||||
|
||||
await userEvent.click(host1Checkbox)
|
||||
await userEvent.click(host2Checkbox)
|
||||
|
||||
// Wait for bulk operations to be available
|
||||
await waitFor(() => expect(screen.getByText('Bulk Apply')).toBeTruthy())
|
||||
|
||||
// Click bulk delete
|
||||
const bulkDeleteButtons = screen.getAllByRole('button', { name: /delete/i })
|
||||
await userEvent.click(bulkDeleteButtons[0]) // First is the bulk delete button in the toolbar
|
||||
|
||||
// Confirm in modal
|
||||
await waitFor(() => expect(screen.getByText(/Delete 2 Proxy Hosts/)).toBeTruthy())
|
||||
const deletePermBtn = screen.getByRole('button', { name: /Delete Permanently/i })
|
||||
await userEvent.click(deletePermBtn)
|
||||
|
||||
// Should NOT show certificate cleanup dialog (host3 still uses it)
|
||||
await waitFor(() => {
|
||||
expect(proxyHostsApi.deleteProxyHost).toHaveBeenCalledWith('h1')
|
||||
expect(proxyHostsApi.deleteProxyHost).toHaveBeenCalledWith('h2')
|
||||
expect(certificatesApi.deleteCertificate).not.toHaveBeenCalled()
|
||||
})
|
||||
})
|
||||
|
||||
it('allows cancelling certificate cleanup dialog', async () => {
|
||||
const cert: Certificate = {
|
||||
id: 1,
|
||||
uuid: 'cert-1',
|
||||
provider: 'custom',
|
||||
name: 'CustomCert',
|
||||
domains: 'test.com',
|
||||
expires_at: '2026-01-01T00:00:00Z'
|
||||
}
|
||||
const host = baseHost({ uuid: 'h1', name: 'Host1', certificate_id: 1, certificate: cert })
|
||||
|
||||
vi.mocked(proxyHostsApi.getProxyHosts).mockResolvedValue([host])
|
||||
vi.mocked(certificatesApi.getCertificates).mockResolvedValue([])
|
||||
|
||||
renderWithProviders(<ProxyHosts />)
|
||||
await waitFor(() => expect(screen.getByText('Host1')).toBeTruthy())
|
||||
|
||||
const deleteBtn = screen.getByRole('button', { name: /delete/i })
|
||||
await userEvent.click(deleteBtn)
|
||||
|
||||
// Certificate cleanup dialog appears
|
||||
await waitFor(() => expect(screen.getByText('Delete Proxy Host?')).toBeTruthy())
|
||||
|
||||
// Click Cancel
|
||||
const cancelBtn = screen.getByRole('button', { name: 'Cancel' })
|
||||
await userEvent.click(cancelBtn)
|
||||
|
||||
// Dialog should close, nothing deleted
|
||||
await waitFor(() => {
|
||||
expect(screen.queryByText('Delete Proxy Host?')).toBeFalsy()
|
||||
expect(proxyHostsApi.deleteProxyHost).not.toHaveBeenCalled()
|
||||
expect(certificatesApi.deleteCertificate).not.toHaveBeenCalled()
|
||||
})
|
||||
})
|
||||
|
||||
it('default state is unchecked for certificate deletion (conservative)', async () => {
|
||||
const cert: Certificate = {
|
||||
id: 1,
|
||||
uuid: 'cert-1',
|
||||
provider: 'custom',
|
||||
name: 'CustomCert',
|
||||
domains: 'test.com',
|
||||
expires_at: '2026-01-01T00:00:00Z'
|
||||
}
|
||||
const host = baseHost({ uuid: 'h1', name: 'Host1', certificate_id: 1, certificate: cert })
|
||||
|
||||
vi.mocked(proxyHostsApi.getProxyHosts).mockResolvedValue([host])
|
||||
vi.mocked(certificatesApi.getCertificates).mockResolvedValue([])
|
||||
vi.mocked(proxyHostsApi.deleteProxyHost).mockResolvedValue()
|
||||
|
||||
renderWithProviders(<ProxyHosts />)
|
||||
await waitFor(() => expect(screen.getByText('Host1')).toBeTruthy())
|
||||
|
||||
const deleteBtn = screen.getByRole('button', { name: /delete/i })
|
||||
await userEvent.click(deleteBtn)
|
||||
|
||||
await waitFor(() => expect(screen.getByText('Delete Proxy Host?')).toBeTruthy())
|
||||
|
||||
// Checkbox should be unchecked by default
|
||||
const checkbox = screen.getByRole('checkbox', { name: /Also delete/i }) as HTMLInputElement
|
||||
expect(checkbox.checked).toBe(false)
|
||||
|
||||
// Confirm deletion without checking the box
|
||||
const deleteButtons = screen.getAllByRole('button', { name: 'Delete' })
|
||||
await userEvent.click(deleteButtons[deleteButtons.length - 1])
|
||||
|
||||
await waitFor(() => {
|
||||
expect(proxyHostsApi.deleteProxyHost).toHaveBeenCalledWith('h1')
|
||||
expect(certificatesApi.deleteCertificate).not.toHaveBeenCalled()
|
||||
})
|
||||
})
|
||||
})
|
||||
Reference in New Issue
Block a user