@edx/frontend-app-subscription-manage 1.18.1 → 1.19.0

package/dist/orderHistory/OrderHistoryPage.js

@@ -0,0 +1,127 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useState, useCallback, } from 'react';
+import { Alert, Container, Spinner, Tabs, Tab, } from '@openedx/paragon';
+import { useIntl } from '@openedx/frontend-base';
+import { useSearchParams } from 'react-router-dom';
+import ActiveSubscription from '../components/ActiveSubscription/ActiveSubscription';
+import BecomeSubscriber from '../components/BecomeSubscriber/BecomeSubscriber';
+import CanceledSubscription, { RenewBanner, } from '../components/CanceledSubscription/CanceledSubscription';
+import HelpFooter from '../components/HelpFooter/HelpFooter';
+import OrderHistoryHeader from '../components/OrderHistoryHeader/OrderHistoryHeader';
+import OrderPurchases from '../components/OrderHistory/OrderPurchases';
+import PaymentHistory from '../components/PaymentHistory/PaymentHistory';
+import RenewSubscriptionModal from '../components/RenewSubscriptionModal/RenewSubscriptionModal';
+import ResubscribeCard from '../components/ResubscribeCard/ResubscribeCard';
+import messages from '../components/messages';
+import { useBillingPlansQuery, useIsSubscriberQuery, usePaymentHistoryQuery, useReactivateSubscriptionMutation, useViaxClient, useViaxSession, } from '../data/hooks/useManageQueries';
+import { getPaymentHistorySubscriptionIds } from '../data/services/subscription/getPaymentHistory';
+import { getPlanPrice } from '../utils/billingDetails';
+import { formatDisplayDate } from '../utils/formatDate';
+import { resolvePlanLabel, resolveSubscriptionView, } from '../utils/subscriptionView';
+const OrderHistoryPage = () => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    const { formatMessage } = useIntl();
+    const [searchParams, setSearchParams] = useSearchParams();
+    const [isRenewModalOpen, setIsRenewModalOpen] = useState(false);
+    // Initialize active tab from URL.
+    const [activeTab, setActiveTab] = useState(searchParams.get('tab') === 'payment-history'
+        ? 'payment-history'
+        : 'subscription');
+    const client = useViaxClient();
+    const { sessionReady, isSessionLoading, isSessionError, } = useViaxSession(client);
+    const subscriberQuery = useIsSubscriberQuery(client, sessionReady);
+    const billingPlansQuery = useBillingPlansQuery(client, sessionReady);
+    const reactivateMutation = useReactivateSubscriptionMutation(client);
+    const subscriptionBiId = (_b = (_a = subscriberQuery.data) === null || _a === void 0 ? void 0 : _a.subscriptionBiId) !== null && _b !== void 0 ? _b : null;
+    const paymentHistoryQuery = usePaymentHistoryQuery(client, sessionReady, getPaymentHistorySubscriptionIds(subscriberQuery.data));
+    const subscriber = (_c = subscriberQuery.data) !== null && _c !== void 0 ? _c : null;
+    const planCycle = resolvePlanLabel(subscriber);
+    const planPrice = getPlanPrice((_e = (_d = billingPlansQuery.data) === null || _d === void 0 ? void 0 : _d.plans) !== null && _e !== void 0 ? _e : [], planCycle);
+    const price = (_f = planPrice === null || planPrice === void 0 ? void 0 : planPrice.amount) !== null && _f !== void 0 ? _f : null;
+    const currency = (_g = planPrice === null || planPrice === void 0 ? void 0 : planPrice.currency) !== null && _g !== void 0 ? _g : null;
+    const renewalDate = formatDisplayDate((_h = subscriber === null || subscriber === void 0 ? void 0 : subscriber.currentPeriodEnd) !== null && _h !== void 0 ? _h : subscriber === null || subscriber === void 0 ? void 0 : subscriber.subscriptionEndDate);
+    const handleOpenRenewModal = useCallback(() => {
+        if (!subscriptionBiId) {
+            return;
+        }
+        reactivateMutation.reset();
+        setIsRenewModalOpen(true);
+    }, [subscriptionBiId, reactivateMutation]);
+    const handleConfirmRenew = useCallback(() => {
+        if (!subscriptionBiId || reactivateMutation.isPending) {
+            return;
+        }
+        reactivateMutation.mutate(subscriptionBiId);
+    }, [subscriptionBiId, reactivateMutation]);
+    useEffect(() => {
+        if (reactivateMutation.isSuccess) {
+            setIsRenewModalOpen(false);
+        }
+    }, [reactivateMutation.isSuccess]);
+    // Synchronize active tab with URL changes.
+    useEffect(() => {
+        const tab = searchParams.get('tab');
+        setActiveTab(tab === 'payment-history' ? 'payment-history' : 'subscription');
+    }, [searchParams]);
+    const handleTabSelect = useCallback((tabKey) => {
+        if (tabKey === 'subscription' || tabKey === 'payment-history') {
+            setActiveTab(tabKey);
+            setSearchParams(tabKey === 'subscription' ? {} : { tab: tabKey }, { replace: true });
+        }
+    }, [setSearchParams]);
+    const isLoading = isSessionLoading || (sessionReady && subscriberQuery.isPending);
+    const isError = isSessionError || subscriberQuery.isError;
+    const resolvedView = resolveSubscriptionView(subscriber);
+    const showRenewBanner = resolvedView === 'canceled_access';
+    // Resolve subscription panel.
+    const subscriptionPanel = useMemo(() => {
+        switch (resolvedView) {
+            case 'active':
+                return _jsx(ActiveSubscription, { subscriber: subscriber });
+            case 'canceled_access':
+                return (_jsx(CanceledSubscription, { subscriber: subscriber, onRenew: handleOpenRenewModal }));
+            case 'canceled_expired':
+                return (_jsx(ResubscribeCard, { subscriber: subscriber, price: price, currency: currency }));
+            case 'none':
+            default:
+                return (_jsx(BecomeSubscriber, { price: price, currency: currency }));
+        }
+    }, [
+        resolvedView,
+        subscriber,
+        price,
+        currency,
+        handleOpenRenewModal,
+    ]);
+    // Define tabs dynamically.
+    const orderHistoryTabs = useMemo(() => {
+        var _a;
+        return [
+            {
+                key: 'subscription',
+                title: 'Manage subscription',
+                panel: (_jsxs(_Fragment, { children: [subscriptionPanel, _jsx(HelpFooter, {})] })),
+            },
+            {
+                key: 'payment-history',
+                title: 'Payment history',
+                panel: (_jsxs(_Fragment, { children: [_jsx(PaymentHistory, { subscriber: subscriber, invoices: (_a = paymentHistoryQuery.data) !== null && _a !== void 0 ? _a : [], isLoading: paymentHistoryQuery.isPending, isError: paymentHistoryQuery.isError }), _jsx(OrderPurchases, {}), _jsx(HelpFooter, {})] })),
+            },
+        ];
+    }, [
+        subscriptionPanel,
+        subscriber,
+        paymentHistoryQuery.data,
+        paymentHistoryQuery.isPending,
+        paymentHistoryQuery.isError,
+    ]);
+    if (isLoading) {
+        return (_jsx("div", { className: "manage-page manage-page--loading d-flex justify-content-center align-items-center", children: _jsx(Spinner, { animation: "border", screenReaderText: formatMessage(messages['order-history.loading']) }) }));
+    }
+    if (isError) {
+        return (_jsx("div", { className: "manage-page", children: _jsx(Container, { size: "lg", className: "manage-page__inner px-3 px-md-4 py-5", children: _jsx(Alert, { variant: "danger", children: formatMessage(messages['order-history.error']) }) }) }));
+    }
+    return (_jsxs("div", { className: "manage-page", children: [showRenewBanner && (_jsx("div", { className: "manage-renew-banner py-5 mb-2", children: _jsx(Container, { size: "lg", className: "px-3 px-md-4", children: _jsx("div", { className: "manage-renew-banner__inner d-flex flex-column align-items-start", children: _jsx(RenewBanner, { expireDate: renewalDate, onRenew: handleOpenRenewModal }) }) }) })), _jsxs(Container, { size: "lg", className: "manage-page__inner px-3 px-md-4 py-5", children: [_jsx(OrderHistoryHeader, {}), _jsx(Tabs, { id: "order-history-tabs", defaultActiveKey: (_j = orderHistoryTabs[0]) === null || _j === void 0 ? void 0 : _j.key, activeKey: activeTab, onSelect: handleTabSelect, className: "mb-4", mountOnEnter: true, children: orderHistoryTabs.map(tab => (_jsx(Tab, { eventKey: tab.key, title: tab.title, children: tab.panel }, tab.key))) })] }), _jsx(RenewSubscriptionModal, { isOpen: isRenewModalOpen, onClose: () => setIsRenewModalOpen(false), onConfirm: handleConfirmRenew, isConfirming: reactivateMutation.isPending, confirmError: reactivateMutation.isError, subscriptionBiId: subscriptionBiId, renewalDate: renewalDate, price: price, currency: currency, cycle: planCycle })] }));
+};
+export default OrderHistoryPage;
+//# sourceMappingURL=OrderHistoryPage.js.map

