"use client"

import { OrgSettingsSection } from "@/components/admin/settings/org-settings-form"
import {
  SettingsCard,
  SettingsCheckboxRow,
  SettingsField,
  SettingsGrid,
  SettingsToggleRow,
} from "@/components/settings/settings-kit"
import { AutomationTabMasonry } from "@/components/gmail/settings/automation/automation-tab-masonry"
import { useOrgSettingsStore } from "@/lib/admin-settings/org-settings-store"
import { Input } from "@/components/ui/input"

const METHODS = [
  { id: "totp" as const, label: "Application TOTP" },
  { id: "webauthn" as const, label: "Clés de sécurité (WebAuthn)" },
]

export function SecuritySection() {
  const twoFactor = useOrgSettingsStore((s) => s.twoFactor)
  const setTwoFactor = useOrgSettingsStore((s) => s.setTwoFactor)

  function toggleMethod(id: (typeof METHODS)[number]["id"], checked: boolean) {
    const methods = checked
      ? [...new Set([...twoFactor.allowed_methods, id])]
      : twoFactor.allowed_methods.filter((m) => m !== id)
    setTwoFactor({ allowed_methods: methods })
  }

  return (
    <OrgSettingsSection
      title="Sécurité et 2FA"
      description="Politiques d'authentification à deux facteurs pour l'organisation."
      policySection="two_factor"
    >
      <AutomationTabMasonry columns={2}>
        <SettingsCard title="Exigences" description="Quand le second facteur est requis.">
          <SettingsToggleRow
            title="2FA obligatoire pour tous"
            description="Chaque utilisateur doit configurer un second facteur."
            checked={twoFactor.required_for_all}
            onCheckedChange={(required_for_all) => setTwoFactor({ required_for_all })}
          />
          <SettingsToggleRow
            title="2FA obligatoire pour les administrateurs"
            checked={twoFactor.required_for_admins}
            onCheckedChange={(required_for_admins) => setTwoFactor({ required_for_admins })}
          />
        </SettingsCard>

        <SettingsCard
          title="Méthodes autorisées"
          description="Seconds facteurs proposés aux utilisateurs."
        >
          {METHODS.map((method) => (
            <SettingsCheckboxRow
              key={method.id}
              title={method.label}
              checked={twoFactor.allowed_methods.includes(method.id)}
              onCheckedChange={(v) => toggleMethod(method.id, v)}
            />
          ))}
        </SettingsCard>

        <SettingsCard title="Délais" description="Périodes de tolérance et de mémorisation.">
          <SettingsGrid columns={2}>
            <SettingsField label="Période de grâce (jours)">
              <Input
                className="h-9"
                type="number"
                min={0}
                value={twoFactor.grace_period_days}
                onChange={(e) =>
                  setTwoFactor({ grace_period_days: Number(e.target.value) || 0 })
                }
              />
            </SettingsField>
            <SettingsField label="Mémoriser l'appareil (jours)">
              <Input
                className="h-9"
                type="number"
                min={0}
                value={twoFactor.remember_device_days}
                onChange={(e) =>
                  setTwoFactor({ remember_device_days: Number(e.target.value) || 0 })
                }
              />
            </SettingsField>
          </SettingsGrid>
        </SettingsCard>
      </AutomationTabMasonry>
    </OrgSettingsSection>
  )
}