diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/toolbar.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/toolbar.tsx index 56c597451e..298e6f8e93 100644 --- a/services/web/frontend/js/features/ide-redesign/components/toolbar/toolbar.tsx +++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/toolbar.tsx @@ -12,6 +12,8 @@ import BackToEditorButton from '@/features/editor-navigation-toolbar/components/ import { useCallback } from 'react' import * as eventTracking from '../../../../infrastructure/event-tracking' import OLTooltip from '@/features/ui/components/ol/ol-tooltip' +import UpgradeButton from './upgrade-button' +import getMeta from '@/utils/meta' export const Toolbar = () => { const { view, setView } = useLayoutContext() @@ -71,6 +73,7 @@ const ToolbarButtons = () => { + {getMeta('ol-showUpgradePrompt') && } ) } diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/upgrade-button.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/upgrade-button.tsx new file mode 100644 index 0000000000..b3059de5af --- /dev/null +++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/upgrade-button.tsx @@ -0,0 +1,26 @@ +import { useTranslation } from 'react-i18next' +import * as eventTracking from '../../../../infrastructure/event-tracking' +import OLButton from '@/features/ui/components/ol/ol-button' + +export default function UpgradeButton() { + const { t } = useTranslation() + + function handleClick() { + eventTracking.send('subscription-funnel', 'code-editor', 'upgrade') + eventTracking.sendMB('upgrade-button-click', { source: 'code-editor' }) + } + + return ( +
+ + {t('upgrade')} + +
+ ) +}