import { HelpText } from './HelpText';
import { FieldLabel, FieldInput } from './formUtils';
import type { SectionFormProps } from './types';

/**
 * Server-side Web Push (V2) config (`notifications.push.*`): VAPID identity +
 * delivery tuning. This is the ADMIN counterpart to the per-user browser
 * subscription UI in NotificationsForm (which only manages this device's
 * subscription, not whether the server feature is enabled at all).
 */
export function PushNotificationsForm({ config, onChange }: SectionFormProps) {
  const push = config.notifications?.push ?? {};

  return (
    <div className="space-y-5">
      <h2 className="text-base font-semibold text-slate-800">Web Push (Server)</h2>
      <p className="text-[13px] text-slate-500">
        ブラウザ通知 V2（Web Push）のサーバ設定。HTTPS ホスティング必須（iOS は PWA インストールも）。
        各ユーザーの購読操作は 🔔 Notifications タブで行う。
      </p>

      <div>
        <label className="flex items-center gap-2 text-sm text-slate-700">
          <input
            type="checkbox"
            checked={push.enabled === true}
            onChange={e => onChange('notifications.push.enabled', e.target.checked)}
            className="rounded"
          />
          Web Push を有効化
        </label>
        <HelpText>マスタースイッチ。デフォルト: 無効（オペレーターが明示的に opt-in）</HelpText>
      </div>

      <div>
        <FieldLabel>VAPID Subject</FieldLabel>
        <FieldInput value={push.vapidSubject ?? ''} placeholder="https://example.com/"
          onChange={v => onChange('notifications.push.vapidSubject', v || undefined)} />
        <HelpText>RFC 8292 の VAPID subject。汎用 mailto: より運用 URL を推奨</HelpText>
      </div>

      <div>
        <FieldLabel>VAPID Current Key Path</FieldLabel>
        <FieldInput value={push.vapidCurrentPath ?? ''} placeholder="./data/secrets/vapid.json"
          onChange={v => onChange('notifications.push.vapidCurrentPath', v || undefined)} />
        <HelpText>現行 VAPID 鍵ペアファイルのパス（未生成なら mode 0600 で自動生成）</HelpText>
      </div>

      <div>
        <FieldLabel>VAPID History Dir</FieldLabel>
        <FieldInput value={push.vapidHistoryDir ?? ''} placeholder="./data/secrets/vapid-history"
          onChange={v => onChange('notifications.push.vapidHistoryDir', v || undefined)} />
        <HelpText>失効した VAPID 鍵を退避するディレクトリ</HelpText>
      </div>

      <div>
        <FieldLabel>Payload Max Bytes</FieldLabel>
        <FieldInput type="number" value={push.payloadMaxBytes ?? ''}
          onChange={v => onChange('notifications.push.payloadMaxBytes', v ? Number(v) : undefined)} />
        <HelpText>暗号化前のプッシュペイロード最大バイト数（上限 4096）。デフォルト: 3072</HelpText>
      </div>

      <div>
        <FieldLabel>Queue Concurrency</FieldLabel>
        <FieldInput type="number" value={push.queueConcurrency ?? ''}
          onChange={v => onChange('notifications.push.queueConcurrency', v ? Number(v) : undefined)} />
        <HelpText>キューからの同時送信数。デフォルト: 8</HelpText>
      </div>

      <div>
        <FieldLabel>Per-Send Timeout (ms)</FieldLabel>
        <FieldInput type="number" value={push.perSendTimeoutMs ?? ''}
          onChange={v => onChange('notifications.push.perSendTimeoutMs', v ? Number(v) : undefined)} />
        <HelpText>1 送信あたりのタイムアウト（ミリ秒）。デフォルト: 10000</HelpText>
      </div>
    </div>
  );
}
