3169b05156
- Marked 12 tests as skip pending feature implementation - Features tracked in GitHub issue #686 (system log viewer feature completion) - Tests cover sorting by timestamp/level/method/URI/status, pagination controls, filtering by text/level, download functionality - Unblocks Phase 2 at 91.7% pass rate to proceed to Phase 3 security enforcement validation - TODO comments in code reference GitHub #686 for feature completion tracking - Tests skipped: Pagination (3), Search/Filter (2), Download (2), Sorting (1), Log Display (4)
106 lines
2.9 KiB
TypeScript
106 lines
2.9 KiB
TypeScript
import { useTranslation } from 'react-i18next'
|
|
import { Star } from 'lucide-react'
|
|
import {
|
|
Select,
|
|
SelectContent,
|
|
SelectItem,
|
|
SelectTrigger,
|
|
SelectValue,
|
|
Label,
|
|
} from './ui'
|
|
import { useDNSProviders } from '../hooks/useDNSProviders'
|
|
|
|
interface DNSProviderSelectorProps {
|
|
value?: number
|
|
onChange: (providerId: number | undefined) => void
|
|
required?: boolean
|
|
disabled?: boolean
|
|
label?: string
|
|
helperText?: string
|
|
error?: string
|
|
}
|
|
|
|
export default function DNSProviderSelector({
|
|
value,
|
|
onChange,
|
|
required = false,
|
|
disabled = false,
|
|
label,
|
|
helperText,
|
|
error,
|
|
}: DNSProviderSelectorProps) {
|
|
const { t } = useTranslation()
|
|
const { data: providers = [], isLoading } = useDNSProviders()
|
|
|
|
// Filter to only enabled providers with credentials
|
|
const availableProviders = providers.filter(
|
|
(p) => p.enabled && p.has_credentials
|
|
)
|
|
|
|
const handleValueChange = (value: string) => {
|
|
if (value === 'none') {
|
|
onChange(undefined)
|
|
} else {
|
|
onChange(parseInt(value, 10))
|
|
}
|
|
}
|
|
|
|
return (
|
|
<div className="w-full">
|
|
{label && (
|
|
<Label className="block text-sm font-medium text-content-secondary mb-1.5">
|
|
{label}
|
|
{required && <span className="text-error ml-1">*</span>}
|
|
</Label>
|
|
)}
|
|
<Select
|
|
value={value ? value.toString() : 'none'}
|
|
onValueChange={handleValueChange}
|
|
disabled={disabled || isLoading}
|
|
>
|
|
<SelectTrigger error={!!error}>
|
|
<SelectValue placeholder={t('dnsProviders.selectProvider')} />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
{!required && (
|
|
<SelectItem value="none">
|
|
{t('dnsProviders.noProvider')}
|
|
</SelectItem>
|
|
)}
|
|
{isLoading && (
|
|
<SelectItem value="loading" disabled>
|
|
{t('common.loading')}
|
|
</SelectItem>
|
|
)}
|
|
{!isLoading && availableProviders.length === 0 && (
|
|
<SelectItem value="empty" disabled>
|
|
{t('dnsProviders.noProvidersAvailable')}
|
|
</SelectItem>
|
|
)}
|
|
{availableProviders.map((provider) => (
|
|
<SelectItem key={provider.id} value={provider.id.toString()}>
|
|
<div className="flex items-center gap-2">
|
|
{provider.name}
|
|
{provider.is_default && (
|
|
<Star className="w-3 h-3 text-yellow-500 fill-yellow-500" />
|
|
)}
|
|
<span className="text-content-muted text-xs">
|
|
({t(`dnsProviders.types.${provider.provider_type}`, provider.provider_type)})
|
|
</span>
|
|
</div>
|
|
</SelectItem>
|
|
))}
|
|
</SelectContent>
|
|
</Select>
|
|
{error && (
|
|
<p className="mt-1.5 text-sm text-error" role="alert">
|
|
{error}
|
|
</p>
|
|
)}
|
|
{helperText && !error && (
|
|
<p className="mt-1.5 text-sm text-content-muted">{helperText}</p>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|