@easypayment/medusa-paypal 0.2.3 → 0.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -335,965 +335,965 @@ function AdditionalSettingsTab() {
335
335
  )
336
336
  ] }) });
337
337
  }
338
- const config = defineRouteConfig({
339
- label: "PayPal Connection",
340
- hide: true
341
- });
342
- if (typeof window !== "undefined") {
343
- const preloadHref = "https://www.paypal.com/webapps/merchantboarding/js/lib/lightbox/partner.js";
344
- const existingPreload = document.head.querySelector(
345
- `link[rel="preload"][href="${preloadHref}"]`
346
- );
347
- if (!existingPreload) {
348
- const preloadLink = document.createElement("link");
349
- preloadLink.rel = "preload";
350
- preloadLink.href = preloadHref;
351
- preloadLink.as = "script";
352
- document.head.appendChild(preloadLink);
353
- }
354
- const existingScript = document.getElementById(
355
- "paypal-partner-js"
356
- );
357
- if (!existingScript) {
358
- const ppScript = document.createElement("script");
359
- ppScript.id = "paypal-partner-js";
360
- ppScript.src = preloadHref;
361
- ppScript.async = true;
362
- document.head.appendChild(ppScript);
338
+ const DEFAULT_FORM = {
339
+ enabled: true,
340
+ title: "Credit or Debit Card",
341
+ disabledCards: [],
342
+ threeDS: "when_required",
343
+ cardSaveEnabled: false
344
+ };
345
+ function mergeWithDefaults(saved) {
346
+ if (!saved) return { ...DEFAULT_FORM };
347
+ const entries = Object.entries(saved).filter(([, value]) => value !== void 0);
348
+ return {
349
+ ...DEFAULT_FORM,
350
+ ...Object.fromEntries(entries)
351
+ };
352
+ }
353
+ const CARD_BRANDS = [
354
+ { value: "visa", label: "Visa" },
355
+ { value: "mastercard", label: "Mastercard" },
356
+ { value: "amex", label: "American Express" },
357
+ { value: "discover", label: "Discover" },
358
+ { value: "diners", label: "Diners Club" },
359
+ { value: "jcb", label: "JCB" },
360
+ { value: "unionpay", label: "UnionPay" }
361
+ ];
362
+ const THREE_DS_OPTIONS = [
363
+ {
364
+ value: "when_required",
365
+ label: "3D Secure when required",
366
+ hint: "Triggers 3DS only when the card / issuer requires it."
367
+ },
368
+ {
369
+ value: "sli",
370
+ label: "3D Secure (SCA) / liability shift (recommended)",
371
+ hint: "Attempts to optimize for liability shift while remaining compliant."
372
+ },
373
+ {
374
+ value: "always",
375
+ label: "Always request 3D Secure",
376
+ hint: "Forces 3DS challenge whenever possible (may reduce conversion)."
363
377
  }
378
+ ];
379
+ function cx$1(...parts) {
380
+ return parts.filter(Boolean).join(" ");
364
381
  }
365
- const SERVICE_URL = "/admin/paypal/onboarding-link";
366
- const CACHE_KEY = "pp_onboard_cache";
367
- const RELOAD_KEY = "pp_onboard_reloaded_once";
368
- const CACHE_EXPIRY = 10 * 60 * 1e3;
369
- const ONBOARDING_COMPLETE_ENDPOINT = "/admin/paypal/onboard-complete";
370
- const STATUS_ENDPOINT = "/admin/paypal/status";
371
- const SAVE_CREDENTIALS_ENDPOINT = "/admin/paypal/save-credentials";
372
- const DISCONNECT_ENDPOINT = "/admin/paypal/disconnect";
373
- let cachedUrl = null;
374
- if (typeof window !== "undefined") {
375
- try {
376
- const cached = localStorage.getItem(CACHE_KEY);
377
- if (cached) {
378
- const data = JSON.parse(cached);
379
- if ((/* @__PURE__ */ new Date()).getTime() - data.ts < CACHE_EXPIRY) {
380
- cachedUrl = data.url;
382
+ function Pill$1({
383
+ children,
384
+ onRemove
385
+ }) {
386
+ return /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 rounded-md border border-ui-border-base bg-ui-bg-base px-2 py-1 text-sm text-ui-fg-base", children: [
387
+ children,
388
+ onRemove ? /* @__PURE__ */ jsx(
389
+ "button",
390
+ {
391
+ type: "button",
392
+ onClick: onRemove,
393
+ className: "ml-1 rounded px-1 text-ui-fg-subtle hover:text-ui-fg-base",
394
+ "aria-label": "Remove",
395
+ children: "×"
381
396
  }
382
- }
383
- } catch (e) {
384
- console.error("Cache read error:", e);
385
- }
397
+ ) : null
398
+ ] });
386
399
  }
387
- function PayPalConnectionPage() {
388
- const [env, setEnv] = useState("sandbox");
400
+ function SectionCard$1({
401
+ title,
402
+ description,
403
+ right,
404
+ children
405
+ }) {
406
+ return /* @__PURE__ */ jsxs("div", { className: "rounded-xl border border-ui-border-base bg-ui-bg-base shadow-sm", children: [
407
+ /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4 border-b border-ui-border-base p-4", children: [
408
+ /* @__PURE__ */ jsxs("div", { children: [
409
+ /* @__PURE__ */ jsx("div", { className: "text-base font-semibold text-ui-fg-base", children: title }),
410
+ description ? /* @__PURE__ */ jsx("div", { className: "mt-1 text-sm text-ui-fg-subtle", children: description }) : null
411
+ ] }),
412
+ right
413
+ ] }),
414
+ /* @__PURE__ */ jsx("div", { className: "p-4", children })
415
+ ] });
416
+ }
417
+ function FieldRow$1({
418
+ label,
419
+ hint,
420
+ children
421
+ }) {
422
+ return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-12 items-start gap-4 py-3", children: [
423
+ /* @__PURE__ */ jsxs("div", { className: "col-span-12 md:col-span-4", children: [
424
+ /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-ui-fg-base", children: label }),
425
+ hint ? /* @__PURE__ */ jsx("div", { className: "mt-1 text-xs text-ui-fg-subtle", children: hint }) : null
426
+ ] }),
427
+ /* @__PURE__ */ jsx("div", { className: "col-span-12 md:col-span-8", children })
428
+ ] });
429
+ }
430
+ function AdvancedCardPaymentsTab() {
431
+ var _a, _b;
432
+ const [form, setForm] = useState(() => ({ ...DEFAULT_FORM }));
433
+ const [loading, setLoading] = useState(false);
434
+ const [saving, setSaving] = useState(false);
435
+ const [toast, setToast] = useState(null);
436
+ const didInit = useRef(false);
389
437
  useEffect(() => {
390
- fetch("/admin/paypal/environment", { method: "GET" }).then((r) => r.json()).then((d) => {
391
- const v = (d == null ? void 0 : d.environment) === "live" ? "live" : "sandbox";
392
- setEnv(v);
393
- }).catch(() => {
394
- });
395
- }, []);
396
- const [connState, setConnState] = useState("loading");
397
- const [error, setError] = useState(null);
398
- const [finalUrl, setFinalUrl] = useState("");
399
- const [showManual, setShowManual] = useState(false);
400
- const [clientId, setClientId] = useState("");
401
- const [secret, setSecret] = useState("");
402
- const [merchantId, setMerchantId] = useState("");
403
- const [statusInfo, setStatusInfo] = useState(null);
404
- const [onboardingInProgress, setOnboardingInProgress] = useState(false);
405
- const initLoaderRef = useRef(null);
406
- const paypalButtonRef = useRef(null);
407
- const errorLogRef = useRef(null);
408
- const runIdRef = useRef(0);
409
- const currentRunId = useRef(0);
410
- const ppBtnMeasureRef = useRef(null);
411
- const [ppBtnWidth, setPpBtnWidth] = useState(null);
412
- const canSaveManual = useMemo(() => {
413
- return clientId.trim().length > 0 && secret.trim().length > 0;
414
- }, [clientId, secret]);
415
- const maskValue = useCallback((value, visibleChars = 4) => {
416
- if (!value) return "";
417
- if (value.length <= visibleChars) {
418
- return "•".repeat(value.length);
419
- }
420
- return `${"•".repeat(Math.max(0, value.length - visibleChars))}${value.slice(
421
- -visibleChars
422
- )}`;
423
- }, []);
424
- const fetchFreshLink = useCallback(
425
- (runId) => {
426
- if (initLoaderRef.current) {
427
- const loaderText = initLoaderRef.current.querySelector("#loader-text");
428
- if (loaderText)
429
- loaderText.textContent = "Generating onboarding session...";
438
+ if (didInit.current) return;
439
+ didInit.current = true;
440
+ (async () => {
441
+ try {
442
+ setLoading(true);
443
+ const r = await fetch("/admin/paypal/settings", {
444
+ credentials: "include",
445
+ headers: { "Accept": "application/json" }
446
+ });
447
+ if (!r.ok) return;
448
+ const json = await r.json();
449
+ const payload = (json == null ? void 0 : json.data) ?? json;
450
+ const saved = payload == null ? void 0 : payload.advanced_card_payments;
451
+ if (saved && typeof saved === "object") {
452
+ setForm(mergeWithDefaults(saved));
453
+ }
454
+ } finally {
455
+ setLoading(false);
430
456
  }
431
- fetch(SERVICE_URL, {
457
+ })();
458
+ }, []);
459
+ async function onSave() {
460
+ try {
461
+ setSaving(true);
462
+ const r = await fetch("/admin/paypal/settings", {
432
463
  method: "POST",
433
- headers: { "content-type": "application/json" },
434
- body: JSON.stringify({
435
- products: ["PPCP"]
436
- })
437
- }).then((r) => r.json()).then((data) => {
438
- if (runId !== currentRunId.current) return;
439
- const href = data == null ? void 0 : data.onboarding_url;
440
- if (!href) {
441
- showError("Onboarding URL not returned.");
442
- return;
443
- }
444
- const finalUrl2 = href + (href.includes("?") ? "&" : "?") + "displayMode=minibrowser";
445
- localStorage.setItem(
446
- CACHE_KEY,
447
- JSON.stringify({
448
- url: finalUrl2,
449
- ts: Date.now()
450
- })
451
- );
452
- if (!localStorage.getItem(RELOAD_KEY)) {
453
- localStorage.setItem(RELOAD_KEY, "1");
454
- window.location.reload();
455
- return;
456
- }
457
- activatePayPal(finalUrl2, runId);
458
- }).catch(() => {
459
- if (runId !== currentRunId.current) return;
460
- showError("Unable to connect to service.");
464
+ credentials: "include",
465
+ headers: {
466
+ "Content-Type": "application/json",
467
+ "Accept": "application/json"
468
+ },
469
+ body: JSON.stringify({ advanced_card_payments: form })
461
470
  });
462
- },
463
- [env]
464
- );
465
- const showUI = useCallback(() => {
466
- var _a, _b, _c, _d;
467
- const btn = document.querySelector('[data-paypal-button="true"]');
468
- if (btn && ((_d = (_c = (_b = (_a = window.PAYPAL) == null ? void 0 : _a.apps) == null ? void 0 : _b.Signup) == null ? void 0 : _c.miniBrowser) == null ? void 0 : _d.init)) {
469
- window.PAYPAL.apps.Signup.miniBrowser.init();
470
- }
471
- setConnState("ready");
472
- }, []);
473
- const showError = useCallback((msg) => {
474
- setConnState("error");
475
- setError(msg);
476
- }, []);
477
- const activatePayPal = useCallback(
478
- (url, runId) => {
479
- if (paypalButtonRef.current) {
480
- paypalButtonRef.current.href = url;
481
- }
482
- setFinalUrl(url);
483
- const tryInit = () => {
484
- var _a, _b;
485
- if (runId !== currentRunId.current) return;
486
- if ((_b = (_a = window.PAYPAL) == null ? void 0 : _a.apps) == null ? void 0 : _b.Signup) {
487
- showUI();
488
- return;
489
- }
490
- setTimeout(tryInit, 50);
491
- };
492
- tryInit();
493
- },
494
- [showUI]
495
- );
496
- useEffect(() => {
497
- currentRunId.current = ++runIdRef.current;
498
- const runId = currentRunId.current;
499
- let cancelled = false;
500
- const run = async () => {
501
- setConnState("loading");
502
- setError(null);
503
- setFinalUrl("");
504
- try {
505
- const r = await fetch(`${STATUS_ENDPOINT}?environment=${env}`, {
506
- method: "GET"
507
- });
508
- const st = await r.json().catch(() => ({}));
509
- if (cancelled || runId !== currentRunId.current) return;
510
- setStatusInfo(st);
511
- const isConnected = (st == null ? void 0 : st.status) === "connected" && (st == null ? void 0 : st.seller_client_id_present) === true;
512
- if (isConnected) {
513
- setConnState("connected");
514
- setShowManual(false);
515
- return;
516
- }
517
- } catch (e) {
518
- console.error(e);
519
- }
520
- if (cachedUrl) {
521
- console.log("Using prioritized cache...");
522
- activatePayPal(cachedUrl, runId);
523
- } else {
524
- fetchFreshLink(runId);
525
- }
526
- };
527
- run();
528
- return () => {
529
- cancelled = true;
530
- currentRunId.current = 0;
531
- };
532
- }, [env, fetchFreshLink, activatePayPal]);
533
- useLayoutEffect(() => {
534
- window.onboardingCallback = async function(authCode, sharedId) {
535
- var _a, _b, _c, _d, _e, _f, _g;
536
- try {
537
- ;
538
- window.onbeforeunload = "";
539
- } catch {
540
- }
541
- setOnboardingInProgress(true);
542
- setConnState("loading");
543
- setError(null);
544
- const payload = {
545
- authCode,
546
- sharedId,
547
- env: env === "sandbox" ? "sandbox" : "live"
548
- };
549
- try {
550
- const res = await fetch(ONBOARDING_COMPLETE_ENDPOINT, {
551
- method: "POST",
552
- headers: { "content-type": "application/json" },
553
- body: JSON.stringify(payload)
554
- });
555
- if (!res.ok) {
556
- const txt = await res.text().catch(() => "");
557
- throw new Error(txt || `Onboarding exchange failed (${res.status})`);
558
- }
559
- try {
560
- const close1 = (_d = (_c = (_b = (_a = window.PAYPAL) == null ? void 0 : _a.apps) == null ? void 0 : _b.Signup) == null ? void 0 : _c.MiniBrowser) == null ? void 0 : _d.closeFlow;
561
- if (typeof close1 === "function") close1();
562
- } catch {
563
- }
564
- try {
565
- const close2 = ((_g = (_f = (_e = window.PAYPAL) == null ? void 0 : _e.apps) == null ? void 0 : _f.Signup) == null ? void 0 : _g.miniBrowser) && window.PAYPAL.apps.Signup.miniBrowser.closeFlow;
566
- if (typeof close2 === "function") close2();
567
- } catch {
568
- }
569
- try {
570
- localStorage.removeItem(CACHE_KEY);
571
- localStorage.removeItem(RELOAD_KEY);
572
- } catch {
573
- }
574
- window.location.href = window.location.href;
575
- } catch (e) {
576
- console.error(e);
577
- setConnState("error");
578
- setError((e == null ? void 0 : e.message) || "Exchange failed while saving credentials.");
579
- setOnboardingInProgress(false);
580
- }
581
- };
582
- return () => {
583
- window.onboardingCallback = void 0;
584
- };
585
- }, [env]);
586
- useLayoutEffect(() => {
587
- const el = ppBtnMeasureRef.current;
588
- if (!el) return;
589
- const update = () => {
590
- const w = Math.round(el.getBoundingClientRect().width || 0);
591
- if (w > 0) setPpBtnWidth(w);
592
- };
593
- update();
594
- let ro = null;
595
- if (typeof ResizeObserver !== "undefined") {
596
- ro = new ResizeObserver(() => update());
597
- ro.observe(el);
598
- } else {
599
- window.addEventListener("resize", update);
600
- }
601
- return () => {
602
- if (ro) ro.disconnect();
603
- else window.removeEventListener("resize", update);
604
- };
605
- }, [connState, env, finalUrl]);
606
- const handleConnectClick = (e) => {
607
- if (connState !== "ready" || !finalUrl || onboardingInProgress) {
608
- e.preventDefault();
609
- }
610
- };
611
- const handleSaveManual = async () => {
612
- if (!canSaveManual || onboardingInProgress) return;
613
- setOnboardingInProgress(true);
614
- setConnState("loading");
615
- setError(null);
616
- try {
617
- const res = await fetch(SAVE_CREDENTIALS_ENDPOINT, {
618
- method: "POST",
619
- headers: { "content-type": "application/json" },
620
- body: JSON.stringify({
621
- clientId: clientId.trim(),
622
- clientSecret: secret.trim()
623
- })
624
- });
625
- if (!res.ok) {
626
- const txt = await res.text().catch(() => "");
627
- throw new Error(txt || `Save credentials failed (${res.status})`);
471
+ if (!r.ok) {
472
+ const t = await r.text();
473
+ setToast({ type: "error", message: "Failed to save settings. " + t });
474
+ window.setTimeout(() => setToast(null), 3500);
475
+ return;
628
476
  }
629
- setConnState("connected");
630
- setStatusInfo({
631
- seller_client_id_masked: maskValue(clientId.trim()),
632
- seller_client_secret_masked: "••••••••"
633
- });
634
- setShowManual(false);
635
- try {
636
- localStorage.removeItem(CACHE_KEY);
637
- localStorage.removeItem(RELOAD_KEY);
638
- } catch {
477
+ const json = await r.json().catch(() => null);
478
+ const payload = (json == null ? void 0 : json.data) ?? json;
479
+ const saved = payload == null ? void 0 : payload.advanced_card_payments;
480
+ if (saved && typeof saved === "object") {
481
+ setForm(mergeWithDefaults(saved));
639
482
  }
640
- } catch (e) {
641
- console.error(e);
642
- setConnState("error");
643
- setError((e == null ? void 0 : e.message) || "Failed to save credentials.");
483
+ setToast({ type: "success", message: "Settings saved" });
484
+ window.setTimeout(() => setToast(null), 2500);
644
485
  } finally {
645
- setOnboardingInProgress(false);
486
+ setSaving(false);
646
487
  }
647
- };
648
- const handleDisconnect = async () => {
649
- if (onboardingInProgress) return;
650
- if (!window.confirm("Disconnect PayPal for this environment?")) return;
651
- setOnboardingInProgress(true);
652
- setConnState("loading");
653
- setError(null);
654
- setFinalUrl("");
655
- setShowManual(false);
656
- try {
657
- const res = await fetch(DISCONNECT_ENDPOINT, {
658
- method: "POST",
659
- headers: { "content-type": "application/json" },
660
- body: JSON.stringify({ environment: env })
661
- });
662
- if (!res.ok) {
663
- const t = await res.text().catch(() => "");
664
- throw new Error(t || `Disconnect failed (${res.status})`);
665
- }
666
- try {
667
- localStorage.removeItem(CACHE_KEY);
668
- localStorage.removeItem(RELOAD_KEY);
669
- } catch {
488
+ }
489
+ const disabledSet = useMemo(() => new Set(form.disabledCards), [form.disabledCards]);
490
+ function toggleDisabledCard(value) {
491
+ setForm((prev) => {
492
+ const exists = prev.disabledCards.includes(value);
493
+ return {
494
+ ...prev,
495
+ disabledCards: exists ? prev.disabledCards.filter((v) => v !== value) : [...prev.disabledCards, value]
496
+ };
497
+ });
498
+ }
499
+ function removeDisabledCard(value) {
500
+ setForm((prev) => ({
501
+ ...prev,
502
+ disabledCards: prev.disabledCards.filter((v) => v !== value)
503
+ }));
504
+ }
505
+ return /* @__PURE__ */ jsx("div", { className: "p-6", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
506
+ /* @__PURE__ */ jsx("div", { className: "flex items-start justify-between gap-4", children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("h1", { className: "text-xl font-semibold text-ui-fg-base", children: "PayPal Gateway By Easy Payment" }) }) }),
507
+ /* @__PURE__ */ jsx(PayPalTabs, {}),
508
+ toast ? /* @__PURE__ */ jsx(
509
+ "div",
510
+ {
511
+ className: "fixed right-6 top-6 z-50 rounded-md border border-ui-border-base bg-ui-bg-base px-4 py-3 text-sm shadow-lg",
512
+ role: "status",
513
+ "aria-live": "polite",
514
+ children: /* @__PURE__ */ jsx("span", { className: toast.type === "success" ? "text-ui-fg-base" : "text-ui-fg-error", children: toast.message })
670
515
  }
671
- currentRunId.current = ++runIdRef.current;
672
- const runId = currentRunId.current;
673
- fetchFreshLink(runId);
674
- } catch (e) {
675
- console.error(e);
676
- setConnState("error");
677
- setError((e == null ? void 0 : e.message) || "Failed to disconnect.");
678
- } finally {
679
- setOnboardingInProgress(false);
680
- }
681
- };
682
- const handleEnvChange = async (e) => {
683
- const next = e.target.value;
684
- setEnv(next);
685
- cachedUrl = null;
686
- try {
687
- await fetch("/admin/paypal/environment", {
688
- method: "POST",
689
- headers: { "content-type": "application/json" },
690
- body: JSON.stringify({ environment: next })
691
- });
692
- } catch {
693
- }
694
- try {
695
- localStorage.removeItem(CACHE_KEY);
696
- localStorage.removeItem(RELOAD_KEY);
697
- } catch {
698
- }
699
- };
700
- return /* @__PURE__ */ jsxs("div", { className: "p-6", children: [
701
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
702
- /* @__PURE__ */ jsx("h1", { className: "text-xl font-semibold", children: "PayPal Gateway By Easy Payment" }),
703
- /* @__PURE__ */ jsx(PayPalTabs, {}),
704
- /* @__PURE__ */ jsx("div", { className: "rounded-md border border-ui-border-base p-4 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-y-6 md:grid-cols-[260px_1fr] md:items-start", children: [
705
- /* @__PURE__ */ jsx("div", { className: "text-sm font-medium pt-2", children: "Environment" }),
706
- /* @__PURE__ */ jsx("div", { className: "max-w-xl", children: /* @__PURE__ */ jsxs(
707
- "select",
708
- {
709
- value: env,
710
- onChange: handleEnvChange,
711
- disabled: onboardingInProgress,
712
- className: "w-full rounded-md border border-ui-border-base bg-transparent px-3 py-2 text-sm",
713
- children: [
714
- /* @__PURE__ */ jsx("option", { value: "sandbox", children: "Sandbox (Test Mode)" }),
715
- /* @__PURE__ */ jsx("option", { value: "live", children: "Live (Production)" })
716
- ]
717
- }
718
- ) }),
719
- /* @__PURE__ */ jsx("div", { className: "text-sm font-medium pt-2", children: env === "sandbox" ? "Connect to PayPal Sandbox" : "Connect to PayPal Live" }),
720
- /* @__PURE__ */ jsx("div", { className: "max-w-xl", children: connState === "connected" ? /* @__PURE__ */ jsxs("div", { children: [
721
- /* @__PURE__ */ jsxs("div", { className: "text-sm text-green-600 bg-green-50 p-3 rounded border border-green-200", children: [
722
- "✅ Successfully connected to PayPal!",
723
- /* @__PURE__ */ jsx(
724
- "a",
725
- {
726
- "data-paypal-button": "true",
727
- "data-paypal-onboard-complete": "onboardingCallback",
728
- href: "#",
729
- style: { display: "none" },
730
- children: "PayPal"
731
- }
732
- )
733
- ] }),
734
- /* @__PURE__ */ jsxs("div", { className: "mt-3 rounded-md border border-ui-border-base bg-ui-bg-subtle p-3 text-xs text-ui-fg-subtle", children: [
735
- /* @__PURE__ */ jsx("div", { className: "font-medium text-ui-fg-base", children: "Connected PayPal account" }),
736
- /* @__PURE__ */ jsxs("div", { className: "mt-1", children: [
737
- "Email:",
738
- " ",
739
- /* @__PURE__ */ jsx("span", { className: "font-mono text-ui-fg-base", children: (statusInfo == null ? void 0 : statusInfo.seller_email) || "Unavailable" })
740
- ] })
741
- ] }),
742
- /* @__PURE__ */ jsx("div", { className: "mt-3 flex items-center gap-2", children: /* @__PURE__ */ jsx(
516
+ ) : null,
517
+ /* @__PURE__ */ jsx(
518
+ SectionCard$1,
519
+ {
520
+ title: "Advanced Card Payments",
521
+ description: "Control card checkout settings, 3D Secure behavior, and card saving.",
522
+ right: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
523
+ /* @__PURE__ */ jsx(
743
524
  "button",
744
525
  {
745
526
  type: "button",
746
- onClick: handleDisconnect,
747
- disabled: onboardingInProgress,
748
- className: "rounded-md border border-ui-border-base px-3 py-2 text-sm font-medium hover:bg-ui-bg-subtle disabled:opacity-50 disabled:cursor-not-allowed",
749
- children: "Disconnect"
750
- }
751
- ) })
752
- ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
753
- /* @__PURE__ */ jsxs(
754
- "div",
755
- {
756
- ref: initLoaderRef,
757
- id: "init-loader",
758
- className: `status-msg mb-4 ${connState !== "loading" ? "hidden" : "block"}`,
759
- children: [
760
- /* @__PURE__ */ jsx("div", { className: "loader inline-block align-middle mr-2" }),
761
- /* @__PURE__ */ jsx("span", { id: "loader-text", className: "text-sm", children: onboardingInProgress ? "Configuring connection to PayPal…" : "Checking connection..." })
762
- ]
527
+ onClick: onSave,
528
+ disabled: saving || loading,
529
+ className: "rounded-md bg-ui-button-neutral px-4 py-2 text-sm font-medium text-ui-fg-on-color shadow-sm hover:opacity-90 disabled:opacity-60",
530
+ children: saving ? "Saving..." : "Save settings"
763
531
  }
764
532
  ),
765
- /* @__PURE__ */ jsxs("div", { className: `${connState === "ready" ? "block" : "hidden"}`, children: [
766
- /* @__PURE__ */ jsx(
767
- "a",
768
- {
769
- ref: (node) => {
770
- paypalButtonRef.current = node;
771
- ppBtnMeasureRef.current = node;
772
- },
773
- id: "paypal-button",
774
- "data-paypal-button": "true",
775
- href: finalUrl || "#",
776
- "data-paypal-onboard-complete": "onboardingCallback",
777
- onClick: handleConnectClick,
778
- className: "btn-paypal",
779
- style: {
780
- borderRadius: "50px",
781
- textDecoration: "none",
782
- display: "inline-block",
783
- fontWeight: "bold",
784
- border: "none",
785
- cursor: onboardingInProgress ? "not-allowed" : "pointer",
786
- opacity: onboardingInProgress ? 0.6 : 1,
787
- pointerEvents: onboardingInProgress ? "none" : "auto"
788
- },
789
- children: "Connect to PayPal"
790
- }
791
- ),
533
+ loading ? /* @__PURE__ */ jsx("span", { className: "text-sm text-ui-fg-subtle", children: "Loading…" }) : null
534
+ ] }),
535
+ children: /* @__PURE__ */ jsxs("div", { className: "divide-y divide-ui-border-base", children: [
536
+ /* @__PURE__ */ jsx(FieldRow$1, { label: "Enable/Disable", children: /* @__PURE__ */ jsxs("label", { className: "inline-flex items-center gap-2", children: [
792
537
  /* @__PURE__ */ jsx(
793
- "div",
538
+ "input",
794
539
  {
795
- className: "mt-2",
796
- style: {
797
- width: ppBtnWidth ? `${ppBtnWidth}px` : "auto",
798
- marginTop: "20px",
799
- marginBottom: "10px"
800
- },
801
- children: /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx("span", { className: "text-[11px] text-ui-fg-muted leading-none", children: "OR" }) })
540
+ type: "checkbox",
541
+ checked: form.enabled,
542
+ onChange: (e) => setForm((p) => ({ ...p, enabled: e.target.checked })),
543
+ className: "h-4 w-4 rounded border-ui-border-base"
802
544
  }
803
545
  ),
804
- /* @__PURE__ */ jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsx(
805
- "button",
806
- {
807
- type: "button",
808
- onClick: () => setShowManual(!showManual),
809
- disabled: onboardingInProgress,
810
- className: "text-sm text-ui-fg-interactive underline whitespace-nowrap disabled:opacity-50 disabled:cursor-not-allowed",
811
- children: "Click here to insert credentials manually"
812
- }
813
- ) })
814
- ] }),
815
- /* @__PURE__ */ jsx("div", { className: `${connState === "ready" ? "hidden" : "block"} mt-3`, children: /* @__PURE__ */ jsx(
816
- "button",
546
+ /* @__PURE__ */ jsx("span", { className: "text-sm text-ui-fg-base", children: "Enable Advanced Credit/Debit Card" })
547
+ ] }) }),
548
+ /* @__PURE__ */ jsx(FieldRow$1, { label: "Title", children: /* @__PURE__ */ jsx(
549
+ "input",
817
550
  {
818
- type: "button",
819
- onClick: () => setShowManual(!showManual),
820
- disabled: onboardingInProgress,
821
- className: "text-sm text-ui-fg-interactive underline whitespace-nowrap disabled:opacity-50 disabled:cursor-not-allowed",
822
- children: "Click here to insert credentials manually"
551
+ value: form.title,
552
+ onChange: (e) => setForm((p) => ({ ...p, title: e.target.value })),
553
+ className: "w-full rounded-md border border-ui-border-base bg-ui-bg-base px-3 py-2 text-sm text-ui-fg-base outline-none focus:ring-2 focus:ring-ui-border-interactive",
554
+ placeholder: "Credit or Debit Card"
823
555
  }
824
556
  ) }),
825
557
  /* @__PURE__ */ jsx(
826
- "div",
558
+ FieldRow$1,
827
559
  {
828
- ref: errorLogRef,
829
- id: "error-log",
830
- className: `mt-4 text-left text-xs bg-red-50 text-red-600 p-3 border border-red-200 rounded ${connState === "error" && error ? "block" : "hidden"}`,
831
- children: error
560
+ label: "Disable specific credit cards",
561
+ hint: "Select card brands to hide from the card form.",
562
+ children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
563
+ /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: form.disabledCards.length ? form.disabledCards.map((v) => {
564
+ var _a2;
565
+ const label = ((_a2 = CARD_BRANDS.find((b) => b.value === v)) == null ? void 0 : _a2.label) ?? v;
566
+ return /* @__PURE__ */ jsx(Pill$1, { onRemove: () => removeDisabledCard(v), children: label }, v);
567
+ }) : /* @__PURE__ */ jsx("span", { className: "text-sm text-ui-fg-subtle", children: "No card brands disabled." }) }),
568
+ /* @__PURE__ */ jsx("div", { className: "rounded-md border border-ui-border-base p-3", children: /* @__PURE__ */ jsx("div", { className: "grid gap-2 md:grid-cols-2", children: CARD_BRANDS.map((b) => {
569
+ const checked = disabledSet.has(b.value);
570
+ return /* @__PURE__ */ jsxs(
571
+ "label",
572
+ {
573
+ className: cx$1(
574
+ "flex items-center gap-2 rounded-md p-2",
575
+ "hover:bg-ui-bg-subtle"
576
+ ),
577
+ children: [
578
+ /* @__PURE__ */ jsx(
579
+ "input",
580
+ {
581
+ type: "checkbox",
582
+ checked,
583
+ onChange: () => toggleDisabledCard(b.value),
584
+ className: "h-4 w-4 rounded border-ui-border-base"
585
+ }
586
+ ),
587
+ /* @__PURE__ */ jsx("span", { className: "text-sm text-ui-fg-base", children: b.label })
588
+ ]
589
+ },
590
+ b.value
591
+ );
592
+ }) }) })
593
+ ] })
832
594
  }
833
- )
834
- ] }) }),
835
- showManual && /* @__PURE__ */ jsx("div", { className: "md:col-span-2", children: /* @__PURE__ */ jsxs("div", { className: "ml-[260px] max-w-xl mt-4 grid grid-cols-1 gap-3 md:grid-cols-2", children: [
836
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
837
- /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Client ID" }),
838
- /* @__PURE__ */ jsx(
839
- "input",
840
- {
841
- type: "text",
842
- value: clientId,
843
- onChange: (e) => setClientId(e.target.value),
844
- disabled: onboardingInProgress,
845
- className: "rounded-md border border-ui-border-base bg-transparent px-3 py-2 text-sm disabled:opacity-50",
846
- placeholder: env === "sandbox" ? "Sandbox Client ID" : "Live Client ID"
847
- }
848
- )
849
- ] }),
850
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
851
- /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Client Secret" }),
852
- /* @__PURE__ */ jsx(
853
- "input",
854
- {
855
- type: "password",
856
- value: secret,
857
- onChange: (e) => setSecret(e.target.value),
858
- disabled: onboardingInProgress,
859
- className: "rounded-md border border-ui-border-base bg-transparent px-3 py-2 text-sm disabled:opacity-50",
860
- placeholder: env === "sandbox" ? "Sandbox Secret" : "Live Secret"
861
- }
862
- )
863
- ] }),
864
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 md:col-span-2", children: [
865
- /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Merchant ID (optional)" }),
595
+ ),
596
+ /* @__PURE__ */ jsx(
597
+ FieldRow$1,
598
+ {
599
+ label: "Contingency for 3D Secure",
600
+ hint: "Choose when 3D Secure should be triggered during card payments.",
601
+ children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
602
+ /* @__PURE__ */ jsx(
603
+ "select",
604
+ {
605
+ value: form.threeDS,
606
+ onChange: (e) => setForm((p) => ({ ...p, threeDS: e.target.value })),
607
+ className: "w-full rounded-md border border-ui-border-base bg-ui-bg-base px-3 py-2 text-sm text-ui-fg-base outline-none focus:ring-2 focus:ring-ui-border-interactive",
608
+ children: THREE_DS_OPTIONS.map((o) => /* @__PURE__ */ jsx("option", { value: o.value, children: o.label }, o.value))
609
+ }
610
+ ),
611
+ ((_a = THREE_DS_OPTIONS.find((o) => o.value === form.threeDS)) == null ? void 0 : _a.hint) ? /* @__PURE__ */ jsx("div", { className: "text-xs text-ui-fg-subtle", children: (_b = THREE_DS_OPTIONS.find((o) => o.value === form.threeDS)) == null ? void 0 : _b.hint }) : null
612
+ ] })
613
+ }
614
+ ),
615
+ /* @__PURE__ */ jsx(FieldRow$1, { label: "Card Save Enabled", hint: "Allow customers to save a card at checkout for future use.", children: /* @__PURE__ */ jsxs("label", { className: "inline-flex items-center gap-2", children: [
866
616
  /* @__PURE__ */ jsx(
867
617
  "input",
868
618
  {
869
- type: "text",
870
- value: merchantId,
871
- onChange: (e) => setMerchantId(e.target.value),
872
- disabled: onboardingInProgress,
873
- className: "rounded-md border border-ui-border-base bg-transparent px-3 py-2 text-sm disabled:opacity-50",
874
- placeholder: "Merchant ID"
875
- }
876
- )
877
- ] }),
878
- /* @__PURE__ */ jsxs("div", { className: "md:col-span-2 flex items-center gap-2 mt-2", children: [
879
- /* @__PURE__ */ jsx(
880
- "button",
881
- {
882
- type: "button",
883
- className: "rounded-md border border-ui-border-base px-3 py-2 text-sm font-medium hover:bg-ui-bg-subtle disabled:opacity-50 disabled:cursor-not-allowed",
884
- onClick: () => setShowManual(false),
885
- disabled: onboardingInProgress,
886
- children: "Cancel"
619
+ type: "checkbox",
620
+ checked: form.cardSaveEnabled,
621
+ onChange: (e) => setForm((p) => ({ ...p, cardSaveEnabled: e.target.checked })),
622
+ className: "h-4 w-4 rounded border-ui-border-base"
887
623
  }
888
624
  ),
889
- /* @__PURE__ */ jsx(
890
- "button",
891
- {
892
- type: "button",
893
- className: "rounded-md border border-ui-border-base px-3 py-2 text-sm font-medium bg-ui-bg-base hover:bg-ui-bg-subtle disabled:opacity-50 disabled:cursor-not-allowed",
894
- disabled: !canSaveManual || onboardingInProgress,
895
- onClick: handleSaveManual,
896
- children: "Save credentials"
897
- }
898
- )
899
- ] })
900
- ] }) })
901
- ] }) })
902
- ] }),
903
- /* @__PURE__ */ jsx("style", { children: `
904
- .loader {
905
- border: 3px solid #f3f3f3;
906
- border-top: 3px solid #0070ba;
907
- border-radius: 50%;
908
- width: 18px;
909
- height: 18px;
910
- animation: spin 1s linear infinite;
911
- display: inline-block;
912
- vertical-align: middle;
913
- margin-right: 8px;
914
- }
915
- @keyframes spin {
916
- 0% { transform: rotate(0deg); }
917
- 100% { transform: rotate(360deg); }
918
- }
919
- ` })
920
- ] });
625
+ /* @__PURE__ */ jsx("span", { className: "text-sm text-ui-fg-base", children: "Enable card saving at checkout" })
626
+ ] }) })
627
+ ] })
628
+ }
629
+ )
630
+ ] }) });
921
631
  }
