OpenConceptLab/ocl_online#299 | Banner: subscription dates (Nov 1 / Dec 1 grace period), "Learn more" and "See pricing"

src/common/constants.js

@@ -81,4 +81,5 @@ export const DEFAULT_CASCADE_PARAMS = {
 
 export const ALL = '*';
 
-export const TBV2_ANNOUNCEMENT_URL = 'https://openconceptlab.org/blog/letter-to-the-ocl-community?utm_source=tbv2&utm_medium=banner&utm_campaign=preview_launch'
+export const TBV2_ANNOUNCEMENT_LEARN_MORE_URL = 'https://openconceptlab.org/blog/letter-to-the-ocl-community?utm_source=tbv2&utm_medium=banner&utm_campaign=subscription_dates'
+export const TBV2_ANNOUNCEMENT_PRICING_URL = 'https://openconceptlab.org/pricing?utm_source=tbv2&utm_medium=banner&utm_campaign=subscription_dates'

src/components/app/AnnouncementBanner.jsx

@@ -6,14 +6,20 @@ import Link from '@mui/material/Link';
 import Typography from '@mui/material/Typography';
 import CampaignOutlinedIcon from '@mui/icons-material/CampaignOutlined';
 import CloseIcon from '@mui/icons-material/Close';
-import { TBV2_ANNOUNCEMENT_URL } from '../../common/constants';
+import { TBV2_ANNOUNCEMENT_LEARN_MORE_URL, TBV2_ANNOUNCEMENT_PRICING_URL } from '../../common/constants';
 
 // OCL Online-wide announcement strip, fixed above the app bar and styled like
 // the community site's AnnouncementBanner, so it reads as sitting above the
 // tool rather than inside it. Same component in TBv3 and the Mapper. Update
 // announcement.* in the locale bundles (and bump ANNOUNCEMENT_ID) to re-show a
 // new announcement to visitors who dismissed a previous one.
-const ANNOUNCEMENT_ID = 'tbv2-tbv3-public-preview-2026-09-v2';
+const ANNOUNCEMENT_ID = 'subscription-dates-2026-10';
+
+// Shown in this order after the text, separated by " · ".
+const ANNOUNCEMENT_LINKS = [
+  { labelKey: 'announcement.link_label', href: TBV2_ANNOUNCEMENT_LEARN_MORE_URL },
+  { labelKey: 'announcement.pricing_label', href: TBV2_ANNOUNCEMENT_PRICING_URL },
+];
 
 const DISMISSED_KEY = 'announcementDismissed';
 
@@ -98,23 +104,30 @@ const AnnouncementBanner = () => {
           {t('announcement.title')}
         </Typography>
         <Typography variant='body2' sx={{ color: V3.text }}>
-          {t('announcement.text')}{' '}
-          <Link
-            href={TBV2_ANNOUNCEMENT_URL}
-            target='_blank'
-            rel='noopener noreferrer'
-            underline='always'
-            sx={{
-              fontWeight: 600,
-              color: V3.primary,
-              textDecorationColor: 'rgba(72, 54, 255, 0.4)',
-              '&:hover, &:focus': { color: V3.primary },
-              // App.scss removes the focus outline from every link.
-              '&:focus-visible': { outline: `2px solid ${V3.primary} !important`, outlineOffset: '2px' },
-            }}
-          >
-            {t('announcement.link_label')}
-          </Link>
+          {t('announcement.text')}
+          {ANNOUNCEMENT_LINKS.map(({ labelKey, href }, i) => (
+            <React.Fragment key={href}>
+              {i ? ' · ' : ' '}
+              <Link
+                href={href}
+                target='_blank'
+                rel='noopener noreferrer'
+                underline='always'
+                sx={{
+                  fontWeight: 600,
+                  color: V3.primary,
+                  textDecorationColor: 'rgba(72, 54, 255, 0.4)',
+                  // The text may wrap between the links, never inside one.
+                  whiteSpace: 'nowrap',
+                  '&:hover, &:focus': { color: V3.primary },
+                  // App.scss removes the focus outline from every link.
+                  '&:focus-visible': { outline: `2px solid ${V3.primary} !important`, outlineOffset: '2px' },
+                }}
+              >
+                {t(labelKey)}
+              </Link>
+            </React.Fragment>
+          ))}
         </Typography>
       </Box>
       <IconButton size='small' aria-label={t('announcement.dismiss')} onClick={onClose}>

src/i18n/locales/en/translations.json

@@ -176,9 +176,10 @@
     }
   },
   "announcement": {
-    "title": "Try the new OCL TermBrowser v3, now in public preview!",
-    "text": "Your content is already there, and you can switch back any time.",
+    "title": "Subscriptions open November 1.",
+    "text": "Existing accounts using premium features have a grace period until December 1.",
     "link_label": "Learn more",
+    "pricing_label": "See pricing",
     "dismiss": "Dismiss"
   }
 }

src/i18n/locales/es/translations.json

@@ -175,9 +175,10 @@
     }
   },
   "announcement": {
-    "title": "¡Pruebe el nuevo OCL TermBrowser v3, ahora en vista previa pública!",
-    "text": "Su contenido ya está allí, y puede volver en cualquier momento.",
+    "title": "Las suscripciones abren el 1 de noviembre.",
+    "text": "Las cuentas existentes que usan funciones premium tienen un periodo de gracia hasta el 1 de diciembre.",
     "link_label": "Más información",
+    "pricing_label": "Ver precios",
     "dismiss": "Descartar"
   }
 }

src/i18n/locales/zh/translations.json

@@ -175,9 +175,10 @@
     }
   },
   "announcement": {
-    "title": "试用全新 OCL TermBrowser v3，现已开放公开预览！",
-    "text": "您的内容已在其中，并可随时切换回来。",
+    "title": "订阅将于 11 月 1 日开放。",
+    "text": "使用高级功能的现有账户可享受宽限期至 12 月 1 日。",
     "link_label": "了解更多",
+    "pricing_label": "查看价格",
     "dismiss": "关闭"
   }
 }