feat: Add Pro features discovery banner

Adds a dismissible banner in the topbar that informs users about
PLANKA Pro features.

- Dismissible per-user (stored in localStorage)
- Reappears after 30 days
- Rotates between main message and 3 feature highlights
- Links to planka.app/pro (with ref parameter for anonymous source attribution)
This commit is contained in:
Daniel Hiller
2026-04-18 13:32:22 +00:00
parent 4e23f3c8a9
commit cd9ba8ff4f
41 changed files with 450 additions and 10 deletions
@@ -1,5 +1,5 @@
/*!
* Copyright (c) 2024 PLANKA Software GmbH
* Copyright (c) 2026 PLANKA Software GmbH
* Licensed under the Fair Use License: https://github.com/plankanban/planka/blob/master/LICENSE.md
*/
@@ -104,6 +104,17 @@ const UserActionsStep = React.memo(({ onClose }) => {
context: 'title',
})}
</Menu.Item>
<Menu.Item
href="https://planka.app/pro?ref=app-menu"
target="_blank"
rel="noopener noreferrer"
className={styles.proMenuItem}
>
<Icon name="gem" className={styles.proMenuItemIcon} />
{withAdministration
? t('common.upgradeTeamToPro', { context: 'title' })
: t('common.discoverPlankaPro', { context: 'title' })}
</Menu.Item>
<hr className={styles.divider} />
<Menu.Item
{...logoutMenuItemProps} // eslint-disable-line react/jsx-props-no-spreading
@@ -1,5 +1,5 @@
/*!
* Copyright (c) 2024 PLANKA Software GmbH
* Copyright (c) 2026 PLANKA Software GmbH
* Licensed under the Fair Use License: https://github.com/plankanban/planka/blob/master/LICENSE.md
*/
@@ -25,4 +25,14 @@
float: left;
margin: 0 0.5em 0 0;
}
.proMenuItem {
margin: 0;
padding-left: 14px;
}
.proMenuItemIcon {
float: left;
margin: 0 0.5em 0 0;
}
}