922
- const DEFAULT_FORM = {
923
- enabled: true,
924
- title: "Credit or Debit Card",
925
- disabledCards: [],
926
- threeDS: "when_required",
927
- cardSaveEnabled: false
928
- };
929
- function mergeWithDefaults(saved) {
930
- if (!saved) return { ...DEFAULT_FORM };
931
- const entries = Object.entries(saved).filter(([, value]) => value !== void 0);
932
- return {
933
- ...DEFAULT_FORM,
934
- ...Object.fromEntries(entries)
935
- };
632
+ function PayPalApplePayPage() {
633
+ return /* @__PURE__ */ jsx(Navigate, { to: "/settings/paypal/connection", replace: true });
936
634
  }
937
- const CARD_BRANDS = [
938
- { value: "visa", label: "Visa" },
939
- { value: "mastercard", label: "Mastercard" },
940
- { value: "amex", label: "American Express" },
941
- { value: "discover", label: "Discover" },
942
- { value: "diners", label: "Diners Club" },
943
- { value: "jcb", label: "JCB" },
944
- { value: "unionpay", label: "UnionPay" }
945
- ];
946
- const THREE_DS_OPTIONS = [
947
- {
948
- value: "when_required",
949
- label: "3D Secure when required",
950
- hint: "Triggers 3DS only when the card / issuer requires it."
951
- },
952
- {
953
- value: "sli",
954
- label: "3D Secure (SCA) / liability shift (recommended)",
955
- hint: "Attempts to optimize for liability shift while remaining compliant."
956
- },
957
- {
958
- value: "always",
959
- label: "Always request 3D Secure",
960
- hint: "Forces 3DS challenge whenever possible (may reduce conversion)."
635
+ function formatDate$2(value) {
636
+ if (!value) {
637
+ return "";
961
638
  }
962
- ];
963
- function cx$1(...parts) {
964
- return parts.filter(Boolean).join(" ");
639
+ const parsed = new Date(value);
640
+ if (Number.isNaN(parsed.getTime())) {
641
+ return value;
642
+ }
643
+ return parsed.toLocaleString();
965
644
  }
966
- function Pill$1({
967
- children,
968
- onRemove
969
- }) {
970
- return /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 rounded-md border border-ui-border-base bg-ui-bg-base px-2 py-1 text-sm text-ui-fg-base", children: [
971
- children,
972
- onRemove ? /* @__PURE__ */ jsx(
973
- "button",
974
- {
975
- type: "button",
976
- onClick: onRemove,
977
- className: "ml-1 rounded px-1 text-ui-fg-subtle hover:text-ui-fg-base",
978
- "aria-label": "Remove",
979
- children: "×"
645
+ function PayPalAuditLogsPage() {
646
+ const [logs, setLogs] = useState([]);
647
+ const [loading, setLoading] = useState(false);
648
+ const [error, setError] = useState(null);
649
+ const fetchLogs = useCallback(async () => {
650
+ try {
651
+ setLoading(true);
652
+ setError(null);
653
+ const response = await fetch("/admin/paypal/audit-logs?limit=50", {
654
+ credentials: "include",
655
+ headers: {
656
+ Accept: "application/json"
657
+ }
658
+ });
659
+ if (!response.ok) {
660
+ const message = await response.text().catch(() => "");
661
+ throw new Error(message || "Failed to load audit logs.");
980
662
  }
981
- ) : null
982
- ] });
983
- }
984
- function SectionCard$1({
985
- title,
986
- description,
987
- right,
988
- children
989
- }) {
990
- return /* @__PURE__ */ jsxs("div", { className: "rounded-xl border border-ui-border-base bg-ui-bg-base shadow-sm", children: [
991
- /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4 border-b border-ui-border-base p-4", children: [
992
- /* @__PURE__ */ jsxs("div", { children: [
993
- /* @__PURE__ */ jsx("div", { className: "text-base font-semibold text-ui-fg-base", children: title }),
994
- description ? /* @__PURE__ */ jsx("div", { className: "mt-1 text-sm text-ui-fg-subtle", children: description }) : null
995
- ] }),
996
- right
663
+ const data = await response.json().catch(() => ({}));
664
+ setLogs((data == null ? void 0 : data.logs) || []);
665
+ } catch (fetchError) {
666
+ setError((fetchError == null ? void 0 : fetchError.message) || "Failed to load audit logs.");
667
+ setLogs([]);
668
+ } finally {
669
+ setLoading(false);
670
+ }
671
+ }, []);
672
+ useEffect(() => {
673
+ fetchLogs();
674
+ }, [fetchLogs]);
675
+ return /* @__PURE__ */ jsx("div", { className: "p-6", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
676
+ /* @__PURE__ */ jsxs("div", { children: [
677
+ /* @__PURE__ */ jsx("h1", { className: "text-xl font-semibold text-ui-fg-base", children: "PayPal Audit Logs" }),
678
+ /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-ui-fg-subtle", children: "Track administrative changes and credential events for PayPal configuration." })
997
679
  ] }),
998
- /* @__PURE__ */ jsx("div", { className: "p-4", children })
999
- ] });
680
+ /* @__PURE__ */ jsx(PayPalTabs, {}),
681
+ /* @__PURE__ */ jsxs("div", { className: "rounded-xl border border-ui-border-base bg-ui-bg-base shadow-sm", children: [
682
+ /* @__PURE__ */ jsx("div", { className: "border-b border-ui-border-base p-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
683
+ /* @__PURE__ */ jsx("div", { className: "text-base font-semibold text-ui-fg-base", children: "Latest events" }),
684
+ /* @__PURE__ */ jsx(
685
+ "button",
686
+ {
687
+ type: "button",
688
+ onClick: fetchLogs,
689
+ className: "rounded-md border border-ui-border-base px-3 py-2 text-sm text-ui-fg-base",
690
+ disabled: loading,
691
+ children: loading ? "Refreshing..." : "Refresh"
692
+ }
693
+ )
694
+ ] }) }),
695
+ /* @__PURE__ */ jsxs("div", { className: "p-4", children: [
696
+ error ? /* @__PURE__ */ jsx("div", { className: "rounded-md border border-red-200 bg-red-50 p-3 text-sm text-red-600", children: error }) : null,
697
+ !error && logs.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-sm text-ui-fg-subtle", children: loading ? "Loading audit logs..." : "No audit log entries found yet." }) : null,
698
+ logs.length > 0 ? /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full text-left text-sm", children: [
699
+ /* @__PURE__ */ jsx("thead", { className: "text-ui-fg-muted", children: /* @__PURE__ */ jsxs("tr", { children: [
700
+ /* @__PURE__ */ jsx("th", { className: "pb-2 pr-4 font-medium", children: "Timestamp" }),
701
+ /* @__PURE__ */ jsx("th", { className: "pb-2 pr-4 font-medium", children: "Event" }),
702
+ /* @__PURE__ */ jsx("th", { className: "pb-2 font-medium", children: "Details" })
703
+ ] }) }),
704
+ /* @__PURE__ */ jsx("tbody", { children: logs.map((entry) => /* @__PURE__ */ jsxs("tr", { className: "border-t border-ui-border-base", children: [
705
+ /* @__PURE__ */ jsx("td", { className: "py-3 pr-4 text-ui-fg-base", children: formatDate$2(entry.created_at) || "—" }),
706
+ /* @__PURE__ */ jsx("td", { className: "py-3 pr-4 text-ui-fg-base", children: entry.event_type || "—" }),
707
+ /* @__PURE__ */ jsx("td", { className: "py-3 text-ui-fg-subtle", children: /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap rounded-md bg-ui-bg-subtle p-2 text-xs text-ui-fg-subtle", children: JSON.stringify(entry.metadata || {}, null, 2) }) })
708
+ ] }, entry.id)) })
709
+ ] }) }) : null
710
+ ] })
711
+ ] })
712
+ ] }) });
1000
713
  }
