frontend: Subscription grace period adaptions

pschlan · Aug 15, 2024 · 06b5a9f · 06b5a9f
1 parent e0785e6
commit 06b5a9f
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 4 deletions.
diff --git a/frontend/src/components/AppToolbar.jsx b/frontend/src/components/AppToolbar.jsx
@@ -44,7 +44,7 @@ export default function AppToolbar() {
       <LogoutIcon />
     </IconButton>
   </> : <>
-    {userProfile && userProfile.userSubscription && userProfile.userSubscription.status === SubscriptionStatus.ACTIVE && <Tooltip title={t('common.sustainingMemberThanks')}>
+    {userProfile && userProfile.userSubscription && (userProfile.userSubscription.status in [SubscriptionStatus.ACTIVE, SubscriptionStatus.EXPIRING] || userProfile.userSubscription.isOnGracePeriod === true) && <Tooltip title={t('common.sustainingMemberThanks')}>
       <IconButton
         color='inherit'
         onClick={() => history.push('/settings')}

diff --git a/frontend/src/components/settings/Settings.jsx b/frontend/src/components/settings/Settings.jsx
@@ -378,7 +378,9 @@ export default function Settings() {
                   {userProfile.userSubscription && userProfile.userSubscription.status === SubscriptionStatus.CANCELLED && <>
                       <IconAvatar icon={SubscriptionInactiveIcon} />
                       <div>
-                        {t('settings.subscriptionInactive', { serviceName: Config.productName })}
+                        {userProfile.userSubscription.isOnGracePeriod ?
+                          <>{t('settings.subscriptionGracePeriod', { serviceName: Config.productName, expiresAt: moment(userProfile.userSubscription.gracePeriodEndsAt * 1000).calendar() })}</> :
+                          <>{t('settings.subscriptionInactive', { serviceName: Config.productName })}</>}
                       </div>
                     </>}
                 </> : <>
@@ -388,7 +390,7 @@ export default function Settings() {
             </Grid>
             <Grid item sm={6} xs={12} align='right'>
               <ButtonGroup variant='contained' size='small'>
-                {userProfile.userSubscription && userProfile.userSubscription.type==='stripe' &&
+                {userProfile.userSubscription && userProfile.userSubscription.type==='stripe' && userProfile.userSubscription.status !== SubscriptionStatus.EXPIRING &&
                   <Button
                     size='small'
                     variant='contained'
@@ -542,7 +544,7 @@ export default function Settings() {
         </Grid>
       </Paper>
 
-      <Grid container direction='row' justify='flex-end'>
+      <Grid container direction='row' justifyContent='flex-end'>
         <Grid item>
           <Button
             variant='contained'

diff --git a/frontend/src/locales/de/translation.json b/frontend/src/locales/de/translation.json
@@ -427,6 +427,7 @@
     "subscriptionPending": "Wir bearbeiten gerade Ihre Bestellung - bitte schauen Sie in Kürze noch einmal vorbei.",
     "subscriptionInactive": "Sie sind derzeit kein aktives Fördermitglied.",
     "subscriptionExpiring": "Ihre Fördermitgliedschaft endet am {{expiresAt}}.",
+    "subscriptionGracePeriod": "Ihre kostenlose Fördermitgliedschaftsverlängerung endet am {{expiresAt}}. Wenn Sie weiterhin Fördermitglied bleiben möchten, klicken Sie bite auf \"Fördermitglied werden\".",
     "becomeASustainingMember": "Fördermitglied werden",
     "learnMore": "Mehr erfahren",
     "sustainingMemberTeaser": "Finden Sie {{serviceName}} nützlich und möchten uns unterstützen und gleichzeitig von exklusiven Vorteilen profitieren? Werden Sie ein Fördermitglied!",

diff --git a/frontend/src/locales/en/translation.json b/frontend/src/locales/en/translation.json
@@ -427,6 +427,7 @@
     "subscriptionPending": "We're currently processing your order - please check back soon!",
     "subscriptionInactive": "You're not currently an active sustaining member.",
     "subscriptionExpiring": "Your sustaining membership is expiring at {{expiresAt}}.",
+    "subscriptionGracePeriod": "Your free sustaining membership extension is expiring at {{expiresAt}}. If you want to continue being a sustaining member, please re-subscribe by clicking \"Become A Sustaining Member\".",
     "becomeASustainingMember": "Become a sustaining member",
     "learnMore": "Learn more",
     "sustainingMemberTeaser": "Do you find {{serviceName}} useful and want to support us and at the same time benefit from exclusive membership rewards? Become a Sustaining Member now!",