type WechatScanAuthModalProps = {
  open: boolean;
  loading?: boolean;
  error?: string;
  onAuthorize: () => void;
  onCancel: () => void;
};

export default function WechatScanAuthModal({
  open,
  loading,
  error,
  onAuthorize,
  onCancel,
}: WechatScanAuthModalProps) {
  if (!open) return null;

  return (
    <div className="shop-scan-auth-overlay" role="dialog" aria-modal="true" aria-labelledby="shop-scan-auth-title">
      <div className="shop-scan-auth-card">
        <div className="shop-scan-auth-icon">
          <span className="material-symbols-outlined shop-fill-icon">qr_code_scanner</span>
        </div>
        <h2 id="shop-scan-auth-title" className="shop-scan-auth-title">微信授权</h2>
        <p className="shop-scan-auth-desc">
          扫码核销需使用微信相机扫描用户核销码。请先完成微信授权并允许使用摄像头。
        </p>
        {error && <p className="shop-scan-auth-error" role="alert">{error}</p>}
        <div className="shop-scan-auth-actions">
          <button type="button" className="shop-scan-auth-cancel" onClick={onCancel} disabled={loading}>
            取消
          </button>
          <button type="button" className="shop-scan-auth-confirm" onClick={onAuthorize} disabled={loading}>
            {loading ? '跳转授权中…' : '微信授权'}
          </button>
        </div>
      </div>
    </div>
  );
}