1001
- function FieldRow$1({
1002
- label,
1003
- hint,
1004
- children
1005
- }) {
1006
- return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-12 items-start gap-4 py-3", children: [
1007
- /* @__PURE__ */ jsxs("div", { className: "col-span-12 md:col-span-4", children: [
1008
- /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-ui-fg-base", children: label }),
1009
- hint ? /* @__PURE__ */ jsx("div", { className: "mt-1 text-xs text-ui-fg-subtle", children: hint }) : null
1010
- ] }),
1011
- /* @__PURE__ */ jsx("div", { className: "col-span-12 md:col-span-8", children })
1012
- ] });
714
+ const config = defineRouteConfig({
715
+ label: "PayPal Connection",
716
+ hide: true
717
+ });
718
+ if (typeof window !== "undefined") {
719
+ const preloadHref = "https://www.paypal.com/webapps/merchantboarding/js/lib/lightbox/partner.js";
720
+ const existingPreload = document.head.querySelector(
721
+ `link[rel="preload"][href="${preloadHref}"]`
722
+ );
723
+ if (!existingPreload) {
724
+ const preloadLink = document.createElement("link");
725
+ preloadLink.rel = "preload";
726
+ preloadLink.href = preloadHref;
727
+ preloadLink.as = "script";
728
+ document.head.appendChild(preloadLink);
729
+ }
730
+ const existingScript = document.getElementById(
731
+ "paypal-partner-js"
732
+ );
733
+ if (!existingScript) {
734
+ const ppScript = document.createElement("script");
735
+ ppScript.id = "paypal-partner-js";
736
+ ppScript.src = preloadHref;
737
+ ppScript.async = true;
738
+ document.head.appendChild(ppScript);
739
+ }
1013
740
  }
