give
/
src
/
Subscriptions
/
resources
/
admin
/
components
/
SubscriptionDetailsPage
/
Tabs
/
Overview
/
index.tsx
give
/
src
/
Subscriptions
/
resources
/
admin
/
components
/
SubscriptionDetailsPage
/
Tabs
/
Overview
Last commit date
SubscriptionAnnualProjection
8 months ago
SubscriptionStats
10 months ago
SubscriptionSummary
8 months ago
SubscriptionSummaryGrid
8 months ago
index.tsx
9 months ago
styles.module.scss
10 months ago
index.tsx
52 lines
| 1 | |
| 2 | import SubscriptionStats from "./SubscriptionStats"; |
| 3 | import OverviewPanel from "@givewp/admin/components/OverviewPanel"; |
| 4 | import SubscriptionSummaryGrid from "./SubscriptionSummaryGrid"; |
| 5 | import { SubscriptionNotes } from "@givewp/admin/components/PrivateNotes"; |
| 6 | import { useSubscriptionAmounts } from '@givewp/subscriptions/hooks'; |
| 7 | import { getSubscriptionEmbeds } from '@givewp/subscriptions/common'; |
| 8 | import SubscriptionSummary from '@givewp/subscriptions/admin/components/SubscriptionDetailsPage/Tabs/Overview/SubscriptionSummary'; |
| 9 | import { getSubscriptionOptionsWindowData, useSubscriptionEntityRecord } from "@givewp/subscriptions/utils"; |
| 10 | import SubscriptionAnnualProjection from "./SubscriptionAnnualProjection"; |
| 11 | import styles from "./styles.module.scss"; |
| 12 | import { Spinner } from "@givewp/admin/components"; |
| 13 | import { __ } from '@wordpress/i18n'; |
| 14 | |
| 15 | /** |
| 16 | * @since 4.10.0 updated logic to use embed relationships |
| 17 | * @since 4.8.0 |
| 18 | */ |
| 19 | export default function SubscriptionDetailsPageOverviewTab() { |
| 20 | const { adminUrl } = getSubscriptionOptionsWindowData(); |
| 21 | const { record: subscription, hasResolved: subscriptionsResolved, isResolving: subscriptionLoading } = useSubscriptionEntityRecord(); |
| 22 | const { intendedAmount } = useSubscriptionAmounts(subscription); |
| 23 | const { donations } = getSubscriptionEmbeds(subscription); |
| 24 | |
| 25 | if (subscriptionLoading || !subscriptionsResolved) { |
| 26 | return <Spinner />; |
| 27 | } |
| 28 | |
| 29 | if (!subscription) { |
| 30 | return <p>{__('No subscription found', 'give')}</p>; |
| 31 | } |
| 32 | |
| 33 | return ( |
| 34 | <div className={styles.overview}> |
| 35 | <SubscriptionStats donations={donations} currency={subscription?.amount?.currency} totalInstallments={subscription?.installments} loading={subscriptionLoading || !subscriptionsResolved} /> |
| 36 | |
| 37 | <div className={styles.left}> |
| 38 | <SubscriptionSummaryGrid subscription={subscription} isLoading={subscriptionLoading || !subscriptionsResolved} /> |
| 39 | <OverviewPanel> |
| 40 | <SubscriptionNotes subscriptionId={subscription?.id} /> |
| 41 | </OverviewPanel> |
| 42 | |
| 43 | </div> |
| 44 | |
| 45 | <div className={styles.right}> |
| 46 | <SubscriptionAnnualProjection donations={donations} currency={subscription?.amount?.currency} subscription={subscription} /> |
| 47 | <SubscriptionSummary subscription={subscription} adminUrl={adminUrl} intendedAmount={intendedAmount} isLoading={subscriptionLoading || !subscriptionsResolved} /> |
| 48 | </div> |
| 49 | </div> |
| 50 | ); |
| 51 | } |
| 52 |