Your Learner Credit plan expires ${date}. Contact support today to renew your plan and keep people learning.
`)), - }, - variant: PLAN_EXPIRY_VARIANTS.expiring, - }), - 10: ({ date, days, hours }) => ({ - notificationTemplate: { - title: `Reminder: Your Learner Credit plan expires ${date}`, - variant: 'danger', - message: parse(sanitizeHTML(`Your Learner Credit plan expires in ${days} days and ${hours} hours. Contact support today to renew your plan.`)), - }, - modalTemplate: { - title: `Reminder: Your Learner Credit plan expires ${date}`, - message: parse(sanitizeHTML(`Your Learner Credit plan expires ${date}. Contact support today to renew your plan and keep people learning.
`)), - }, - variant: PLAN_EXPIRY_VARIANTS.expiring, - }), - 0: ({ date }) => ({ - notificationTemplate: null, - modalTemplate: { - title: 'Your Learner Credit plan has expired', - message: parse(sanitizeHTML( - `Your Learner Credit Plan expired on ${date}. You are no longer have access to administrative functions and the remaining balance of your plan's budget(s) are no longer available to spend
` - + 'Please contact your representative if you have any questions or concerns.
', - )), - }, - variant: PLAN_EXPIRY_VARIANTS.expired, - }), -}; - -export default expiryThresholds; diff --git a/src/components/BudgetExpiryAlertAndModal/data/expiryThresholds.jsx b/src/components/BudgetExpiryAlertAndModal/data/expiryThresholds.jsx new file mode 100644 index 0000000000..f744d57adf --- /dev/null +++ b/src/components/BudgetExpiryAlertAndModal/data/expiryThresholds.jsx @@ -0,0 +1,139 @@ +import { MailtoLink } from '@edx/paragon'; +import { PLAN_EXPIRY_VARIANTS } from './constants'; + +const expiryThresholds = { + 120: ({ date }) => ({ + notificationTemplate: { + title: 'Your Learner Credit plan expires soon', + variant: 'info', + message: ({ contactEmail }) => ( +
+ Your Learner Credit plan expires ${date}. Contact
+ {contactEmail ?
+ Your Learner Credit plan expires {date}. Contact support today to + renew your plan and keep people learning. +
+ ), + }, + variant: PLAN_EXPIRY_VARIANTS.expiring, + }), + 90: ({ date }) => ({ + notificationTemplate: { + title: 'Reminder: Your Learner Credit plan expires soon', + variant: 'info', + message: () => ( ++ Your Learner Credit plan expires {date}. Contact support today + to renew your plan and keep people learning. +
+ ), + dismissible: true, + }, + modalTemplate: { + title: 'Reminder: Your plan expires soon', + message: () => ( ++ Your Learner Credit plan expires {date}. Contact support today to + renew your plan and keep people learning. +
+ ), + }, + variant: PLAN_EXPIRY_VARIANTS.expiring, + }), + 60: ({ date }) => ({ + notificationTemplate: { + title: `Your Learner Credit plan expires ${date}`, + variant: 'warning', + message: () => ( ++ When your Learner Credit plan expires, you will no longer have access to administrative + functions and the remaining balance of your budget(s) will be unusable. Contact support + today to renew your plan. +
+ ), + dismissible: true, + }, + modalTemplate: { + title: `Your Learner Credit plan expires ${date}`, + message: () => ( ++ Your Learner Credit plan expires {date}. Contact support + today to renew your plan and keep people learning. +
+ ), + }, + variant: PLAN_EXPIRY_VARIANTS.expiring, + }), + 30: ({ date }) => ({ + notificationTemplate: { + title: 'Your Learner Credit plan expires in less than 30 days', + variant: 'danger', + message: () => ( ++ When your plan expires you will lose access to administrative functions and the remaining + balance of your plan's budget(s) will be unusable. Contact support today to renew your plan. +
+ ), + }, + modalTemplate: { + title: 'Your Learner Credit plan expires in less than 30 days', + message: () => ( ++ Your Learner Credit plan expires {date}. Contact support today + to renew your plan and keep people learning. +
+ ), + }, + variant: PLAN_EXPIRY_VARIANTS.expiring, + }), + 10: ({ date, days, hours }) => ({ + notificationTemplate: { + title: `Reminder: Your Learner Credit plan expires ${date}`, + variant: 'danger', + message: () => ( ++ Your Learner Credit plan expires in {days} days and {hours} hours. Contact + support today to renew your plan. +
+ ), + }, + modalTemplate: { + title: `Reminder: Your Learner Credit plan expires ${date}`, + message: () => ( ++ Your Learner Credit plan expires {date}. Contact support today to + renew your plan and keep people learning. +
+ ), + }, + variant: PLAN_EXPIRY_VARIANTS.expiring, + }), + 0: ({ date }) => ({ + notificationTemplate: null, + modalTemplate: { + title: 'Your Learner Credit plan has expired', + message: () => ( + <> ++ Your Learner Credit Plan expired on {date}. You are no longer have + access to administrative functions and the remaining balance of your + plan's budget(s) are no longer available to spend +
+Please contact support if you have any questions or concerns.
+ + ), + }, + variant: PLAN_EXPIRY_VARIANTS.expired, + }), +}; + +export default expiryThresholds; diff --git a/src/components/BudgetExpiryAlertAndModal/index.jsx b/src/components/BudgetExpiryAlertAndModal/index.jsx index 44f232f50f..41aed5e1f8 100644 --- a/src/components/BudgetExpiryAlertAndModal/index.jsx +++ b/src/components/BudgetExpiryAlertAndModal/index.jsx @@ -54,6 +54,8 @@ const BudgetExpiryAlertAndModal = ({ enterpriseUUID, enterpriseFeatures }) => { alertOpen, alertClose, ); + const NotificationMessage = notification?.message; + const ModalMessage = modal?.message; const trackEventMetadata = useMemo(() => { if (modal === null && notification === null) { return {}; } @@ -88,7 +90,7 @@ const BudgetExpiryAlertAndModal = ({ enterpriseUUID, enterpriseFeatures }) => { data-testid="expiry-notification-alert" >{notification.message}
+