1014
- function AdvancedCardPaymentsTab() {
1015
- var _a, _b;
1016
- const [form, setForm] = useState(() => ({ ...DEFAULT_FORM }));
1017
- const [loading, setLoading] = useState(false);
1018
- const [saving, setSaving] = useState(false);
1019
- const [toast, setToast] = useState(null);
1020
- const didInit = useRef(false);
741
+ const SERVICE_URL = "/admin/paypal/onboarding-link";
742
+ const CACHE_KEY = "pp_onboard_cache";
743
+ const RELOAD_KEY = "pp_onboard_reloaded_once";
744
+ const CACHE_EXPIRY = 10 * 60 * 1e3;
745
+ const ONBOARDING_COMPLETE_ENDPOINT = "/admin/paypal/onboard-complete";
746
+ const STATUS_ENDPOINT = "/admin/paypal/status";
747
+ const SAVE_CREDENTIALS_ENDPOINT = "/admin/paypal/save-credentials";
748
+ const DISCONNECT_ENDPOINT = "/admin/paypal/disconnect";
749
+ let cachedUrl = null;
750
+ if (typeof window !== "undefined") {
751
+ try {
752
+ const cached = localStorage.getItem(CACHE_KEY);
753
+ if (cached) {
754
+ const data = JSON.parse(cached);
755
+ if ((/* @__PURE__ */ new Date()).getTime() - data.ts < CACHE_EXPIRY) {
756
+ cachedUrl = data.url;
757
+ }
758
+ }
759
+ } catch (e) {
760
+ console.error("Cache read error:", e);
761
+ }
762
+ }
763
+ function PayPalConnectionPage() {
764
+ const [env, setEnv] = useState("sandbox");
1021
765
  useEffect(() => {
1022
- if (didInit.current) return;
1023
- didInit.current = true;
1024
- (async () => {
766
+ fetch("/admin/paypal/environment", { method: "GET" }).then((r) => r.json()).then((d) => {
767
+ const v = (d == null ? void 0 : d.environment) === "live" ? "live" : "sandbox";
768
+ setEnv(v);
769
+ }).catch(() => {
770
+ });
771
+ }, []);
772
+ const [connState, setConnState] = useState("loading");
773
+ const [error, setError] = useState(null);
774
+ const [finalUrl, setFinalUrl] = useState("");
775
+ const [showManual, setShowManual] = useState(false);
776
+ const [clientId, setClientId] = useState("");
777
+ const [secret, setSecret] = useState("");
778
+ const [merchantId, setMerchantId] = useState("");
779
+ const [statusInfo, setStatusInfo] = useState(null);
780
+ const [onboardingInProgress, setOnboardingInProgress] = useState(false);
781
+ const initLoaderRef = useRef(null);
782
+ const paypalButtonRef = useRef(null);
783
+ const errorLogRef = useRef(null);
784
+ const runIdRef = useRef(0);
785
+ const currentRunId = useRef(0);
786
+ const ppBtnMeasureRef = useRef(null);
787
+ const [ppBtnWidth, setPpBtnWidth] = useState(null);
788
+ const canSaveManual = useMemo(() => {
789
+ return clientId.trim().length > 0 && secret.trim().length > 0;
790
+ }, [clientId, secret]);
791
+ const maskValue = useCallback((value, visibleChars = 4) => {
792
+ if (!value) return "";
793
+ if (value.length <= visibleChars) {
794
+ return "•".repeat(value.length);
795
+ }
796
+ return `${"•".repeat(Math.max(0, value.length - visibleChars))}${value.slice(
797
+ -visibleChars
798
+ )}`;
799
+ }, []);
800
+ const fetchFreshLink = useCallback(
801
+ (runId) => {
802
+ if (initLoaderRef.current) {
803
+ const loaderText = initLoaderRef.current.querySelector("#loader-text");
804
+ if (loaderText)
805
+ loaderText.textContent = "Generating onboarding session...";
806
+ }
807
+ fetch(SERVICE_URL, {
808
+ method: "POST",
809
+ headers: { "content-type": "application/json" },
810
+ body: JSON.stringify({
811
+ products: ["PPCP"]
812
+ })
813
+ }).then((r) => r.json()).then((data) => {
814
+ if (runId !== currentRunId.current) return;
815
+ const href = data == null ? void 0 : data.onboarding_url;
816
+ if (!href) {
817
+ showError("Onboarding URL not returned.");
818
+ return;
819
+ }
820
+ const finalUrl2 = href + (href.includes("?") ? "&" : "?") + "displayMode=minibrowser";
821
+ localStorage.setItem(
822
+ CACHE_KEY,
823
+ JSON.stringify({
824
+ url: finalUrl2,
825
+ ts: Date.now()
826
+ })
827
+ );
828
+ if (!localStorage.getItem(RELOAD_KEY)) {
829
+ localStorage.setItem(RELOAD_KEY, "1");
830
+ window.location.reload();
831
+ return;
832
+ }
833
+ activatePayPal(finalUrl2, runId);
834
+ }).catch(() => {
835
+ if (runId !== currentRunId.current) return;
836
+ showError("Unable to connect to service.");
837
+ });
838
+ },
839
+ [env]
840
+ );
841
+ const showUI = useCallback(() => {
842
+ var _a, _b, _c, _d;
843
+ const btn = document.querySelector('[data-paypal-button="true"]');
844
+ if (btn && ((_d = (_c = (_b = (_a = window.PAYPAL) == null ? void 0 : _a.apps) == null ? void 0 : _b.Signup) == null ? void 0 : _c.miniBrowser) == null ? void 0 : _d.init)) {
845
+ window.PAYPAL.apps.Signup.miniBrowser.init();
846
+ }
847
+ setConnState("ready");
848
+ }, []);
849
+ const showError = useCallback((msg) => {
850
+ setConnState("error");
851
+ setError(msg);
852
+ }, []);
853
+ const activatePayPal = useCallback(
854
+ (url, runId) => {
855
+ if (paypalButtonRef.current) {
856
+ paypalButtonRef.current.href = url;
857
+ }
858
+ setFinalUrl(url);
859
+ const tryInit = () => {
860
+ var _a, _b;
861
+ if (runId !== currentRunId.current) return;
862
+ if ((_b = (_a = window.PAYPAL) == null ? void 0 : _a.apps) == null ? void 0 : _b.Signup) {
863
+ showUI();
864
+ return;
865
+ }
866
+ setTimeout(tryInit, 50);
867
+ };
868
+ tryInit();
869
+ },
870
+ [showUI]
871
+ );
872
+ useEffect(() => {
873
+ currentRunId.current = ++runIdRef.current;
874
+ const runId = currentRunId.current;
875
+ let cancelled = false;
876
+ const run = async () => {
877
+ setConnState("loading");
878
+ setError(null);
879
+ setFinalUrl("");
880
+ try {
881
+ const r = await fetch(`${STATUS_ENDPOINT}?environment=${env}`, {
882
+ method: "GET"
883
+ });
884
+ const st = await r.json().catch(() => ({}));
885
+ if (cancelled || runId !== currentRunId.current) return;
886
+ setStatusInfo(st);
887
+ const isConnected = (st == null ? void 0 : st.status) === "connected" && (st == null ? void 0 : st.seller_client_id_present) === true;
888
+ if (isConnected) {
889
+ setConnState("connected");
890
+ setShowManual(false);
891
+ return;
892
+ }
893
+ } catch (e) {
894
+ console.error(e);
895
+ }
896
+ if (cachedUrl) {
897
+ console.log("Using prioritized cache...");
898
+ activatePayPal(cachedUrl, runId);
899
+ } else {
900
+ fetchFreshLink(runId);
901
+ }
902
+ };
903
+ run();
904
+ return () => {
905
+ cancelled = true;
906
+ currentRunId.current = 0;
907
+ };
908
+ }, [env, fetchFreshLink, activatePayPal]);
909
+ useLayoutEffect(() => {
910
+ window.onboardingCallback = async function(authCode, sharedId) {
911
+ var _a, _b, _c, _d, _e, _f, _g;
912
+ try {
913
+ ;
914
+ window.onbeforeunload = "";
915
+ } catch {
916
+ }
917
+ setOnboardingInProgress(true);
918
+ setConnState("loading");
919
+ setError(null);
920
+ const payload = {
921
+ authCode,
922
+ sharedId,
923
+ env: env === "sandbox" ? "sandbox" : "live"
924
+ };
925
+ try {
926
+ const res = await fetch(ONBOARDING_COMPLETE_ENDPOINT, {
927
+ method: "POST",
928
+ headers: { "content-type": "application/json" },
929
+ body: JSON.stringify(payload)
930
+ });
931
+ if (!res.ok) {
932
+ const txt = await res.text().catch(() => "");
933
+ throw new Error(txt || `Onboarding exchange failed (${res.status})`);
934
+ }
935
+ try {
936
+ const close1 = (_d = (_c = (_b = (_a = window.PAYPAL) == null ? void 0 : _a.apps) == null ? void 0 : _b.Signup) == null ? void 0 : _c.MiniBrowser) == null ? void 0 : _d.closeFlow;
937
+ if (typeof close1 === "function") close1();
938
+ } catch {
939
+ }
940
+ try {
941
+ const close2 = ((_g = (_f = (_e = window.PAYPAL) == null ? void 0 : _e.apps) == null ? void 0 : _f.Signup) == null ? void 0 : _g.miniBrowser) && window.PAYPAL.apps.Signup.miniBrowser.closeFlow;
942
+ if (typeof close2 === "function") close2();
943
+ } catch {
944
+ }
945
+ try {
946
+ localStorage.removeItem(CACHE_KEY);
947
+ localStorage.removeItem(RELOAD_KEY);
948
+ } catch {
949
+ }
950
+ window.location.href = window.location.href;
951
+ } catch (e) {
952
+ console.error(e);
953
+ setConnState("error");
954
+ setError((e == null ? void 0 : e.message) || "Exchange failed while saving credentials.");
955
+ setOnboardingInProgress(false);
956
+ }
957
+ };
958
+ return () => {
959
+ window.onboardingCallback = void 0;
960
+ };
961
+ }, [env]);
962
+ useLayoutEffect(() => {
963
+ const el = ppBtnMeasureRef.current;
964
+ if (!el) return;
965
+ const update = () => {
966
+ const w = Math.round(el.getBoundingClientRect().width || 0);
967
+ if (w > 0) setPpBtnWidth(w);
968
+ };
969
+ update();
970
+ let ro = null;
971
+ if (typeof ResizeObserver !== "undefined") {
972
+ ro = new ResizeObserver(() => update());
973
+ ro.observe(el);
974
+ } else {
975
+ window.addEventListener("resize", update);
976
+ }
977
+ return () => {
978
+ if (ro) ro.disconnect();
979
+ else window.removeEventListener("resize", update);
980
+ };
981
+ }, [connState, env, finalUrl]);
982
+ const handleConnectClick = (e) => {
983
+ if (connState !== "ready" || !finalUrl || onboardingInProgress) {
984
+ e.preventDefault();
985
+ }
986
+ };
987
+ const handleSaveManual = async () => {
988
+ if (!canSaveManual || onboardingInProgress) return;
989
+ setOnboardingInProgress(true);
990
+ setConnState("loading");
991
+ setError(null);
992
+ try {
993
+ const res = await fetch(SAVE_CREDENTIALS_ENDPOINT, {
994
+ method: "POST",
995
+ headers: { "content-type": "application/json" },
996
+ body: JSON.stringify({
997
+ clientId: clientId.trim(),
998
+ clientSecret: secret.trim()
999
+ })
1000
+ });
1001
+ if (!res.ok) {
1002
+ const txt = await res.text().catch(() => "");
1003
+ throw new Error(txt || `Save credentials failed (${res.status})`);
1004
+ }
1005
+ setConnState("connected");
1006
+ setStatusInfo({
1007
+ seller_client_id_masked: maskValue(clientId.trim()),
1008
+ seller_client_secret_masked: "••••••••"
1009
+ });
1010
+ setShowManual(false);
1025
1011
  try {
1026
- setLoading(true);
1027
- const r = await fetch("/admin/paypal/settings", {
1028
- credentials: "include",
1029
- headers: { "Accept": "application/json" }
1030
- });
1031
- if (!r.ok) return;
1032
- const json = await r.json();
1033
- const payload = (json == null ? void 0 : json.data) ?? json;
1034
- const saved = payload == null ? void 0 : payload.advanced_card_payments;
1035
- if (saved && typeof saved === "object") {
1036
- setForm(mergeWithDefaults(saved));
1037
- }
1038
- } finally {
1039
- setLoading(false);
1012
+ localStorage.removeItem(CACHE_KEY);
1013
+ localStorage.removeItem(RELOAD_KEY);
1014
+ } catch {
1040
1015
  }
1041
- })();
1042
- }, []);
1043
- async function onSave() {
1016
+ } catch (e) {
1017
+ console.error(e);
1018
+ setConnState("error");
1019
+ setError((e == null ? void 0 : e.message) || "Failed to save credentials.");
1020
+ } finally {
1021
+ setOnboardingInProgress(false);
1022
+ }
1023
+ };
1024
+ const handleDisconnect = async () => {
1025
+ if (onboardingInProgress) return;
1026
+ if (!window.confirm("Disconnect PayPal for this environment?")) return;
1027
+ setOnboardingInProgress(true);
1028
+ setConnState("loading");
1029
+ setError(null);
1030
+ setFinalUrl("");
1031
+ setShowManual(false);
1044
1032
  try {
1045
- setSaving(true);
1046
- const r = await fetch("/admin/paypal/settings", {
1033
+ const res = await fetch(DISCONNECT_ENDPOINT, {
1047
1034
  method: "POST",
1048
- credentials: "include",
1049
- headers: {
1050
- "Content-Type": "application/json",
1051
- "Accept": "application/json"
1052
- },
1053
- body: JSON.stringify({ advanced_card_payments: form })
1035
+ headers: { "content-type": "application/json" },
1036
+ body: JSON.stringify({ environment: env })
1054
1037
  });
1055
- if (!r.ok) {
1056
- const t = await r.text();
1057
- setToast({ type: "error", message: "Failed to save settings. " + t });
1058
- window.setTimeout(() => setToast(null), 3500);
1059
- return;
1038
+ if (!res.ok) {
1039
+ const t = await res.text().catch(() => "");
1040
+ throw new Error(t || `Disconnect failed (${res.status})`);
1060
1041
  }
1061
- const json = await r.json().catch(() => null);
1062
- const payload = (json == null ? void 0 : json.data) ?? json;
1063
- const saved = payload == null ? void 0 : payload.advanced_card_payments;
1064
- if (saved && typeof saved === "object") {
1065
- setForm(mergeWithDefaults(saved));
1042
+ try {
1043
+ localStorage.removeItem(CACHE_KEY);
1044
+ localStorage.removeItem(RELOAD_KEY);
1045
+ } catch {
1066
1046
  }
1067
- setToast({ type: "success", message: "Settings saved" });
1068
- window.setTimeout(() => setToast(null), 2500);
1047
+ currentRunId.current = ++runIdRef.current;
1048
+ const runId = currentRunId.current;
1049
+ fetchFreshLink(runId);
1050
+ } catch (e) {
1051
+ console.error(e);
1052
+ setConnState("error");
1053
+ setError((e == null ? void 0 : e.message) || "Failed to disconnect.");
1069
1054
  } finally {
1070
- setSaving(false);
1055
+ setOnboardingInProgress(false);
1071
1056
  }
1072
- }
1073
- const disabledSet = useMemo(() => new Set(form.disabledCards), [form.disabledCards]);
1074
- function toggleDisabledCard(value) {
1075
- setForm((prev) => {
1076
- const exists = prev.disabledCards.includes(value);
1077
- return {
1078
- ...prev,
1079
- disabledCards: exists ? prev.disabledCards.filter((v) => v !== value) : [...prev.disabledCards, value]
1080
- };
1081
- });
1082
- }
1083
- function removeDisabledCard(value) {
1084
- setForm((prev) => ({
1085
- ...prev,
1086
- disabledCards: prev.disabledCards.filter((v) => v !== value)
1087
- }));
1088
- }
1089
- return /* @__PURE__ */ jsx("div", { className: "p-6", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
1090
- /* @__PURE__ */ jsx("div", { className: "flex items-start justify-between gap-4", children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("h1", { className: "text-xl font-semibold text-ui-fg-base", children: "PayPal Gateway By Easy Payment" }) }) }),
1091
- /* @__PURE__ */ jsx(PayPalTabs, {}),
1092
- toast ? /* @__PURE__ */ jsx(
1093
- "div",
1094
- {
1095
- className: "fixed right-6 top-6 z-50 rounded-md border border-ui-border-base bg-ui-bg-base px-4 py-3 text-sm shadow-lg",
1096
- role: "status",
1097
- "aria-live": "polite",
1098
- children: /* @__PURE__ */ jsx("span", { className: toast.type === "success" ? "text-ui-fg-base" : "text-ui-fg-error", children: toast.message })
1099
- }
1100
- ) : null,
1101
- /* @__PURE__ */ jsx(
1102
- SectionCard$1,
1103
- {
1104
- title: "Advanced Card Payments",
1105
- description: "Control card checkout settings, 3D Secure behavior, and card saving.",
1106
- right: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
1107
- /* @__PURE__ */ jsx(
1057
+ };
1058
+ const handleEnvChange = async (e) => {
1059
+ const next = e.target.value;
1060
+ setEnv(next);
1061
+ cachedUrl = null;
1062
+ try {
1063
+ await fetch("/admin/paypal/environment", {
1064
+ method: "POST",
1065
+ headers: { "content-type": "application/json" },
1066
+ body: JSON.stringify({ environment: next })
1067
+ });
1068
+ } catch {
1069
+ }
1070
+ try {
1071
+ localStorage.removeItem(CACHE_KEY);
1072
+ localStorage.removeItem(RELOAD_KEY);
1073
+ } catch {
1074
+ }
1075
+ };
1076
+ return /* @__PURE__ */ jsxs("div", { className: "p-6", children: [
1077
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
1078
+ /* @__PURE__ */ jsx("h1", { className: "text-xl font-semibold", children: "PayPal Gateway By Easy Payment" }),
1079
+ /* @__PURE__ */ jsx(PayPalTabs, {}),
1080
+ /* @__PURE__ */ jsx("div", { className: "rounded-md border border-ui-border-base p-4 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-y-6 md:grid-cols-[260px_1fr] md:items-start", children: [
1081
+ /* @__PURE__ */ jsx("div", { className: "text-sm font-medium pt-2", children: "Environment" }),
1082
+ /* @__PURE__ */ jsx("div", { className: "max-w-xl", children: /* @__PURE__ */ jsxs(
1083
+ "select",
1084
+ {
1085
+ value: env,
1086
+ onChange: handleEnvChange,
1087
+ disabled: onboardingInProgress,
1088
+ className: "w-full rounded-md border border-ui-border-base bg-transparent px-3 py-2 text-sm",
1089
+ children: [
1090
+ /* @__PURE__ */ jsx("option", { value: "sandbox", children: "Sandbox (Test Mode)" }),
1091
+ /* @__PURE__ */ jsx("option", { value: "live", children: "Live (Production)" })
1092
+ ]
1093
+ }
1094
+ ) }),
1095
+ /* @__PURE__ */ jsx("div", { className: "text-sm font-medium pt-2", children: env === "sandbox" ? "Connect to PayPal Sandbox" : "Connect to PayPal Live" }),
1096
+ /* @__PURE__ */ jsx("div", { className: "max-w-xl", children: connState === "connected" ? /* @__PURE__ */ jsxs("div", { children: [
1097
+ /* @__PURE__ */ jsxs("div", { className: "text-sm text-green-600 bg-green-50 p-3 rounded border border-green-200", children: [
1098
+ "✅ Successfully connected to PayPal!",
1099
+ /* @__PURE__ */ jsx(
1100
+ "a",
1101
+ {
1102
+ "data-paypal-button": "true",
1103
+ "data-paypal-onboard-complete": "onboardingCallback",
1104
+ href: "#",
1105
+ style: { display: "none" },
1106
+ children: "PayPal"
1107
+ }
1108
+ )
1109
+ ] }),
1110
+ /* @__PURE__ */ jsxs("div", { className: "mt-3 rounded-md border border-ui-border-base bg-ui-bg-subtle p-3 text-xs text-ui-fg-subtle", children: [
1111
+ /* @__PURE__ */ jsx("div", { className: "font-medium text-ui-fg-base", children: "Connected PayPal account" }),
1112
+ /* @__PURE__ */ jsxs("div", { className: "mt-1", children: [
1113
+ "Email:",
1114
+ " ",
1115
+ /* @__PURE__ */ jsx("span", { className: "font-mono text-ui-fg-base", children: (statusInfo == null ? void 0 : statusInfo.seller_email) || "Unavailable" })
1116
+ ] })
1117
+ ] }),
1118
+ /* @__PURE__ */ jsx("div", { className: "mt-3 flex items-center gap-2", children: /* @__PURE__ */ jsx(
1108
1119
  "button",
1109
1120
  {
1110
1121
  type: "button",
1111
- onClick: onSave,
1112
- disabled: saving || loading,
1113
- className: "rounded-md bg-ui-button-neutral px-4 py-2 text-sm font-medium text-ui-fg-on-color shadow-sm hover:opacity-90 disabled:opacity-60",
1114
- children: saving ? "Saving..." : "Save settings"
1122
+ onClick: handleDisconnect,
1123
+ disabled: onboardingInProgress,
1124
+ className: "rounded-md border border-ui-border-base px-3 py-2 text-sm font-medium hover:bg-ui-bg-subtle disabled:opacity-50 disabled:cursor-not-allowed",
1125
+ children: "Disconnect"
1126
+ }
1127
+ ) })
1128
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
1129
+ /* @__PURE__ */ jsxs(
1130
+ "div",
1131
+ {
1132
+ ref: initLoaderRef,
1133
+ id: "init-loader",
1134
+ className: `status-msg mb-4 ${connState !== "loading" ? "hidden" : "block"}`,
1135
+ children: [
1136
+ /* @__PURE__ */ jsx("div", { className: "loader inline-block align-middle mr-2" }),
1137
+ /* @__PURE__ */ jsx("span", { id: "loader-text", className: "text-sm", children: onboardingInProgress ? "Configuring connection to PayPal…" : "Checking connection..." })
1138
+ ]
1115
1139
  }
1116
1140
  ),
1117
- loading ? /* @__PURE__ */ jsx("span", { className: "text-sm text-ui-fg-subtle", children: "Loading…" }) : null
1118
- ] }),
1119
- children: /* @__PURE__ */ jsxs("div", { className: "divide-y divide-ui-border-base", children: [
1120
- /* @__PURE__ */ jsx(FieldRow$1, { label: "Enable/Disable", children: /* @__PURE__ */ jsxs("label", { className: "inline-flex items-center gap-2", children: [
1141
+ /* @__PURE__ */ jsxs("div", { className: `${connState === "ready" ? "block" : "hidden"}`, children: [
1121
1142
  /* @__PURE__ */ jsx(
1122
- "input",
1143
+ "a",
1123
1144
  {
1124
- type: "checkbox",
1125
- checked: form.enabled,
1126
- onChange: (e) => setForm((p) => ({ ...p, enabled: e.target.checked })),
1127
- className: "h-4 w-4 rounded border-ui-border-base"
1145
+ ref: (node) => {
1146
+ paypalButtonRef.current = node;
1147
+ ppBtnMeasureRef.current = node;
1148
+ },
1149
+ id: "paypal-button",
1150
+ "data-paypal-button": "true",
1151
+ href: finalUrl || "#",
1152
+ "data-paypal-onboard-complete": "onboardingCallback",
1153
+ onClick: handleConnectClick,
1154
+ className: "btn-paypal",
1155
+ style: {
1156
+ borderRadius: "50px",
1157
+ textDecoration: "none",
1158
+ display: "inline-block",
1159
+ fontWeight: "bold",
1160
+ border: "none",
1161
+ cursor: onboardingInProgress ? "not-allowed" : "pointer",
1162
+ opacity: onboardingInProgress ? 0.6 : 1,
1163
+ pointerEvents: onboardingInProgress ? "none" : "auto"
1164
+ },
1165
+ children: "Connect to PayPal"
1128
1166
  }
1129
1167
  ),
1130
- /* @__PURE__ */ jsx("span", { className: "text-sm text-ui-fg-base", children: "Enable Advanced Credit/Debit Card" })
1131
- ] }) }),
1132
- /* @__PURE__ */ jsx(FieldRow$1, { label: "Title", children: /* @__PURE__ */ jsx(
1133
- "input",
1168
+ /* @__PURE__ */ jsx(
1169
+ "div",
1170
+ {
1171
+ className: "mt-2",
1172
+ style: {
1173
+ width: ppBtnWidth ? `${ppBtnWidth}px` : "auto",
1174
+ marginTop: "20px",
1175
+ marginBottom: "10px"
1176
+ },
1177
+ children: /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx("span", { className: "text-[11px] text-ui-fg-muted leading-none", children: "OR" }) })
1178
+ }
1179
+ ),
1180
+ /* @__PURE__ */ jsx("div", { className: "mt-1", children: /* @__PURE__ */ jsx(
1181
+ "button",
1182
+ {
1183
+ type: "button",
1184
+ onClick: () => setShowManual(!showManual),
1185
+ disabled: onboardingInProgress,
1186
+ className: "text-sm text-ui-fg-interactive underline whitespace-nowrap disabled:opacity-50 disabled:cursor-not-allowed",
1187
+ children: "Click here to insert credentials manually"
1188
+ }
1189
+ ) })
1190
+ ] }),
1191
+ /* @__PURE__ */ jsx("div", { className: `${connState === "ready" ? "hidden" : "block"} mt-3`, children: /* @__PURE__ */ jsx(
1192
+ "button",
1134
1193
  {
1135
- value: form.title,
1136
- onChange: (e) => setForm((p) => ({ ...p, title: e.target.value })),
1137
- className: "w-full rounded-md border border-ui-border-base bg-ui-bg-base px-3 py-2 text-sm text-ui-fg-base outline-none focus:ring-2 focus:ring-ui-border-interactive",
1138
- placeholder: "Credit or Debit Card"
1194
+ type: "button",
1195
+ onClick: () => setShowManual(!showManual),
1196
+ disabled: onboardingInProgress,
1197
+ className: "text-sm text-ui-fg-interactive underline whitespace-nowrap disabled:opacity-50 disabled:cursor-not-allowed",
1198
+ children: "Click here to insert credentials manually"
1139
1199
  }
1140
1200
  ) }),
1141
1201
  /* @__PURE__ */ jsx(
1142
- FieldRow$1,
1143
- {
1144
- label: "Disable specific credit cards",
1145
- hint: "Select card brands to hide from the card form.",
1146
- children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
1147
- /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: form.disabledCards.length ? form.disabledCards.map((v) => {
1148
- var _a2;
1149
- const label = ((_a2 = CARD_BRANDS.find((b) => b.value === v)) == null ? void 0 : _a2.label) ?? v;
1150
- return /* @__PURE__ */ jsx(Pill$1, { onRemove: () => removeDisabledCard(v), children: label }, v);
1151
- }) : /* @__PURE__ */ jsx("span", { className: "text-sm text-ui-fg-subtle", children: "No card brands disabled." }) }),
1152
- /* @__PURE__ */ jsx("div", { className: "rounded-md border border-ui-border-base p-3", children: /* @__PURE__ */ jsx("div", { className: "grid gap-2 md:grid-cols-2", children: CARD_BRANDS.map((b) => {
1153
- const checked = disabledSet.has(b.value);
1154
- return /* @__PURE__ */ jsxs(
1155
- "label",
1156
- {
1157
- className: cx$1(
1158
- "flex items-center gap-2 rounded-md p-2",
1159
- "hover:bg-ui-bg-subtle"
1160
- ),
1161
- children: [
1162
- /* @__PURE__ */ jsx(
1163
- "input",
1164
- {
1165
- type: "checkbox",
1166
- checked,
1167
- onChange: () => toggleDisabledCard(b.value),
1168
- className: "h-4 w-4 rounded border-ui-border-base"
1169
- }
1170
- ),
1171
- /* @__PURE__ */ jsx("span", { className: "text-sm text-ui-fg-base", children: b.label })
1172
- ]
1173
- },
1174
- b.value
1175
- );
1176
- }) }) })
1177
- ] })
1178
- }
1179
- ),
1180
- /* @__PURE__ */ jsx(
1181
- FieldRow$1,
1202
+ "div",
1182
1203
  {
1183
- label: "Contingency for 3D Secure",
1184
- hint: "Choose when 3D Secure should be triggered during card payments.",
1185
- children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
1186
- /* @__PURE__ */ jsx(
1187
- "select",
1188
- {
1189
- value: form.threeDS,
1190
- onChange: (e) => setForm((p) => ({ ...p, threeDS: e.target.value })),
1191
- className: "w-full rounded-md border border-ui-border-base bg-ui-bg-base px-3 py-2 text-sm text-ui-fg-base outline-none focus:ring-2 focus:ring-ui-border-interactive",
1192
- children: THREE_DS_OPTIONS.map((o) => /* @__PURE__ */ jsx("option", { value: o.value, children: o.label }, o.value))
1193
- }
1194
- ),
1195
- ((_a = THREE_DS_OPTIONS.find((o) => o.value === form.threeDS)) == null ? void 0 : _a.hint) ? /* @__PURE__ */ jsx("div", { className: "text-xs text-ui-fg-subtle", children: (_b = THREE_DS_OPTIONS.find((o) => o.value === form.threeDS)) == null ? void 0 : _b.hint }) : null
1196
- ] })
1204
+ ref: errorLogRef,
1205
+ id: "error-log",
1206
+ className: `mt-4 text-left text-xs bg-red-50 text-red-600 p-3 border border-red-200 rounded ${connState === "error" && error ? "block" : "hidden"}`,
1207
+ children: error
1197
1208
  }
1198
- ),
1199
- /* @__PURE__ */ jsx(FieldRow$1, { label: "Card Save Enabled", hint: "Allow customers to save a card at checkout for future use.", children: /* @__PURE__ */ jsxs("label", { className: "inline-flex items-center gap-2", children: [
1209
+ )
1210
+ ] }) }),
1211
+ showManual && /* @__PURE__ */ jsx("div", { className: "md:col-span-2", children: /* @__PURE__ */ jsxs("div", { className: "ml-[260px] max-w-xl mt-4 grid grid-cols-1 gap-3 md:grid-cols-2", children: [
1212
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
1213
+ /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Client ID" }),
1200
1214
  /* @__PURE__ */ jsx(
1201
1215
  "input",
1202
1216
  {
1203
- type: "checkbox",
1204
- checked: form.cardSaveEnabled,
1205
- onChange: (e) => setForm((p) => ({ ...p, cardSaveEnabled: e.target.checked })),
1206
- className: "h-4 w-4 rounded border-ui-border-base"
1217
+ type: "text",
1218
+ value: clientId,
1219
+ onChange: (e) => setClientId(e.target.value),
1220
+ disabled: onboardingInProgress,
1221
+ className: "rounded-md border border-ui-border-base bg-transparent px-3 py-2 text-sm disabled:opacity-50",
1222
+ placeholder: env === "sandbox" ? "Sandbox Client ID" : "Live Client ID"
1223
+ }
1224
+ )
1225
+ ] }),
1226
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
1227
+ /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Client Secret" }),
1228
+ /* @__PURE__ */ jsx(
1229
+ "input",
1230
+ {
1231
+ type: "password",
1232
+ value: secret,
1233
+ onChange: (e) => setSecret(e.target.value),
1234
+ disabled: onboardingInProgress,
1235
+ className: "rounded-md border border-ui-border-base bg-transparent px-3 py-2 text-sm disabled:opacity-50",
1236
+ placeholder: env === "sandbox" ? "Sandbox Secret" : "Live Secret"
1237
+ }
1238
+ )
1239
+ ] }),
1240
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 md:col-span-2", children: [
1241
+ /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Merchant ID (optional)" }),
1242
+ /* @__PURE__ */ jsx(
1243
+ "input",
1244
+ {
1245
+ type: "text",
1246
+ value: merchantId,
1247
+ onChange: (e) => setMerchantId(e.target.value),
1248
+ disabled: onboardingInProgress,
1249
+ className: "rounded-md border border-ui-border-base bg-transparent px-3 py-2 text-sm disabled:opacity-50",
1250
+ placeholder: "Merchant ID"
1251
+ }
1252
+ )
1253
+ ] }),
1254
+ /* @__PURE__ */ jsxs("div", { className: "md:col-span-2 flex items-center gap-2 mt-2", children: [
1255
+ /* @__PURE__ */ jsx(
1256
+ "button",
1257
+ {
1258
+ type: "button",
1259
+ className: "rounded-md border border-ui-border-base px-3 py-2 text-sm font-medium hover:bg-ui-bg-subtle disabled:opacity-50 disabled:cursor-not-allowed",
1260
+ onClick: () => setShowManual(false),
1261
+ disabled: onboardingInProgress,
1262
+ children: "Cancel"
1207
1263
  }
1208
1264
  ),
1209
- /* @__PURE__ */ jsx("span", { className: "text-sm text-ui-fg-base", children: "Enable card saving at checkout" })
1210
- ] }) })
1211
- ] })
1212
- }
1213
- )
1214
- ] }) });
1215
- }
1216
- function formatDate$2(value) {
1217
- if (!value) {
1218
- return "";
1219
- }
1220
- const parsed = new Date(value);
1221
- if (Number.isNaN(parsed.getTime())) {
1222
- return value;
1223
- }
1224
- return parsed.toLocaleString();
1225
- }
1226
- function PayPalAuditLogsPage() {
1227
- const [logs, setLogs] = useState([]);
1228
- const [loading, setLoading] = useState(false);
1229
- const [error, setError] = useState(null);
1230
- const fetchLogs = useCallback(async () => {
1231
- try {
1232
- setLoading(true);
1233
- setError(null);
1234
- const response = await fetch("/admin/paypal/audit-logs?limit=50", {
1235
- credentials: "include",
1236
- headers: {
1237
- Accept: "application/json"
1238
- }
1239
- });
1240
- if (!response.ok) {
1241
- const message = await response.text().catch(() => "");
1242
- throw new Error(message || "Failed to load audit logs.");
1243
- }
1244
- const data = await response.json().catch(() => ({}));
1245
- setLogs((data == null ? void 0 : data.logs) || []);
1246
- } catch (fetchError) {
1247
- setError((fetchError == null ? void 0 : fetchError.message) || "Failed to load audit logs.");
1248
- setLogs([]);
1249
- } finally {
1250
- setLoading(false);
1251
- }
1252
- }, []);
1253
- useEffect(() => {
1254
- fetchLogs();
1255
- }, [fetchLogs]);
1256
- return /* @__PURE__ */ jsx("div", { className: "p-6", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
1257
- /* @__PURE__ */ jsxs("div", { children: [
1258
- /* @__PURE__ */ jsx("h1", { className: "text-xl font-semibold text-ui-fg-base", children: "PayPal Audit Logs" }),
1259
- /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-ui-fg-subtle", children: "Track administrative changes and credential events for PayPal configuration." })
1265
+ /* @__PURE__ */ jsx(
1266
+ "button",
1267
+ {
1268
+ type: "button",
1269
+ className: "rounded-md border border-ui-border-base px-3 py-2 text-sm font-medium bg-ui-bg-base hover:bg-ui-bg-subtle disabled:opacity-50 disabled:cursor-not-allowed",
1270
+ disabled: !canSaveManual || onboardingInProgress,
1271
+ onClick: handleSaveManual,
1272
+ children: "Save credentials"
1273
+ }
1274
+ )
1275
+ ] })
1276
+ ] }) })
1277
+ ] }) })
1260
1278
  ] }),