package/dist/orderHistory/OrderHistoryPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderHistoryPage.js","sourceRoot":"","sources":["../../src/orderHistory/OrderHistoryPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, {\n  useEffect,\n  useMemo,\n  useState,\n  useCallback,\n} from 'react';\nimport {\n  Alert,\n  Container,\n  Spinner,\n  Tabs,\n  Tab,\n} from '@openedx/paragon';\nimport { useIntl } from '@openedx/frontend-base';\nimport { useSearchParams } from 'react-router-dom';\n\nimport ActiveSubscription from '../components/ActiveSubscription/ActiveSubscription';\nimport BecomeSubscriber from '../components/BecomeSubscriber/BecomeSubscriber';\nimport CanceledSubscription, {\n  RenewBanner,\n} from '../components/CanceledSubscription/CanceledSubscription';\nimport HelpFooter from '../components/HelpFooter/HelpFooter';\nimport OrderHistoryHeader from '../components/OrderHistoryHeader/OrderHistoryHeader';\nimport OrderPurchases from '../components/OrderHistory/OrderPurchases';\nimport PaymentHistory from '../components/PaymentHistory/PaymentHistory';\nimport RenewSubscriptionModal from '../components/RenewSubscriptionModal/RenewSubscriptionModal';\nimport ResubscribeCard from '../components/ResubscribeCard/ResubscribeCard';\nimport messages from '../components/messages';\nimport {\n  useBillingPlansQuery,\n  useIsSubscriberQuery,\n  usePaymentHistoryQuery,\n  useReactivateSubscriptionMutation,\n  useViaxClient,\n  useViaxSession,\n} from '../data/hooks/useManageQueries';\nimport { getPaymentHistorySubscriptionIds } from '../data/services/subscription/getPaymentHistory';\nimport { getPlanPrice } from '../utils/billingDetails';\nimport { formatDisplayDate } from '../utils/formatDate';\nimport {\n  resolvePlanLabel,\n  resolveSubscriptionView,\n} from '../utils/subscriptionView';\n\nconst OrderHistoryPage: React.FC = () => {\n  const { formatMessage } = useIntl();\n  const [searchParams, setSearchParams] = useSearchParams();\n\n  const [isRenewModalOpen, setIsRenewModalOpen] = useState(false);\n\n  // Initialize active tab from URL.\n  const [activeTab, setActiveTab] = useState(\n    searchParams.get('tab') === 'payment-history'\n      ? 'payment-history'\n      : 'subscription',\n  );\n\n  const client = useViaxClient();\n\n  const {\n    sessionReady,\n    isSessionLoading,\n    isSessionError,\n  } = useViaxSession(client);\n\n  const subscriberQuery = useIsSubscriberQuery(client, sessionReady);\n  const billingPlansQuery = useBillingPlansQuery(client, sessionReady);\n  const reactivateMutation = useReactivateSubscriptionMutation(client);\n\n  const subscriptionBiId = subscriberQuery.data?.subscriptionBiId ?? null;\n\n  const paymentHistoryQuery = usePaymentHistoryQuery(\n    client,\n    sessionReady,\n    getPaymentHistorySubscriptionIds(subscriberQuery.data),\n  );\n\n  const subscriber = subscriberQuery.data ?? null;\n\n  const planCycle = resolvePlanLabel(subscriber);\n\n  const planPrice = getPlanPrice(\n    billingPlansQuery.data?.plans ?? [],\n    planCycle,\n  );\n\n  const price = planPrice?.amount ?? null;\n  const currency = planPrice?.currency ?? null;\n\n  const renewalDate = formatDisplayDate(\n    subscriber?.currentPeriodEnd ?? subscriber?.subscriptionEndDate,\n  );\n\n  const handleOpenRenewModal = useCallback(() => {\n    if (!subscriptionBiId) {\n      return;\n    }\n\n    reactivateMutation.reset();\n    setIsRenewModalOpen(true);\n  }, [subscriptionBiId, reactivateMutation]);\n\n  const handleConfirmRenew = useCallback(() => {\n    if (!subscriptionBiId || reactivateMutation.isPending) {\n      return;\n    }\n\n    reactivateMutation.mutate(subscriptionBiId);\n  }, [subscriptionBiId, reactivateMutation]);\n\n  useEffect(() => {\n    if (reactivateMutation.isSuccess) {\n      setIsRenewModalOpen(false);\n    }\n  }, [reactivateMutation.isSuccess]);\n\n  // Synchronize active tab with URL changes.\n  useEffect(() => {\n    const tab = searchParams.get('tab');\n\n    setActiveTab(\n      tab === 'payment-history' ? 'payment-history' : 'subscription',\n    );\n  }, [searchParams]);\n\n  const handleTabSelect = useCallback((tabKey: string | null) => {\n    if (tabKey === 'subscription' || tabKey === 'payment-history') {\n      setActiveTab(tabKey);\n\n      setSearchParams(\n        tabKey === 'subscription' ? {} : { tab: tabKey },\n        { replace: true },\n      );\n    }\n  }, [setSearchParams]);\n\n  const isLoading = isSessionLoading || (sessionReady && subscriberQuery.isPending);\n  const isError = isSessionError || subscriberQuery.isError;\n\n  const resolvedView = resolveSubscriptionView(subscriber);\n  const showRenewBanner = resolvedView === 'canceled_access';\n\n  // Resolve subscription panel.\n  const subscriptionPanel = useMemo(() => {\n    switch (resolvedView) {\n      case 'active':\n        return <ActiveSubscription subscriber={subscriber} />;\n\n      case 'canceled_access':\n        return (\n          <CanceledSubscription\n            subscriber={subscriber}\n            onRenew={handleOpenRenewModal}\n          />\n        );\n\n      case 'canceled_expired':\n        return (\n          <ResubscribeCard\n            subscriber={subscriber}\n            price={price}\n            currency={currency}\n          />\n        );\n\n      case 'none':\n      default:\n        return (\n          <BecomeSubscriber\n            price={price}\n            currency={currency}\n          />\n        );\n    }\n  }, [\n    resolvedView,\n    subscriber,\n    price,\n    currency,\n    handleOpenRenewModal,\n  ]);\n\n  // Define tabs dynamically.\n  const orderHistoryTabs = useMemo(() => [\n    {\n      key: 'subscription',\n      title: 'Manage subscription',\n      panel: (\n        <>\n          {subscriptionPanel}\n          <HelpFooter />\n        </>\n      ),\n    },\n    {\n      key: 'payment-history',\n      title: 'Payment history',\n      panel: (\n        <>\n          <PaymentHistory\n            subscriber={subscriber}\n            invoices={paymentHistoryQuery.data ?? []}\n            isLoading={paymentHistoryQuery.isPending}\n            isError={paymentHistoryQuery.isError}\n          />\n          <OrderPurchases />\n          <HelpFooter />\n        </>\n      ),\n    },\n  ], [\n    subscriptionPanel,\n    subscriber,\n    paymentHistoryQuery.data,\n    paymentHistoryQuery.isPending,\n    paymentHistoryQuery.isError,\n  ]);\n\n  if (isLoading) {\n    return (\n      <div className=\"manage-page manage-page--loading d-flex justify-content-center align-items-center\">\n        <Spinner\n          animation=\"border\"\n          screenReaderText={formatMessage(messages['order-history.loading'])}\n        />\n      </div>\n    );\n  }\n\n  if (isError) {\n    return (\n      <div className=\"manage-page\">\n        <Container size=\"lg\" className=\"manage-page__inner px-3 px-md-4 py-5\">\n          <Alert variant=\"danger\">\n            {formatMessage(messages['order-history.error'])}\n          </Alert>\n        </Container>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"manage-page\">\n      {showRenewBanner && (\n        <div className=\"manage-renew-banner py-5 mb-2\">\n          <Container size=\"lg\" className=\"px-3 px-md-4\">\n            <div className=\"manage-renew-banner__inner d-flex flex-column align-items-start\">\n              <RenewBanner\n                expireDate={renewalDate}\n                onRenew={handleOpenRenewModal}\n              />\n            </div>\n          </Container>\n        </div>\n      )}\n\n      <Container size=\"lg\" className=\"manage-page__inner px-3 px-md-4 py-5\">\n        <OrderHistoryHeader />\n\n        <Tabs\n          id=\"order-history-tabs\"\n          defaultActiveKey={orderHistoryTabs[0]?.key}\n          activeKey={activeTab}\n          onSelect={handleTabSelect}\n          className=\"mb-4\"\n          mountOnEnter\n        >\n          {orderHistoryTabs.map(tab => (\n            <Tab\n              eventKey={tab.key}\n              title={tab.title}\n              key={tab.key}\n            >\n              {tab.panel}\n            </Tab>\n          ))}\n        </Tabs>\n      </Container>\n\n      <RenewSubscriptionModal\n        isOpen={isRenewModalOpen}\n        onClose={() => setIsRenewModalOpen(false)}\n        onConfirm={handleConfirmRenew}\n        isConfirming={reactivateMutation.isPending}\n        confirmError={reactivateMutation.isError}\n        subscriptionBiId={subscriptionBiId}\n        renewalDate={renewalDate}\n        price={price}\n        currency={currency}\n        cycle={planCycle}\n      />\n    </div>\n  );\n};\n\nexport default OrderHistoryPage;\n"]}

package/dist/routes.d.ts

@@ -1,7 +1,11 @@
-declare const routes: {
+declare const routes: ({
     id: string;
     path: string;
     loader: (args: any) => Promise<null>;
+    shouldRevalidate: ({ currentUrl, nextUrl }: {
+        currentUrl: any;
+        nextUrl: any;
+    }) => boolean;
     handle: {
         roles: string[];
     };
@@ -21,5 +25,22 @@ declare const routes: {
         }>;
         index?: undefined;
     })[];
-}[];
+} | {
+    id: string;
+    path: string;
+    loader: (args: any) => Promise<null>;
+    handle: {
+        roles: string[];
+    };
+    lazy(): Promise<{
+        Component: () => import("react/jsx-runtime").JSX.Element;
+    }>;
+    children: {
+        index: boolean;
+        lazy(): Promise<{
+            Component: () => import("react/jsx-runtime").JSX.Element;
+        }>;
+    }[];
+    shouldRevalidate?: undefined;
+})[];
 export default routes;

