@mesub/react 0.1.2 → 0.1.3

package/dist/index.d.cts

@@ -33,8 +33,12 @@ interface MesubPlan {
     ends_at: string | null;
 }
 type MesubSubscriptionStatus = 'pending' | 'active' | 'cancelled' | 'unpaid' | 'stopped' | 'ended' | 'failed' | 'expired' | 'superseded';
-/** Why charges are held back: the merchant's own setup by name, `mesub` for any cause of Mesub's. */
-type MesubBlockedReason = 'puller_not_allowed' | 'receiver_not_allowed' | 'receiver_account_missing' | 'receiver_account_frozen' | 'mint_gone' | 'mesub';
+/**
+ * Why charges are held back: the merchant's own setup by name (the last two
+ * the token issuer's to lift), `mesub` for any cause of Mesub's. The widget
+ * words every one the same to the subscriber.
+ */
+type MesubBlockedReason = 'puller_not_allowed' | 'receiver_not_allowed' | 'receiver_account_missing' | 'receiver_account_frozen' | 'receiver_account_needs_memo' | 'receiver_account_confidential_only' | 'mint_gone' | 'mint_paused' | 'mint_transfer_hook' | 'mesub';
 /**
  * Why a `stopped` one stopped (Mesub-io/backend#402): every retry failed, the
  * Free date to pay by passed, or the wallet closed the account that lets
@@ -59,6 +63,8 @@ interface MesubSubscription {
     current_period_end: string | null;
     next_charge_at: string | null;
     next_retry_at: string | null;
+    next_retry_number?: number | null;
+    retries_allowed?: number | null;
     retry_deadline: string | null;
     access_until: string | null;
     closable?: boolean;
@@ -125,6 +131,7 @@ interface PayNowResult {
 interface UseSubscriptionsResult {
     state: 'loading' | 'ready' | 'signed-out' | 'error';
     subscriptions: MesubHeldSubscription[];
+    hasMore: boolean;
     error: string | null;
     reload(): Promise<void>;
     payNow(id: string): Promise<PayNowResult>;

package/dist/index.d.ts

@@ -33,8 +33,12 @@ interface MesubPlan {
     ends_at: string | null;
 }
 type MesubSubscriptionStatus = 'pending' | 'active' | 'cancelled' | 'unpaid' | 'stopped' | 'ended' | 'failed' | 'expired' | 'superseded';
-/** Why charges are held back: the merchant's own setup by name, `mesub` for any cause of Mesub's. */
-type MesubBlockedReason = 'puller_not_allowed' | 'receiver_not_allowed' | 'receiver_account_missing' | 'receiver_account_frozen' | 'mint_gone' | 'mesub';
+/**
+ * Why charges are held back: the merchant's own setup by name (the last two
+ * the token issuer's to lift), `mesub` for any cause of Mesub's. The widget
+ * words every one the same to the subscriber.
+ */
+type MesubBlockedReason = 'puller_not_allowed' | 'receiver_not_allowed' | 'receiver_account_missing' | 'receiver_account_frozen' | 'receiver_account_needs_memo' | 'receiver_account_confidential_only' | 'mint_gone' | 'mint_paused' | 'mint_transfer_hook' | 'mesub';
 /**
  * Why a `stopped` one stopped (Mesub-io/backend#402): every retry failed, the
  * Free date to pay by passed, or the wallet closed the account that lets
@@ -59,6 +63,8 @@ interface MesubSubscription {
     current_period_end: string | null;
     next_charge_at: string | null;
     next_retry_at: string | null;
+    next_retry_number?: number | null;
+    retries_allowed?: number | null;
     retry_deadline: string | null;
     access_until: string | null;
     closable?: boolean;
@@ -125,6 +131,7 @@ interface PayNowResult {
 interface UseSubscriptionsResult {
     state: 'loading' | 'ready' | 'signed-out' | 'error';
     subscriptions: MesubHeldSubscription[];
+    hasMore: boolean;
     error: string | null;
     reload(): Promise<void>;
     payNow(id: string): Promise<PayNowResult>;

package/dist/index.js

@@ -41,6 +41,10 @@ function paidOf(answer) {
   const whole = Array.isArray(answer.payments) && answer.payments.length < LISTED_AT_MOST;
   return whole ? read(answer.listed_paid) : null;
 }
+function paymentsErrorOf(answer) {
+  const error = answer.payments_error;
+  return isObject(error) && typeof error.code === "string" && typeof error.message === "string" ? { code: error.code, message: error.message } : null;
+}
 function createApi(options) {
   const base = options.endpoint.replace(/\/+$/, "");
   const doFetch = options.fetch ?? ((input, init) => globalThis.fetch(input, init));
@@ -111,7 +115,11 @@ function createApi(options) {
     ),
     subscriptions: async () => {
       const answer = await request("GET", "/subscriptions", void 0, REQUEST_TIMEOUT_MS);
-      return Array.isArray(answer.subscriptions) ? answer.subscriptions : [];
+      return {
+        subscriptions: Array.isArray(answer.subscriptions) ? answer.subscriptions : [],
+        // An older server does not say: read as whole.
+        has_more: answer.has_more === true
+      };
     },
     subscription: async (id) => {
       const answer = await request("GET", at(id), void 0, REQUEST_TIMEOUT_MS);
@@ -119,7 +127,8 @@ function createApi(options) {
         subscription: answer.subscription,
         upcoming: Array.isArray(answer.upcoming) ? answer.upcoming : [],
         payments: Array.isArray(answer.payments) ? answer.payments : null,
-        paid: paidOf(answer)
+        paid: paidOf(answer),
+        payments_error: paymentsErrorOf(answer)
       };
     },
     prepare: async (plan, wallet) => await request(
@@ -2161,6 +2170,7 @@ function payableOf(row, now) {
   const deadline = Date.parse(row.retry_deadline ?? "");
   return Number.isNaN(deadline) || deadline > now;
 }
+var MORE_NOT_LISTED = "Only your most recent subscriptions are listed here.";
 var PAY_NOW_SENT = "Payment sent. It shows here once the network confirms it.";
 function payNowRefusal(failure) {
   if (!(failure instanceof MesubClientError)) return "Something went wrong.";
@@ -2186,6 +2196,7 @@ function useSubscriptions() {
   const { api, revision, manage: open } = useMesubInternal();
   const [state, setState] = useState4("loading");
   const [rows, setRows] = useState4([]);
+  const [hasMore, setHasMore] = useState4(false);
   const [error, setError] = useState4(null);
   const [now, setNow] = useState4(() => Date.now());
   const read = useRef4(0);
@@ -2201,7 +2212,8 @@ function useSubscriptions() {
     try {
       const served = await api.subscriptions();
       if (!alive.current || id !== read.current) return;
-      setRows(served.filter((row) => HELD.has(row.status)));
+      setRows(served.subscriptions.filter((row) => HELD.has(row.status)));
+      setHasMore(served.has_more);
       setNow(Date.now());
       setError(null);
       setState("ready");
@@ -2209,6 +2221,7 @@ function useSubscriptions() {
       if (!alive.current || id !== read.current) return;
       if (signedOut(failure)) {
         setRows([]);
+        setHasMore(false);
         setError(null);
         setState("signed-out");
         return;
@@ -2262,7 +2275,7 @@ function useSubscriptions() {
     },
     [api, reload]
   );
-  return { state, subscriptions, error, reload, payNow, manage };
+  return { state, subscriptions, hasMore, error, reload, payNow, manage };
 }
 var STATUS = {
   active: "Active",
@@ -2394,7 +2407,7 @@ function PayNow({ pay }) {
 }
 function ManageSubscriptions({ onChanged, ...rest }) {
   const { theme } = useMesubInternal();
-  const { state, subscriptions, error, reload, payNow, manage } = useSubscriptions();
+  const { state, subscriptions, hasMore, error, reload, payNow, manage } = useSubscriptions();
   const plans = usePlans(subscriptions.flatMap((row) => row.plan ? [row.plan] : []));
   const [retrying, setRetrying] = useState4(false);
   async function act(id) {
@@ -2429,7 +2442,7 @@ function ManageSubscriptions({ onChanged, ...rest }) {
         }
       )
     ] });
-  } else if (subscriptions.length === 0) {
+  } else if (subscriptions.length === 0 && !hasMore) {
     body = /* @__PURE__ */ jsx6("p", { "data-mesub-empty": "none", children: "You have no subscription yet." });
   } else {
     body = /* @__PURE__ */ jsx6("ul", { "data-mesub-subscription-list": "", "aria-label": "Your subscriptions", children: subscriptions.map((row) => {
@@ -2491,14 +2504,17 @@ function ManageSubscriptions({ onChanged, ...rest }) {
       ] }, row.id);
     }) });
   }
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsxs5(
     "div",
     {
       ...rest,
       "data-mesub-subscriptions": "",
       "data-mesub-state": state,
       "data-mesub-theme": theme,
-      children: body
+      children: [
+        body,
+        state === "ready" && hasMore ? /* @__PURE__ */ jsx6("p", { "data-mesub-subscription-note": "", children: MORE_NOT_LISTED }) : null
+      ]
     }
   );
 }
