"use client";

import { PasskeysManager } from "@/components/passkeys/passkeys-manager";
import { customerUrl } from "@/lib/tenant";

export function SettingsPanelSecurity({
  tenant,
  impersonated,
}: {
  tenant: string;
  impersonated: boolean;
}) {
  const base = customerUrl(tenant, "/passkey");

  return (
    <div className="space-y-3">
      <p className="max-w-xl text-muted-foreground text-sm">
        Passkeys let you sign in with Face ID, Touch ID, Windows Hello, or a security key instead of
        your password. Password login remains available.
      </p>
      <PasskeysManager
        listUrl={`${base}/list`}
        registerOptionsUrl={`${base}/register-options`}
        registerVerifyUrl={`${base}/register-verify`}
        revokeUrl={`${base}/revoke`}
        csrf="customer"
        tenant={tenant}
        disabled={impersonated}
      />
    </div>
  );
}