2023-02-22 07:33:17 -05:00
|
|
|
import { Trans, useTranslation } from 'react-i18next'
|
|
|
|
import { RecurlySubscription } from '../../../../../../types/subscription/dashboard/subscription'
|
2023-01-31 10:56:34 -05:00
|
|
|
import { ActiveSubscription } from './states/active/active'
|
2024-11-04 11:44:46 -05:00
|
|
|
import { ActiveAiAddonSubscription } from './states/active/active-ai-addon'
|
2023-01-31 10:56:34 -05:00
|
|
|
import { CanceledSubscription } from './states/canceled'
|
|
|
|
import { ExpiredSubscription } from './states/expired'
|
2023-01-26 12:01:54 -05:00
|
|
|
import { useSubscriptionDashboardContext } from '../../context/subscription-dashboard-context'
|
2023-02-28 04:15:33 -05:00
|
|
|
import PersonalSubscriptionRecurlySyncEmail from './personal-subscription-recurly-sync-email'
|
2024-09-30 05:49:18 -04:00
|
|
|
import OLNotification from '@/features/ui/components/ol/ol-notification'
|
2024-11-04 11:44:46 -05:00
|
|
|
import {
|
|
|
|
AI_STANDALONE_PLAN_CODE,
|
|
|
|
AI_STANDALONE_ANNUAL_PLAN_CODE,
|
|
|
|
AI_ADD_ON_CODE,
|
|
|
|
} from '../../data/add-on-codes'
|
2023-01-26 11:48:30 -05:00
|
|
|
|
|
|
|
function PastDueSubscriptionAlert({
|
|
|
|
subscription,
|
|
|
|
}: {
|
2023-02-22 07:33:17 -05:00
|
|
|
subscription: RecurlySubscription
|
2023-01-26 11:48:30 -05:00
|
|
|
}) {
|
|
|
|
const { t } = useTranslation()
|
|
|
|
return (
|
2024-09-30 05:49:18 -04:00
|
|
|
<OLNotification
|
|
|
|
type="error"
|
|
|
|
content={
|
|
|
|
<>
|
|
|
|
{t('account_has_past_due_invoice_change_plan_warning')}{' '}
|
|
|
|
<a
|
|
|
|
href={subscription.recurly.accountManagementLink}
|
|
|
|
target="_blank"
|
|
|
|
rel="noreferrer noopener"
|
|
|
|
>
|
|
|
|
{t('view_your_invoices')}
|
|
|
|
</a>
|
|
|
|
</>
|
|
|
|
}
|
|
|
|
/>
|
2023-01-26 11:48:30 -05:00
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
function PersonalSubscriptionStates({
|
|
|
|
subscription,
|
|
|
|
}: {
|
2023-02-22 07:33:17 -05:00
|
|
|
subscription: RecurlySubscription
|
2023-01-26 11:48:30 -05:00
|
|
|
}) {
|
|
|
|
const { t } = useTranslation()
|
2023-02-22 07:33:17 -05:00
|
|
|
const state = subscription?.recurly.state
|
2023-01-26 11:48:30 -05:00
|
|
|
|
2024-11-04 11:44:46 -05:00
|
|
|
const hasAiAddon = subscription?.addOns?.some(
|
|
|
|
addOn => addOn.addOnCode === AI_ADD_ON_CODE
|
|
|
|
)
|
|
|
|
|
|
|
|
const onAiStandalonePlan = [
|
|
|
|
AI_STANDALONE_PLAN_CODE,
|
|
|
|
AI_STANDALONE_ANNUAL_PLAN_CODE,
|
|
|
|
].includes(subscription.planCode)
|
|
|
|
|
|
|
|
const planHasAi = onAiStandalonePlan || hasAiAddon
|
|
|
|
|
|
|
|
if (state === 'active' && planHasAi) {
|
|
|
|
return <ActiveAiAddonSubscription subscription={subscription} />
|
|
|
|
} else if (state === 'active') {
|
2023-01-31 10:56:34 -05:00
|
|
|
return <ActiveSubscription subscription={subscription} />
|
2023-01-26 11:48:30 -05:00
|
|
|
} else if (state === 'canceled') {
|
2023-01-31 10:56:34 -05:00
|
|
|
return <CanceledSubscription subscription={subscription} />
|
2023-01-26 11:48:30 -05:00
|
|
|
} else if (state === 'expired') {
|
2023-01-31 10:56:34 -05:00
|
|
|
return <ExpiredSubscription subscription={subscription} />
|
2023-01-26 11:48:30 -05:00
|
|
|
} else {
|
|
|
|
return <>{t('problem_with_subscription_contact_us')}</>
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2023-02-07 10:38:04 -05:00
|
|
|
function PersonalSubscription() {
|
2023-01-26 12:01:54 -05:00
|
|
|
const { t } = useTranslation()
|
2023-02-07 10:38:12 -05:00
|
|
|
const { personalSubscription, recurlyLoadError } =
|
2023-01-26 12:01:54 -05:00
|
|
|
useSubscriptionDashboardContext()
|
2023-01-26 11:48:30 -05:00
|
|
|
|
2023-02-07 10:38:04 -05:00
|
|
|
if (!personalSubscription) return null
|
2023-01-26 11:48:30 -05:00
|
|
|
|
2023-02-22 07:33:17 -05:00
|
|
|
if (!('recurly' in personalSubscription)) {
|
|
|
|
return (
|
|
|
|
<p>
|
|
|
|
<Trans
|
|
|
|
i18nKey="please_contact_support_to_makes_change_to_your_plan"
|
|
|
|
components={[<a href="/contact" />]} // eslint-disable-line react/jsx-key, jsx-a11y/anchor-has-content
|
|
|
|
/>
|
|
|
|
</p>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
2023-01-26 11:48:30 -05:00
|
|
|
return (
|
|
|
|
<>
|
2023-02-07 10:38:04 -05:00
|
|
|
{personalSubscription.recurly.account.has_past_due_invoice._ ===
|
|
|
|
'true' && (
|
|
|
|
<PastDueSubscriptionAlert subscription={personalSubscription} />
|
2023-01-26 11:48:30 -05:00
|
|
|
)}
|
2023-02-22 07:33:17 -05:00
|
|
|
<PersonalSubscriptionStates
|
|
|
|
subscription={personalSubscription as RecurlySubscription}
|
|
|
|
/>
|
2023-01-26 12:01:54 -05:00
|
|
|
{recurlyLoadError && (
|
2024-09-30 05:49:18 -04:00
|
|
|
<OLNotification
|
|
|
|
type="warning"
|
|
|
|
content={<strong>{t('payment_provider_unreachable_error')}</strong>}
|
|
|
|
/>
|
2023-01-26 12:01:54 -05:00
|
|
|
)}
|
2023-01-31 10:42:52 -05:00
|
|
|
<hr />
|
2023-02-28 04:15:33 -05:00
|
|
|
<PersonalSubscriptionRecurlySyncEmail />
|
2023-01-26 11:48:30 -05:00
|
|
|
</>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
export default PersonalSubscription
|