refactor(app): split page orchestration flows

src/app/_hooks/__tests__/use-payment-order-lifecycle.test.ts

@@ -0,0 +1,41 @@
+import { describe, expect, it } from "vitest";
+
+import { shouldInspectPendingPaymentOrder } from "../use-payment-order-lifecycle";
+
+describe("shouldInspectPendingPaymentOrder", () => {
+  it("allows pending order inspection when payment plans are ready", () => {
+    expect(
+      shouldInspectPendingPaymentOrder({
+        currentOrderId: null,
+        isPaid: false,
+        isPollingOrder: false,
+        shouldResumePendingOrder: true,
+        status: "ready",
+      }),
+    ).toBe(true);
+  });
+
+  it("allows cleanup inspection for active stale payment state", () => {
+    expect(
+      shouldInspectPendingPaymentOrder({
+        currentOrderId: "order-1",
+        isPaid: false,
+        isPollingOrder: true,
+        shouldResumePendingOrder: false,
+        status: "pollingOrder",
+      }),
+    ).toBe(true);
+  });
+
+  it("waits when resume is requested but payment plans are not ready", () => {
+    expect(
+      shouldInspectPendingPaymentOrder({
+        currentOrderId: "order-1",
+        isPaid: false,
+        isPollingOrder: true,
+        shouldResumePendingOrder: true,
+        status: "pollingOrder",
+      }),
+    ).toBe(false);
+  });
+});

src/app/_hooks/use-payment-order-lifecycle.ts

@@ -0,0 +1,136 @@
+"use client";
+
+import { type Dispatch, useEffect, useRef } from "react";
+
+import {
+  clearPendingPaymentOrder,
+  getPendingPaymentOrderForType,
+  type PendingPaymentSubscriptionType,
+} from "@/lib/payment/pending_payment_order";
+import type {
+  PaymentContextState,
+} from "@/stores/payment/payment-context";
+import type { PaymentEvent } from "@/stores/payment/payment-events";
+import { useUserDispatch } from "@/stores/user/user-context";
+
+export interface PaymentOrderLifecycleState {
+  currentOrderId: string | null;
+  isPaid: boolean;
+  isPollingOrder: boolean;
+  status: string;
+}
+
+export interface ShouldInspectPendingPaymentOrderInput
+  extends PaymentOrderLifecycleState {
+  shouldResumePendingOrder: boolean;
+}
+
+export interface UsePaymentOrderLifecycleInput {
+  payment: PaymentContextState;
+  paymentDispatch: Dispatch<PaymentEvent>;
+  paymentType: PendingPaymentSubscriptionType;
+  shouldResumePendingOrder: boolean;
+  refreshUserOnPaid?: boolean;
+}
+
+export function shouldInspectPendingPaymentOrder({
+  isPaid,
+  isPollingOrder,
+  shouldResumePendingOrder,
+  status,
+}: ShouldInspectPendingPaymentOrderInput): boolean {
+  return (
+    status === "ready" ||
+    (!shouldResumePendingOrder &&
+      (isPollingOrder || isPaid || status === "failed"))
+  );
+}
+
+export function usePaymentOrderLifecycle({
+  payment,
+  paymentDispatch,
+  paymentType,
+  refreshUserOnPaid = true,
+  shouldResumePendingOrder,
+}: UsePaymentOrderLifecycleInput): void {
+  const userDispatch = useUserDispatch();
+  const refreshedPaidOrderRef = useRef<string | null>(null);
+  const resumedPendingOrderRef = useRef<string | null>(null);
+
+  useEffect(() => {
+    if (!refreshUserOnPaid) return;
+    if (!payment.isPaid || !payment.currentOrderId) return;
+    if (refreshedPaidOrderRef.current === payment.currentOrderId) return;
+    refreshedPaidOrderRef.current = payment.currentOrderId;
+    userDispatch({ type: "UserFetch" });
+  }, [
+    payment.currentOrderId,
+    payment.isPaid,
+    refreshUserOnPaid,
+    userDispatch,
+  ]);
+
+  useEffect(() => {
+    if (
+      !shouldInspectPendingPaymentOrder({
+        currentOrderId: payment.currentOrderId,
+        isPaid: payment.isPaid,
+        isPollingOrder: payment.isPollingOrder,
+        shouldResumePendingOrder,
+        status: payment.status,
+      })
+    ) {
+      return;
+    }
+
+    let cancelled = false;
+
+    const handlePendingOrder = async () => {
+      const result = await getPendingPaymentOrderForType(paymentType);
+      if (cancelled || !result.success || result.data === null) return;
+
+      if (!shouldResumePendingOrder) {
+        await clearPendingPaymentOrder();
+        if (
+          payment.currentOrderId === result.data.orderId &&
+          (payment.isPollingOrder ||
+            payment.isPaid ||
+            payment.status === "failed")
+        ) {
+          paymentDispatch({ type: "PaymentReset" });
+        }
+        return;
+      }
+
+      if (payment.currentOrderId === result.data.orderId) return;
+      if (resumedPendingOrderRef.current === result.data.orderId) return;
+
+      resumedPendingOrderRef.current = result.data.orderId;
+      paymentDispatch({
+        type: "PaymentReturned",
+        orderId: result.data.orderId,
+        createdAt: result.data.createdAt,
+      });
+    };
+
+    void handlePendingOrder();
+    return () => {
+      cancelled = true;
+    };
+  }, [
+    payment.currentOrderId,
+    payment.isPaid,
+    payment.isPollingOrder,
+    payment.status,
+    paymentDispatch,
+    paymentType,
+    shouldResumePendingOrder,
+  ]);
+
+  useEffect(() => {
+    if (!payment.currentOrderId) return;
+    if (!payment.isPaid && payment.status !== "failed") return;
+
+    void clearPendingPaymentOrder();
+  }, [payment.currentOrderId, payment.isPaid, payment.status]);
+}