package/dist/routes.js

@@ -8,39 +8,37 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { authenticatedLoader, getAuthenticatedHttpClient, } from '@openedx/frontend-base';
-import { redirect } from 'react-router-dom';
 import { getSubsInitApiUrl } from './data/services/subs/urls';
 import { subscriptionManageRole } from './constants';
 import { setCommonTrackingProps, mapSubsInitToTrackingProps } from './tracking/trackingContext';
-// loader to check if the user has subscription access
-const subscriptionAccessLoader = () => __awaiter(void 0, void 0, void 0, function* () {
+// loader to set common tracking props from subscription init data
+let trackingInitialized = false;
+const subscriptionTrackingLoader = () => __awaiter(void 0, void 0, void 0, function* () {
+    if (trackingInitialized) {
+        return null;
+    }
     try {
         const { data } = yield getAuthenticatedHttpClient().get(getSubsInitApiUrl());
-        if (!(data === null || data === void 0 ? void 0 : data.userSubscription) || !data.userSubscription.isSubscriber) {
-            throw redirect('/learner-dashboard'); // redirect to learner dashboard if user does not have subscription access
-        }
         setCommonTrackingProps(mapSubsInitToTrackingProps(data));
-        return null;
+        trackingInitialized = true;
     }
-    catch (error) {
-        // Let redirect responses bubble up
-        if (error instanceof Response) {
-            throw error;
-        }
-        throw redirect('/learner-dashboard'); // redirect to learner dashboard if an error occurs
+    catch (_a) {
+        // Tracking failures must not block page load
     }
+    return null;
 });
-// composed loader that checks for authentication and subscription access
+// composed loader that checks for authentication and sets tracking props
 const protectedLoader = (args) => __awaiter(void 0, void 0, void 0, function* () {
     yield authenticatedLoader(args);
-    yield subscriptionAccessLoader();
+    yield subscriptionTrackingLoader();
     return null;
 });
 const routes = [
     {
         id: 'org.openedx.frontend.route.subscription.manage.main',
-        path: 'manage-subscription',
+        path: 'order-history',
         loader: protectedLoader,
+        shouldRevalidate: ({ currentUrl, nextUrl }) => currentUrl.pathname !== nextUrl.pathname,
         handle: {
             roles: [subscriptionManageRole],
         },
@@ -57,7 +55,7 @@ const routes = [
                 lazy() {
                     return __awaiter(this, void 0, void 0, function* () {
                         const module = yield import(
-                        /* webpackChunkName: "ManageSubscriptionPage" */ './manageSubscriptionPage/ManageSubscriptionPage');
+                        /* webpackChunkName: "OrderHistory" */ './orderHistory/OrderHistoryPage');
                         return { Component: module.default };
                     });
                 },
@@ -67,7 +65,7 @@ const routes = [
                 lazy() {
                     return __awaiter(this, void 0, void 0, function* () {
                         const module = yield import(
-                        /* webpackChunkName: "CancelSubscriptionPage" */ './manageSubscriptionPage/CancelSubscriptionPage');
+                        /* webpackChunkName: "CancelSubscriptionPage" */ './orderHistory/CancelSubscriptionPage');
                         return { Component: module.default };
                     });
                 },
@@ -77,7 +75,34 @@ const routes = [
                 lazy() {
                     return __awaiter(this, void 0, void 0, function* () {
                         const module = yield import(
-                        /* webpackChunkName: "CancelSuccessPage" */ './manageSubscriptionPage/CancelSuccessPage');
+                        /* webpackChunkName: "CancelSuccessPage" */ './orderHistory/CancelSuccessPage');
+                        return { Component: module.default };
+                    });
+                },
+            },
+        ],
+    },
+    {
+        id: 'org.openedx.frontend.route.subscription.manage.order-details',
+        path: 'order-details/:orderNumber',
+        loader: protectedLoader,
+        handle: {
+            roles: [subscriptionManageRole],
+        },
+        lazy() {
+            return __awaiter(this, void 0, void 0, function* () {
+                const module = yield import(
+                /* webpackChunkName: "subscription-manage-main" */ './Main');
+                return { Component: module.default };
+            });
+        },
+        children: [
+            {
+                index: true,
+                lazy() {
+                    return __awaiter(this, void 0, void 0, function* () {
+                        const module = yield import(
+                        /* webpackChunkName: "OrderHistoryDetails" */ './components/OrderHistory/OrderHistoryDetails');
                         return { Component: module.default };
                     });
                 },

package/dist/routes.js.map

@@ -1 +1 @@
-{"version":3,"file":"routes.js","sourceRoot":"","sources":["../src/routes.tsx"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EACL,mBAAmB,EACnB,0BAA0B,GAC3B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AACrD,OAAO,EAAE,sBAAsB,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAC;AAEhG,sDAAsD;AACtD,MAAM,wBAAwB,GAAG,GAAS,EAAE;IAC1C,IAAI,CAAC;QACH,MAAM,EAAE,IAAI,EAAE,GACV,MAAM,0BAA0B,EAAE,CAAC,GAAG,CAAC,iBAAiB,EAAE,CAAC,CAAC;QAEhE,IAAI,CAAC,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,CAAA,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,YAAY,EAAE,CAAC;YACnE,MAAM,QAAQ,CAAC,oBAAoB,CAAC,CAAC,CAAC,0EAA0E;QAClH,CAAC;QAED,sBAAsB,CAAC,0BAA0B,CAAC,IAAI,CAAC,CAAC,CAAC;QACzD,OAAO,IAAI,CAAC;IACd,CAAC;IAAC,OAAO,KAAK,EAAE,CAAC;QACf,mCAAmC;QACnC,IAAI,KAAK,YAAY,QAAQ,EAAE,CAAC;YAC9B,MAAM,KAAK,CAAC;QACd,CAAC;QAED,MAAM,QAAQ,CAAC,oBAAoB,CAAC,CAAC,CAAC,mDAAmD;IAC3F,CAAC;AACH,CAAC,CAAA,CAAC;AAEF,yEAAyE;AACzE,MAAM,eAAe,GAAG,CAAO,IAAI,EAAE,EAAE;IACrC,MAAM,mBAAmB,CAAC,IAAI,CAAC,CAAC;IAChC,MAAM,wBAAwB,EAAE,CAAC;IAEjC,OAAO,IAAI,CAAC;AACd,CAAC,CAAA,CAAC;AAEF,MAAM,MAAM,GAAG;IACb;QACE,EAAE,EAAE,qDAAqD;QACzD,IAAI,EAAE,qBAAqB;QAC3B,MAAM,EAAE,eAAe;QACvB,MAAM,EAAE;YACN,KAAK,EAAE,CAAC,sBAAsB,CAAC;SAChC;QACK,IAAI;;gBACR,MAAM,MAAM,GAAG,MAAM,MAAM;gBACzB,kDAAkD,CAAC,QAAQ,CAC5D,CAAC;gBACF,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,OAAO,EAAE,CAAC;YACvC,CAAC;SAAA;QACD,QAAQ,EAAE;YACR;gBACE,KAAK,EAAE,IAAI;gBACL,IAAI;;wBACR,MAAM,MAAM,GAAG,MAAM,MAAM;wBACzB,gDAAgD,CAAC,iDAAiD,CACnG,CAAC;wBACF,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,OAAO,EAAE,CAAC;oBACvC,CAAC;iBAAA;aACF;YACD;gBACE,IAAI,EAAE,QAAQ;gBACR,IAAI;;wBACR,MAAM,MAAM,GAAG,MAAM,MAAM;wBACzB,gDAAgD,CAAC,iDAAiD,CACnG,CAAC;wBACF,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,OAAO,EAAE,CAAC;oBACvC,CAAC;iBAAA;aACF;YACD;gBACE,IAAI,EAAE,gBAAgB;gBAChB,IAAI;;wBACR,MAAM,MAAM,GAAG,MAAM,MAAM;wBACzB,2CAA2C,CAAC,4CAA4C,CACzF,CAAC;wBACF,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,OAAO,EAAE,CAAC;oBACvC,CAAC;iBAAA;aACF;SACF;KACF;CACF,CAAC;AAEF,eAAe,MAAM,CAAC","sourcesContent":["import {\n  authenticatedLoader,\n  getAuthenticatedHttpClient,\n} from '@openedx/frontend-base';\nimport { redirect } from 'react-router-dom';\n\nimport { getSubsInitApiUrl } from './data/services/subs/urls';\nimport { subscriptionManageRole } from './constants';\nimport { setCommonTrackingProps, mapSubsInitToTrackingProps } from './tracking/trackingContext';\n\n// loader to check if the user has subscription access\nconst subscriptionAccessLoader = async () => {\n  try {\n    const { data }\n      = await getAuthenticatedHttpClient().get(getSubsInitApiUrl());\n\n    if (!data?.userSubscription || !data.userSubscription.isSubscriber) {\n      throw redirect('/learner-dashboard'); // redirect to learner dashboard if user does not have subscription access\n    }\n\n    setCommonTrackingProps(mapSubsInitToTrackingProps(data));\n    return null;\n  } catch (error) {\n    // Let redirect responses bubble up\n    if (error instanceof Response) {\n      throw error;\n    }\n\n    throw redirect('/learner-dashboard'); // redirect to learner dashboard if an error occurs\n  }\n};\n\n// composed loader that checks for authentication and subscription access\nconst protectedLoader = async (args) => {\n  await authenticatedLoader(args);\n  await subscriptionAccessLoader();\n\n  return null;\n};\n\nconst routes = [\n  {\n    id: 'org.openedx.frontend.route.subscription.manage.main',\n    path: 'manage-subscription',\n    loader: protectedLoader,\n    handle: {\n      roles: [subscriptionManageRole],\n    },\n    async lazy() {\n      const module = await import(\n        /* webpackChunkName: \"subscription-manage-main\" */ './Main'\n      );\n      return { Component: module.default };\n    },\n    children: [\n      {\n        index: true,\n        async lazy() {\n          const module = await import(\n            /* webpackChunkName: \"ManageSubscriptionPage\" */ './manageSubscriptionPage/ManageSubscriptionPage'\n          );\n          return { Component: module.default };\n        },\n      },\n      {\n        path: 'cancel',\n        async lazy() {\n          const module = await import(\n            /* webpackChunkName: \"CancelSubscriptionPage\" */ './manageSubscriptionPage/CancelSubscriptionPage'\n          );\n          return { Component: module.default };\n        },\n      },\n      {\n        path: 'cancel/success',\n        async lazy() {\n          const module = await import(\n            /* webpackChunkName: \"CancelSuccessPage\" */ './manageSubscriptionPage/CancelSuccessPage'\n          );\n          return { Component: module.default };\n        },\n      },\n    ],\n  },\n];\n\nexport default routes;\n"]}
+{"version":3,"file":"routes.js","sourceRoot":"","sources":["../src/routes.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  authenticatedLoader,\n  getAuthenticatedHttpClient,\n} from '@openedx/frontend-base';\n\nimport { getSubsInitApiUrl } from './data/services/subs/urls';\nimport { subscriptionManageRole } from './constants';\nimport { setCommonTrackingProps, mapSubsInitToTrackingProps } from './tracking/trackingContext';\n\n// loader to set common tracking props from subscription init data\nlet trackingInitialized = false;\nconst subscriptionTrackingLoader = async () => {\n  if (trackingInitialized) {\n    return null;\n  }\n  try {\n    const { data } = await getAuthenticatedHttpClient().get(getSubsInitApiUrl());\n    setCommonTrackingProps(mapSubsInitToTrackingProps(data));\n    trackingInitialized = true;\n  } catch {\n    // Tracking failures must not block page load\n  }\n\n  return null;\n};\n\n// composed loader that checks for authentication and sets tracking props\nconst protectedLoader = async (args) => {\n  await authenticatedLoader(args);\n  await subscriptionTrackingLoader();\n\n  return null;\n};\n\nconst routes = [\n  {\n    id: 'org.openedx.frontend.route.subscription.manage.main',\n    path: 'order-history',\n    loader: protectedLoader,\n    shouldRevalidate: ({ currentUrl, nextUrl }) => currentUrl.pathname !== nextUrl.pathname,\n    handle: {\n      roles: [subscriptionManageRole],\n    },\n    async lazy() {\n      const module = await import(\n        /* webpackChunkName: \"subscription-manage-main\" */ './Main'\n      );\n      return { Component: module.default };\n    },\n    children: [\n      {\n        index: true,\n        async lazy() {\n          const module = await import(\n            /* webpackChunkName: \"OrderHistory\" */ './orderHistory/OrderHistoryPage'\n          );\n          return { Component: module.default };\n        },\n      },\n      {\n        path: 'cancel',\n        async lazy() {\n          const module = await import(\n            /* webpackChunkName: \"CancelSubscriptionPage\" */ './orderHistory/CancelSubscriptionPage'\n          );\n          return { Component: module.default };\n        },\n      },\n      {\n        path: 'cancel/success',\n        async lazy() {\n          const module = await import(\n            /* webpackChunkName: \"CancelSuccessPage\" */ './orderHistory/CancelSuccessPage'\n          );\n          return { Component: module.default };\n        },\n      },\n    ],\n  },\n  {\n    id: 'org.openedx.frontend.route.subscription.manage.order-details',\n    path: 'order-details/:orderNumber',\n    loader: protectedLoader,\n    handle: {\n      roles: [subscriptionManageRole],\n    },\n    async lazy() {\n      const module = await import(\n        /* webpackChunkName: \"subscription-manage-main\" */ './Main'\n      );\n      return { Component: module.default };\n    },\n    children: [\n      {\n        index: true,\n        async lazy() {\n          const module = await import(\n            /* webpackChunkName: \"OrderHistoryDetails\" */ './components/OrderHistory/OrderHistoryDetails'\n          );\n          return { Component: module.default };\n        },\n      },\n    ],\n  },\n];\n\nexport default routes;\n"]}

package/dist/style.scss

@@ -1,4 +1,4 @@
-@use "./styles/components/manageSubscription.scss";
+@use "./styles/components/orderHistory.scss";
 
 button.btn.btn-outline:has(svg) {
     display: none !important;

package/dist/styles/components/{manageSubscription.scss → orderHistory.scss}

@@ -19,30 +19,6 @@
   min-height: 50vh;
 }
 
-/* Tabs — custom 3px underline active state */
-.manage-tabs {
-  gap: 1.5rem;
-}
-
-.manage-tabs__tab {
-  appearance: none;
-  background: none;
-  border: 0;
-  border-bottom: 3px solid transparent;
-  color: var(--manage-muted);
-  cursor: pointer;
-  font-size: 1rem;
-  font-weight: 500;
-  margin-bottom: -1px;
-  padding: 0.75rem 0;
-}
-
-.manage-tabs__tab--active {
-  color: var(--manage-title);
-  font-weight: 700;
-  border-bottom-color: var(--manage-title);
-}
-
 /* Cards — gap only (no gap utility) */
 .manage-card,
 .manage-card__actions,
@@ -452,3 +428,63 @@
   height: 1.125rem;
   flex-shrink: 0;
 }
+
+.orderHistory {
+  padding-inline: 7.5rem;
+
+  @media (max-width: 1024px) {
+    padding-inline: 3rem;
+  }
+
+  @media (max-width: 767px) {
+    padding-inline: 1.5rem;
+  }
+}
+
+.orderHistoryTitle {
+  font-weight: 800;
+}
+
+.refund-notice {
+  background-color: #fff;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.15);
+  border-radius: 4px;
+}
+
+.refundTitle {
+  font-size: 22px;
+}
+
+.refundBody {
+  font-size: 18px;
+}
+
+.orderHistoryCard {
+
+  &__details {
+    font-weight: 700;
+  }
+
+  &__link {
+    color: #002B2B;
+  }
+}
+
+.programItemsTable {
+  .pgn__data-table thead th {
+    background-color: #F2F0EF;
+    color: #000000;
+  }
+
+  .pgn__data-table tbody tr:nth-child(even) {
+    background-color: #FBFAF9;
+  }
+
+  .pgn__data-table tbody tr {
+    color: #000000;
+  }
+}
+
+.divider {
+  border-top: 1px solid #002B2B;
+}

package/dist/tracking/trackingContext.d.ts

@@ -5,7 +5,7 @@ export interface CommonTrackingProps {
     subscription_start_date?: string | null;
     subscription_end_date?: string | null;
     current_period_end?: string | null;
-    paymentMethod?: string | null;
+    payment_method?: string | null;
     user_email?: string | null;
     session_id?: string | null;
     experimentation?: string | null;

package/dist/tracking/trackingContext.js

@@ -14,7 +14,7 @@ export const mapSubsInitToTrackingProps = (data) => {
         subscription_start_date: (_e = (_d = data === null || data === void 0 ? void 0 : data.userSubscription) === null || _d === void 0 ? void 0 : _d.subscriptionStartDate) !== null && _e !== void 0 ? _e : null,
         subscription_end_date: (_g = (_f = data === null || data === void 0 ? void 0 : data.userSubscription) === null || _f === void 0 ? void 0 : _f.subscriptionEndDate) !== null && _g !== void 0 ? _g : null,
         current_period_end: (_j = (_h = data === null || data === void 0 ? void 0 : data.userSubscription) === null || _h === void 0 ? void 0 : _h.currentPeriodEnd) !== null && _j !== void 0 ? _j : null,
-        paymentMethod: (_l = (_k = data === null || data === void 0 ? void 0 : data.userSubscription) === null || _k === void 0 ? void 0 : _k.paymentMethod) !== null && _l !== void 0 ? _l : null,
+        payment_method: (_l = (_k = data === null || data === void 0 ? void 0 : data.userSubscription) === null || _k === void 0 ? void 0 : _k.paymentMethod) !== null && _l !== void 0 ? _l : null,
         user_email: (_o = (_m = getAuthenticatedUser()) === null || _m === void 0 ? void 0 : _m.email) !== null && _o !== void 0 ? _o : null,
         session_id: '',
         experimentation: '',

package/dist/tracking/trackingContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"trackingContext.js","sourceRoot":"","sources":["../../src/tracking/trackingContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAkB9D,IAAI,WAAW,GAAwB,EAAE,CAAC;AAE1C,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,KAA0B,EAAE,EAAE;IACnE,WAAW,mCAAQ,WAAW,GAAK,KAAK,CAAE,CAAC;AAC7C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAwB,EAAE,CAAC,WAAW,CAAC;AAE7E,sEAAsE;AACtE,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,IAAS,EAAuB,EAAE;;IAAC,OAAA,CAAC;QAC7E,iBAAiB,EAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,WAAW;QACtD,mBAAmB,EAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,MAAM;QACnD,iBAAiB,EAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,gBAAgB;QAC3D,uBAAuB,EAAE,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,qBAAqB,mCAAI,IAAI;QAC9E,qBAAqB,EAAE,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,mBAAmB,mCAAI,IAAI;QAC1E,kBAAkB,EAAE,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,gBAAgB,mCAAI,IAAI;QACpE,aAAa,EAAE,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,aAAa,mCAAI,IAAI;QAC5D,UAAU,EAAE,MAAA,MAAA,oBAAoB,EAAE,0CAAE,KAAK,mCAAI,IAAI;QACjD,UAAU,EAAE,EAAE;QACd,eAAe,EAAE,EAAE;QACnB,WAAW,EAAE,EAAE;QACf,MAAM,EAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,mCAAI,IAAI;QAC5B,eAAe,EAAE,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,gBAAgB,mCAAI,IAAI;KAClE,CAAC,CAAA;CAAA,CAAC","sourcesContent":["import { getAuthenticatedUser } from '@openedx/frontend-base';\n\nexport interface CommonTrackingProps {\n  free_trial_status?: string,\n  subscription_status?: string,\n  subscription_tier?: string,\n  subscription_start_date?: string | null,\n  subscription_end_date?: string | null,\n  current_period_end?: string | null,\n  paymentMethod?: string | null,\n  user_email?: string | null,\n  session_id?: string | null,\n  experimentation?: string | null,\n  device_type?: string | null,\n  opt_in?: boolean | null,\n  isUserSuspended?: boolean | null | undefined,\n}\n\nlet commonProps: CommonTrackingProps = {};\n\nexport const setCommonTrackingProps = (props: CommonTrackingProps) => {\n  commonProps = { ...commonProps, ...props };\n};\n\nexport const getCommonTrackingProps = (): CommonTrackingProps => commonProps;\n\n// Single place that maps the subs/init API response -> tracking props\nexport const mapSubsInitToTrackingProps = (data: any): CommonTrackingProps => ({\n  free_trial_status: data?.userSubscription?.trialActive,\n  subscription_status: data?.userSubscription?.status,\n  subscription_tier: data?.userSubscription?.billingFrequency,\n  subscription_start_date: data?.userSubscription?.subscriptionStartDate ?? null,\n  subscription_end_date: data?.userSubscription?.subscriptionEndDate ?? null,\n  current_period_end: data?.userSubscription?.currentPeriodEnd ?? null,\n  paymentMethod: data?.userSubscription?.paymentMethod ?? null,\n  user_email: getAuthenticatedUser()?.email ?? null,\n  session_id: '',\n  experimentation: '',\n  device_type: '',\n  opt_in: data?.opt_in ?? null,\n  isUserSuspended: data?.userSubscription?.tIsUserSuspended ?? null,\n});\n"]}
+{"version":3,"file":"trackingContext.js","sourceRoot":"","sources":["../../src/tracking/trackingContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAkB9D,IAAI,WAAW,GAAwB,EAAE,CAAC;AAE1C,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,KAA0B,EAAE,EAAE;IACnE,WAAW,mCAAQ,WAAW,GAAK,KAAK,CAAE,CAAC;AAC7C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAwB,EAAE,CAAC,WAAW,CAAC;AAE7E,sEAAsE;AACtE,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,IAAS,EAAuB,EAAE;;IAAC,OAAA,CAAC;QAC7E,iBAAiB,EAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,WAAW;QACtD,mBAAmB,EAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,MAAM;QACnD,iBAAiB,EAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,gBAAgB;QAC3D,uBAAuB,EAAE,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,qBAAqB,mCAAI,IAAI;QAC9E,qBAAqB,EAAE,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,mBAAmB,mCAAI,IAAI;QAC1E,kBAAkB,EAAE,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,gBAAgB,mCAAI,IAAI;QACpE,cAAc,EAAE,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,aAAa,mCAAI,IAAI;QAC7D,UAAU,EAAE,MAAA,MAAA,oBAAoB,EAAE,0CAAE,KAAK,mCAAI,IAAI;QACjD,UAAU,EAAE,EAAE;QACd,eAAe,EAAE,EAAE;QACnB,WAAW,EAAE,EAAE;QACf,MAAM,EAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,mCAAI,IAAI;QAC5B,eAAe,EAAE,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,0CAAE,gBAAgB,mCAAI,IAAI;KAClE,CAAC,CAAA;CAAA,CAAC","sourcesContent":["import { getAuthenticatedUser } from '@openedx/frontend-base';\n\nexport interface CommonTrackingProps {\n  free_trial_status?: string,\n  subscription_status?: string,\n  subscription_tier?: string,\n  subscription_start_date?: string | null,\n  subscription_end_date?: string | null,\n  current_period_end?: string | null,\n  payment_method?: string | null,\n  user_email?: string | null,\n  session_id?: string | null,\n  experimentation?: string | null,\n  device_type?: string | null,\n  opt_in?: boolean | null,\n  isUserSuspended?: boolean | null | undefined,\n}\n\nlet commonProps: CommonTrackingProps = {};\n\nexport const setCommonTrackingProps = (props: CommonTrackingProps) => {\n  commonProps = { ...commonProps, ...props };\n};\n\nexport const getCommonTrackingProps = (): CommonTrackingProps => commonProps;\n\n// Single place that maps the subs/init API response -> tracking props\nexport const mapSubsInitToTrackingProps = (data: any): CommonTrackingProps => ({\n  free_trial_status: data?.userSubscription?.trialActive,\n  subscription_status: data?.userSubscription?.status,\n  subscription_tier: data?.userSubscription?.billingFrequency,\n  subscription_start_date: data?.userSubscription?.subscriptionStartDate ?? null,\n  subscription_end_date: data?.userSubscription?.subscriptionEndDate ?? null,\n  current_period_end: data?.userSubscription?.currentPeriodEnd ?? null,\n  payment_method: data?.userSubscription?.paymentMethod ?? null,\n  user_email: getAuthenticatedUser()?.email ?? null,\n  session_id: '',\n  experimentation: '',\n  device_type: '',\n  opt_in: data?.opt_in ?? null,\n  isUserSuspended: data?.userSubscription?.tIsUserSuspended ?? null,\n});\n"]}

package/dist/types.d.ts

@@ -102,3 +102,58 @@ export interface BillingPlan {
 export interface BillingPlansResult {
     plans: BillingPlan[];
 }
+/** One course line on a program purchase receipt. */
+export interface PurchaseHistoryCourse {
+    courseId: string;
+    name: string;
+    price: number;
+    discountAmount: number;
+}
+/** One-off course or program purchase from `tOrderHistory.orders`. */
+export interface PurchaseHistoryItem {
+    orderId: string;
+    orderNumber: string;
+    purchasedAt: string;
+    paymentIntentId?: string;
+    paymentMethodType?: string;
+    name: string;
+    total: {
+        amount: number;
+        currency: string;
+    };
+    /** Set when the payload reports a program purchase. */
+    itemType?: 'course' | 'program';
+    courses?: PurchaseHistoryCourse[];
+}
+export interface OrdersListProps {
+    orders: PurchaseHistoryItem[];
+    onViewReceipt?: (order: PurchaseHistoryItem) => void;
+}
+export interface MoneyAmount {
+    amount: number;
+    currency: string;
+}
+/** One line on a program order details payload. */
+export interface OrderProgramItem {
+    productId?: string;
+    courseRunKey?: string;
+    name: string;
+    price?: MoneyAmount;
+    discount?: MoneyAmount;
+    total?: MoneyAmount;
+}
+/** Normalized `tOrderDetails` payload for the order details page. */
+export interface OrderDetailsData {
+    orderId: string;
+    orderNumber: string;
+    purchasedAt: string;
+    paymentIntentId: string;
+    name: string;
+    subtotalAmount?: MoneyAmount;
+    itemPriceAmount?: MoneyAmount;
+    discountCode?: string | null;
+    total: MoneyAmount;
+    discountAmount?: MoneyAmount;
+    itemType: 'course' | 'program';
+    items?: OrderProgramItem[];
+}

package/dist/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;GAEG","sourcesContent":["/**\n * Manage Subscription — domain types for Viax subscriber + enrollment data.\n */\n\n/** GraphQL runner used by VIAX fetchers. */\nexport type GqlRunner = (\n  query: string,\n  variables?: Record<string, unknown>,\n) => Promise<any>;\n\n/** Result of `tIsCurrentUserSubscriber` (JSON scalar). */\nexport interface CurrentUserSubscriberResult {\n  /** Has/expects access — drive manage vs upsell messaging. */\n  isSubscriber: boolean,\n  /** Enrollable right now (ACTIVE / TRIAL_ACTIVE). */\n  canEnroll: boolean,\n  subscriptionBiId: string | null,\n  /**\n   * Every subscription the learner has held (all statuses, newest first),\n   * e.g. a cancelled Stripe one plus a newer PayPal one. Payment history\n   * lists invoices across all of them. Empty until the API returns it.\n   */\n  subscriptionBiIds?: string[],\n  status: string | null,\n  currentPeriodEnd: string | null,\n  subscriptionStartDate: string | null,\n  subscriptionEndDate: string | null,\n  /**\n   * Billing cycle / plan label used by UI (from `billingFrequency`,\n   * `renewalType`, or `planName` on the API payload).\n   */\n  renewalType?: string | null,\n  /** Optional cancel timestamp when present. */\n  canceledAt?: string | null,\n  /** Optional price display amount when present. */\n  amount?: string | null,\n  currency?: string | null,\n  /**\n   * Billing-plan fallback fields used when `renewalType` is missing\n   * (e.g. PayPal payloads). See `resolvePlanLabel`.\n   */\n  billingPlanUid?: string | null,\n  interval?: string | null,\n  billingInterval?: string | null,\n  bipOwnershipModel?: { uid?: string, omName?: string } | null,\n}\n\n/** Normalized enrollment for the cancel confirmation course list. */\nexport interface SubscriptionEnrollment {\n  biId: string,\n  courseMaId: string | null,\n  courseName: string | null,\n  courseSlug: string | null,\n  /** Course card / thumbnail image. */\n  imageUrl: string | null,\n  orgName: string | null,\n  orgLogoUrl: string | null,\n  courseRunKey: string | null,\n  /** TwouEnrollment bpStatus.code (ACTIVE, COMPLETED, …). */\n  status: string | null,\n  /** True when the enrollment has a certificate id and/or URL. */\n  hasCertificate: boolean,\n  /** Absolute certificate link (`COURSES_BASE_URL` + `tCertificateUrl`). */\n  certificateUrl: string | null,\n}\n\nexport type PaymentProcessor = 'stripe' | 'paypal';\n\n/** Normalized invoice row for the Payment history tab. */\nexport interface PaymentHistoryItem {\n  biId: string,\n  /** Display order number, e.g. EDX-BI3X25N5SY30OSIK */\n  orderNumber: string,\n  stripeInvoiceId: string | null,\n  /** PayPal sale id, or `trial:<PayPal subscription id>` for a $0 trial row. */\n  paypalInvoiceId: string | null,\n  /** Which processor billed this invoice; null when neither id is set. */\n  paymentProcessor: PaymentProcessor | null,\n  status: string | null,\n  billDate: string | null,\n  periodStart: string | null,\n  periodEnd: string | null,\n  /** Charged amount in major currency units (e.g. 59.00). */\n  amount: number,\n  currency: string,\n  isTrial: boolean,\n}\n\n/** UI view derived from subscriber status. */\nexport type SubscriptionView =\n  | 'none'\n  | 'active'\n  | 'canceled_access'\n  | 'canceled_expired';\n\nexport type ManageTab = 'subscription' | 'payment-history';\n\nexport type BillingCycle = 'monthly' | 'annual';\n\nexport interface BillingPlanOwnershipModel {\n  uid: string,\n  omName: string,\n}\n\n/** Normalized row from `filterCustomerBillingPlan`. */\nexport interface BillingPlan {\n  uid: string,\n  stripePriceId: string,\n  /** Price amount e.g. \"39.99\" */\n  amount: string,\n  /** Currency code e.g. \"USD\" */\n  currency: string,\n  isTemplate: boolean,\n  ownershipModel: BillingPlanOwnershipModel,\n}\n\nexport interface BillingPlansResult {\n  plans: BillingPlan[],\n}\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;GAEG","sourcesContent":["/**\n * Manage Subscription — domain types for Viax subscriber + enrollment data.\n */\n\n/** GraphQL runner used by VIAX fetchers. */\nexport type GqlRunner = (\n  query: string,\n  variables?: Record<string, unknown>,\n) => Promise<any>;\n\n/** Result of `tIsCurrentUserSubscriber` (JSON scalar). */\nexport interface CurrentUserSubscriberResult {\n  /** Has/expects access — drive manage vs upsell messaging. */\n  isSubscriber: boolean,\n  /** Enrollable right now (ACTIVE / TRIAL_ACTIVE). */\n  canEnroll: boolean,\n  subscriptionBiId: string | null,\n  /**\n   * Every subscription the learner has held (all statuses, newest first),\n   * e.g. a cancelled Stripe one plus a newer PayPal one. Payment history\n   * lists invoices across all of them. Empty until the API returns it.\n   */\n  subscriptionBiIds?: string[],\n  status: string | null,\n  currentPeriodEnd: string | null,\n  subscriptionStartDate: string | null,\n  subscriptionEndDate: string | null,\n  /**\n   * Billing cycle / plan label used by UI (from `billingFrequency`,\n   * `renewalType`, or `planName` on the API payload).\n   */\n  renewalType?: string | null,\n  /** Optional cancel timestamp when present. */\n  canceledAt?: string | null,\n  /** Optional price display amount when present. */\n  amount?: string | null,\n  currency?: string | null,\n  /**\n   * Billing-plan fallback fields used when `renewalType` is missing\n   * (e.g. PayPal payloads). See `resolvePlanLabel`.\n   */\n  billingPlanUid?: string | null,\n  interval?: string | null,\n  billingInterval?: string | null,\n  bipOwnershipModel?: { uid?: string, omName?: string } | null,\n}\n\n/** Normalized enrollment for the cancel confirmation course list. */\nexport interface SubscriptionEnrollment {\n  biId: string,\n  courseMaId: string | null,\n  courseName: string | null,\n  courseSlug: string | null,\n  /** Course card / thumbnail image. */\n  imageUrl: string | null,\n  orgName: string | null,\n  orgLogoUrl: string | null,\n  courseRunKey: string | null,\n  /** TwouEnrollment bpStatus.code (ACTIVE, COMPLETED, …). */\n  status: string | null,\n  /** True when the enrollment has a certificate id and/or URL. */\n  hasCertificate: boolean,\n  /** Absolute certificate link (`COURSES_BASE_URL` + `tCertificateUrl`). */\n  certificateUrl: string | null,\n}\n\nexport type PaymentProcessor = 'stripe' | 'paypal';\n\n/** Normalized invoice row for the Payment history tab. */\nexport interface PaymentHistoryItem {\n  biId: string,\n  /** Display order number, e.g. EDX-BI3X25N5SY30OSIK */\n  orderNumber: string,\n  stripeInvoiceId: string | null,\n  /** PayPal sale id, or `trial:<PayPal subscription id>` for a $0 trial row. */\n  paypalInvoiceId: string | null,\n  /** Which processor billed this invoice; null when neither id is set. */\n  paymentProcessor: PaymentProcessor | null,\n  status: string | null,\n  billDate: string | null,\n  periodStart: string | null,\n  periodEnd: string | null,\n  /** Charged amount in major currency units (e.g. 59.00). */\n  amount: number,\n  currency: string,\n  isTrial: boolean,\n}\n\n/** UI view derived from subscriber status. */\nexport type SubscriptionView =\n  | 'none'\n  | 'active'\n  | 'canceled_access'\n  | 'canceled_expired';\n\nexport type ManageTab = 'subscription' | 'payment-history';\n\nexport type BillingCycle = 'monthly' | 'annual';\n\nexport interface BillingPlanOwnershipModel {\n  uid: string,\n  omName: string,\n}\n\n/** Normalized row from `filterCustomerBillingPlan`. */\nexport interface BillingPlan {\n  uid: string,\n  stripePriceId: string,\n  /** Price amount e.g. \"39.99\" */\n  amount: string,\n  /** Currency code e.g. \"USD\" */\n  currency: string,\n  isTemplate: boolean,\n  ownershipModel: BillingPlanOwnershipModel,\n}\n\nexport interface BillingPlansResult {\n  plans: BillingPlan[],\n}\n\n/** One course line on a program purchase receipt. */\nexport interface PurchaseHistoryCourse {\n  courseId: string,\n  name: string,\n  price: number,\n  discountAmount: number,\n}\n\n/** One-off course or program purchase from `tOrderHistory.orders`. */\nexport interface PurchaseHistoryItem {\n  orderId: string,\n  orderNumber: string,\n  purchasedAt: string,\n  paymentIntentId?: string,\n  paymentMethodType?: string,\n  name: string,\n  total: {\n    amount: number,\n    currency: string,\n  },\n  /** Set when the payload reports a program purchase. */\n  itemType?: 'course' | 'program',\n  courses?: PurchaseHistoryCourse[],\n}\n\nexport interface OrdersListProps {\n  orders: PurchaseHistoryItem[],\n  onViewReceipt?: (order: PurchaseHistoryItem) => void,\n}\n\nexport interface MoneyAmount {\n  amount: number,\n  currency: string,\n}\n\n/** One line on a program order details payload. */\nexport interface OrderProgramItem {\n  productId?: string,\n  courseRunKey?: string,\n  name: string,\n  price?: MoneyAmount,\n  discount?: MoneyAmount,\n  total?: MoneyAmount,\n}\n\n/** Normalized `tOrderDetails` payload for the order details page. */\nexport interface OrderDetailsData {\n  orderId: string,\n  orderNumber: string,\n  purchasedAt: string,\n  paymentIntentId: string,\n  name: string,\n  subtotalAmount?: MoneyAmount,\n  itemPriceAmount?: MoneyAmount,\n  discountCode?: string | null,\n  total: MoneyAmount,\n  discountAmount?: MoneyAmount,\n  itemType: 'course' | 'program',\n  items?: OrderProgramItem[],\n}\n"]}

package/dist/utils/currency.d.ts

@@ -0,0 +1,6 @@
+interface OrderTotal {
+    amount: number;
+    currency: string;
+}
+declare const getFormattedCurrency: ({ amount, currency }: OrderTotal) => string;
+export default getFormattedCurrency;

package/dist/utils/currency.js

@@ -0,0 +1,6 @@
+const getFormattedCurrency = ({ amount, currency }) => new Intl.NumberFormat('en-US', {
+    style: 'currency',
+    currency,
+}).format(amount);
+export default getFormattedCurrency;
+//# sourceMappingURL=currency.js.map

package/dist/utils/currency.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"currency.js","sourceRoot":"","sources":["../../src/utils/currency.ts"],"names":[],"mappings":"AAKA,MAAM,oBAAoB,GAAG,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAc,EAAU,EAAE,CACxE,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE;IAC7B,KAAK,EAAE,UAAU;IACjB,QAAQ;CACT,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;AAEpB,eAAe,oBAAoB,CAAC","sourcesContent":["interface OrderTotal {\n  amount: number,\n  currency: string,\n}\n\nconst getFormattedCurrency = ({ amount, currency }: OrderTotal): string =>\n  new Intl.NumberFormat('en-US', {\n    style: 'currency',\n    currency,\n  }).format(amount);\n\nexport default getFormattedCurrency;\n"]}

package/dist/utils/queries.d.ts

@@ -44,3 +44,9 @@ export declare const VALIDATE_CART_PAYMENT_METHOD = "mutation ValidateCartPaymen
  * Attach a new Stripe payment method (pm_…) as the subscription default.
  */
 export declare const UPDATE_SUBSCRIPTION_PAYMENT_METHOD = "mutation UpdateSubscriptionPaymentMethod(\n  $biId: String!\n  $tStripePaymentMethodId: String!\n) {\n  tUpdateSubscriptionPaymentMethod(\n    biId: $biId\n    tStripePaymentMethodId: $tStripePaymentMethodId\n  )\n}";
+/** One-off course and program purchases for the order history page. */
+export declare const GET_PURCHASE_HISTORY = "query PurchaseHistory {\n  tOrderHistory\n}";
+/** Detailed payload for one order, looked up by its public order number. */
+export declare const GET_ORDER_DETAILS = "query OrderDetails($orderNumber: String) {\n  tOrderDetails(orderNumber: $orderNumber)\n}";
+/** Stripe receipt URL for one order (biId). */
+export declare const GET_STRIPE_PAYMENT_RECEIPT = "query StripePaymentReceipt($biId: String) {\n  tPaymentReceipt(biId: $biId)\n}";

package/dist/utils/queries.js

@@ -142,4 +142,16 @@ export const UPDATE_SUBSCRIPTION_PAYMENT_METHOD = `mutation UpdateSubscriptionPa
     tStripePaymentMethodId: $tStripePaymentMethodId
   )
 }`;
+/** One-off course and program purchases for the order history page. */
+export const GET_PURCHASE_HISTORY = `query PurchaseHistory {
+  tOrderHistory
+}`;
+/** Detailed payload for one order, looked up by its public order number. */
+export const GET_ORDER_DETAILS = `query OrderDetails($orderNumber: String) {
+  tOrderDetails(orderNumber: $orderNumber)
+}`;
+/** Stripe receipt URL for one order (biId). */
+export const GET_STRIPE_PAYMENT_RECEIPT = `query StripePaymentReceipt($biId: String) {
+  tPaymentReceipt(biId: $biId)
+}`;
 //# sourceMappingURL=queries.js.map