diff --git a/src/lib/components/Nav/Top/TopNav.svelte b/src/lib/components/Nav/Top/TopNav.svelte index 1ddd1416..682339f0 100644 --- a/src/lib/components/Nav/Top/TopNav.svelte +++ b/src/lib/components/Nav/Top/TopNav.svelte @@ -1,36 +1,72 @@ - {#if !$user?.superfan} + {#if shouldShowTopBar} - {$_('navigation.membership-notice.prompt')}{@html $_('navigation.membership-notice.answer', { - values: { - linkText: anchorText({ - href: routes.ABOUT_MEMBERSHIP, - track: [PlausibleEvent.VISIT_ABOUT_MEMBERSHIP, { source: 'top_navbar_announcement' }], - linkText: $_('navigation.membership-notice.link-text'), - style: 'text-decoration: underline; cursor: pointer;', - newtab: false - }) - } - })} - + + {#if !$user?.superfan} + {$_('navigation.membership-notice.prompt')}{@html $_('navigation.membership-notice.answer', { + values: { + linkText: anchorText({ + href: routes.ABOUT_MEMBERSHIP, + track: [ + PlausibleEvent.VISIT_ABOUT_MEMBERSHIP, + { source: 'top_navbar_announcement' } + ], + linkText: $_('navigation.membership-notice.link-text'), + style: 'text-decoration: underline; cursor: pointer;', + newtab: false + }) + } + })} + + {:else if shouldShowRenewalTopBar && $user.stripeSubscription} + + + {$_('navigation.membership-expired-notice.prompt', { + values: { + amount: + ($locale !== 'fr' ? '€ ' : '') + + (MEMBERSHIP_YEARLY_AMOUNTS[$user.stripeSubscription.priceId] || 60) + + ($locale === 'fr' ? '€' : '') + } + })}{' '}{@html $_('navigation.membership-expired-notice.answer', { + values: { + linkText: anchorText({ + href: + $hasOpenRenewalInvoice && $user.stripeSubscription.renewalInvoiceLink + ? $user.stripeSubscription.renewalInvoiceLink + : `${routes.ABOUT_MEMBERSHIP}#pricing`, + // TODO: this isn't accurate, the hosted invoice page visitors aren't about_membership page visitors + track: [PlausibleEvent.VISIT_ABOUT_MEMBERSHIP, { source: 'top_navbar_renewal' }], + linkText: $_('navigation.membership-expired-notice.link-text'), + style: 'text-decoration: underline; cursor: pointer;', + newtab: false + }) + } + })} + + {/if} {/if} @@ -81,7 +117,7 @@ - {#if $user?.superfan} + {#if !shouldShowTopBar}