1261
- /* @__PURE__ */ jsx(PayPalTabs, {}),
1262
- /* @__PURE__ */ jsxs("div", { className: "rounded-xl border border-ui-border-base bg-ui-bg-base shadow-sm", children: [
1263
- /* @__PURE__ */ jsx("div", { className: "border-b border-ui-border-base p-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
1264
- /* @__PURE__ */ jsx("div", { className: "text-base font-semibold text-ui-fg-base", children: "Latest events" }),
1265
- /* @__PURE__ */ jsx(
1266
- "button",
1267
- {
1268
- type: "button",
1269
- onClick: fetchLogs,
1270
- className: "rounded-md border border-ui-border-base px-3 py-2 text-sm text-ui-fg-base",
1271
- disabled: loading,
1272
- children: loading ? "Refreshing..." : "Refresh"
1273
- }
1274
- )
1275
- ] }) }),
1276
- /* @__PURE__ */ jsxs("div", { className: "p-4", children: [
1277
- error ? /* @__PURE__ */ jsx("div", { className: "rounded-md border border-red-200 bg-red-50 p-3 text-sm text-red-600", children: error }) : null,
1278
- !error && logs.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-sm text-ui-fg-subtle", children: loading ? "Loading audit logs..." : "No audit log entries found yet." }) : null,
1279
- logs.length > 0 ? /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "min-w-full text-left text-sm", children: [
1280
- /* @__PURE__ */ jsx("thead", { className: "text-ui-fg-muted", children: /* @__PURE__ */ jsxs("tr", { children: [
1281
- /* @__PURE__ */ jsx("th", { className: "pb-2 pr-4 font-medium", children: "Timestamp" }),
1282
- /* @__PURE__ */ jsx("th", { className: "pb-2 pr-4 font-medium", children: "Event" }),
1283
- /* @__PURE__ */ jsx("th", { className: "pb-2 font-medium", children: "Details" })
1284
- ] }) }),
1285
- /* @__PURE__ */ jsx("tbody", { children: logs.map((entry) => /* @__PURE__ */ jsxs("tr", { className: "border-t border-ui-border-base", children: [
1286
- /* @__PURE__ */ jsx("td", { className: "py-3 pr-4 text-ui-fg-base", children: formatDate$2(entry.created_at) || "—" }),
1287
- /* @__PURE__ */ jsx("td", { className: "py-3 pr-4 text-ui-fg-base", children: entry.event_type || "—" }),
1288
- /* @__PURE__ */ jsx("td", { className: "py-3 text-ui-fg-subtle", children: /* @__PURE__ */ jsx("pre", { className: "whitespace-pre-wrap rounded-md bg-ui-bg-subtle p-2 text-xs text-ui-fg-subtle", children: JSON.stringify(entry.metadata || {}, null, 2) }) })
1289
- ] }, entry.id)) })
1290
- ] }) }) : null
1291
- ] })
1292
- ] })
1293
- ] }) });
1294
- }
1295
- function PayPalApplePayPage() {
1296
- return /* @__PURE__ */ jsx(Navigate, { to: "/settings/paypal/connection", replace: true });
1279
+ /* @__PURE__ */ jsx("style", { children: `
1280
+ .loader {
1281
+ border: 3px solid #f3f3f3;
1282
+ border-top: 3px solid #0070ba;
1283
+ border-radius: 50%;
1284
+ width: 18px;
1285
+ height: 18px;
1286
+ animation: spin 1s linear infinite;
1287
+ display: inline-block;
1288
+ vertical-align: middle;
1289
+ margin-right: 8px;
1290
+ }
1291
+ @keyframes spin {
1292
+ 0% { transform: rotate(0deg); }
1293
+ 100% { transform: rotate(360deg); }
1294
+ }
1295
+ ` })
1296
+ ] });
1297
1297
  }
1298
1298
  const EMPTY_FILTERS = {
1299
1299
  dispute_id: "",
@@ -2051,21 +2051,21 @@ const routeModule = {
2051
2051
  Component: AdditionalSettingsTab,
2052
2052
  path: "/settings/paypal/additional-settings"
2053
2053
  },
2054
- {
2055
- Component: PayPalConnectionPage,
2056
- path: "/settings/paypal/connection"
2057
- },
2058
2054
  {
2059
2055
  Component: AdvancedCardPaymentsTab,
2060
2056
  path: "/settings/paypal/advanced-card-payments"
2061
2057
  },
2058
+ {
2059
+ Component: PayPalApplePayPage,
2060
+ path: "/settings/paypal/apple-pay"
2061
+ },
2062
2062
  {
2063
2063
  Component: PayPalAuditLogsPage,
2064
2064
  path: "/settings/paypal/audit-logs"
2065
2065
  },
2066
2066
  {
2067
- Component: PayPalApplePayPage,
2068
- path: "/settings/paypal/apple-pay"
2067
+ Component: PayPalConnectionPage,
2068
+ path: "/settings/paypal/connection"
2069
2069
  },
2070
2070
  {
2071
2071
  Component: PayPalDisputesPage,