import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
import { Label } from '@/components/ui/label'
import { Switch } from '@/components/ui/switch'
import { Textarea } from '@/components/ui/textarea'
import { Input } from '@/components/ui/input'
import { ProIndicator } from '@/components/pro/pro-indicator'
import type { EmailVerificationSettings } from '@/features/spam/email-verification/config'

type Props = {
  settings: EmailVerificationSettings
  updateSettings: <K extends keyof EmailVerificationSettings>(key: K, value: EmailVerificationSettings[K]) => void
}

/** Mounted only when the licensed Pro domain-restrictions provider is available. */
export function DomainRestrictions({ settings, updateSettings }: Props) {
  return <Card className="shadow-none">
    <CardHeader>
      <CardTitle className="flex items-center gap-2">Email domain restrictions <ProIndicator size="sm" /></CardTitle>
      <CardDescription>Prevent new accounts from using email domains you block.</CardDescription>
    </CardHeader>
    <CardContent className="space-y-5">
      <div className="flex items-center justify-between gap-6">
        <div className="min-w-0 space-y-1">
          <Label htmlFor="registration-block-domains">Block email domains</Label>
          <p id="registration-block-domains-help" className="text-sm text-muted-foreground">Works independently of email verification and administrator approval.</p>
        </div>
        <Switch id="registration-block-domains" aria-describedby="registration-block-domains-help" checked={settings.blockedEmailDomainsEnabled} onCheckedChange={value => updateSettings('blockedEmailDomainsEnabled', value)} />
      </div>
      {settings.blockedEmailDomainsEnabled && <>
        <div className="space-y-2">
          <Label htmlFor="registration-domain-list">Blocked domains</Label>
          <Textarea id="registration-domain-list" rows={5} maxLength={32000} spellCheck={false} autoCapitalize="none" autoCorrect="off" placeholder={'example.com\nexample.org'} value={settings.blockedEmailDomains} onChange={event => updateSettings('blockedEmailDomains', event.target.value)} aria-describedby="registration-domain-list-help" />
          <p id="registration-domain-list-help" className="text-sm text-muted-foreground">One domain per line or separated by commas, up to 500 domains. Matching ignores case and includes subdomains. Do not enter full email addresses or URLs.</p>
        </div>
        <div className="space-y-2">
          <Label htmlFor="registration-domain-message">Rejection message</Label>
          <Input id="registration-domain-message" maxLength={1000} value={settings.blockedEmailDomainMessage} onChange={event => updateSettings('blockedEmailDomainMessage', event.target.value)} aria-describedby="registration-domain-message-help" />
          <p id="registration-domain-message-help" className="text-sm text-muted-foreground">Shown on the registration form. Leave blank to use the default message.</p>
        </div>
        <p className="text-sm text-muted-foreground">Applies to WordPress registration and new WooCommerce accounts, including checkout registration. Existing accounts and users created directly by administrators are not affected.</p>
      </>}
    </CardContent>
  </Card>
}