@@ -2563,6 +2579,7 @@ function useDetail(row) {
   }, [api, id, revision]);
   return detail?.subscription.id === id ? detail : null;
 }
+var PAYMENTS_UNREAD = "Past payments could not be read just now.";
 var PAST_SHOWN = 5;
 var PAST_STEP = 10;
 function SubscriptionDialog({
@@ -2572,7 +2589,7 @@ function SubscriptionDialog({
   const [shown, setShown] = useState5(PAST_SHOWN);
   const titleId = useId3();
   const { chain } = useMesubInternal();
-  const { state, subscriptions, error, reload, payNow, manage } = useSubscriptions();
+  const { state, subscriptions, hasMore, error, reload, payNow, manage } = useSubscriptions();
   const row = pickSubscription(subscriptions, slug) ?? null;
   const plan = usePlan(row?.plan);
   const detail = useDetail(row);
@@ -2596,7 +2613,7 @@ function SubscriptionDialog({
   } else if (!row) {
     body = /* @__PURE__ */ jsxs6(Fragment6, { children: [
       /* @__PURE__ */ jsx7("h2", { id: titleId, children: "No subscription yet" }),
-      /* @__PURE__ */ jsx7("p", { children: "You are not subscribed to this plan." })
+      /* @__PURE__ */ jsx7("p", { children: hasMore ? "None of your most recent subscriptions is to this plan." : "You are not subscribed to this plan." })
     ] });
   } else {
     const name = plan?.name ?? row.plan ?? "Subscription";
@@ -2605,6 +2622,7 @@ function SubscriptionDialog({
     const note = noteOf(row);
     const upcoming = detail?.upcoming ?? [];
     const past = detail?.payments ?? [];
+    const unread = detail?.payments === null && detail.payments_error !== null;
     const total = detail?.paid?.amount ? paidBrief(detail.paid.amount, plan, formatAmount) : null;
     const rate = plan ? briefPrice(plan) : null;
     const due = (display) => display ? `${grouped(display)}${symbolOf(plan)}` : "";
@@ -2656,7 +2674,7 @@ function SubscriptionDialog({
           /* @__PURE__ */ jsx7("dd", { title: row.wallet, children: shortAddress(row.wallet) })
         ] })
       ] }),
-      upcoming.length > 0 || past.length > 0 ? (
+      upcoming.length > 0 || past.length > 0 || unread ? (
         // Closed until asked for, as the terms are on the checkout: same toggle.
         /* @__PURE__ */ jsxs6("details", { "data-mesub-terms": "", "data-mesub-payments": "", children: [
           /* @__PURE__ */ jsx7("summary", { children: "Payments" }),
@@ -2678,6 +2696,10 @@ function SubscriptionDialog({
               `next-${next.due_at}`
             )) })
           ] }) : null,
+          unread ? /* @__PURE__ */ jsxs6("section", { "aria-label": "Past payments", children: [
+            /* @__PURE__ */ jsx7("h3", { children: "Past" }),
+            /* @__PURE__ */ jsx7("p", { "data-mesub-payments-error": "", children: PAYMENTS_UNREAD })
+          ] }) : null,
           past.length > 0 ? /* @__PURE__ */ jsxs6("section", { "aria-label": "Past payments", children: [
             /* @__PURE__ */ jsx7("h3", { children: "Past" }),
             /* @__PURE__ */ jsx7("ul", { children: past.slice(0, shown).map((payment) => {