Use My Plans

1// useMyPlans — "My plans" logic, no markup: load the logged-in member's orders and re-sync on
2// visibilitychange so a plan bought via hosted checkout shows up on return. getMyPlanOrders()
3// resolves to an ARRAY ([] for anonymous visitors — never throws), so the view can show a
4// "log in to see your plans" state. Keep the visibilitychange re-sync — it is load-bearing.
5import { useState, useEffect, useCallback } from "react";
6import { getMyPlanOrders } from "@/rest/wix-pricing-plans";
7
8export function useMyPlans({ orderStatuses = ["ACTIVE"] } = {}) {
9  const [orders, setOrders] = useState([]);
10  const [loaded, setLoaded] = useState(false);
11
12  const refresh = useCallback(() => {
13    // [] for anonymous visitors (no member context) — never throws.
14    getMyPlanOrders({ orderStatuses }).then((o) => { setOrders(o); setLoaded(true); });
15  }, [orderStatuses]);
16
17  useEffect(() => {                                   // load once + re-sync on return from hosted checkout
18    refresh();
19    const onVisible = () => document.visibilityState === "visible" && refresh();
20    document.addEventListener("visibilitychange", onVisible);
21    return () => document.removeEventListener("visibilitychange", onVisible);
22  }, [refresh]);
23
24  return { orders, loaded, refresh };
25}