diff --git a/docs/docs/deployment/hosting/locally-frontend.md b/docs/docs/deployment/hosting/locally-frontend.md index 920367dda845..4ea66491b5c2 100644 --- a/docs/docs/deployment/hosting/locally-frontend.md +++ b/docs/docs/deployment/hosting/locally-frontend.md @@ -90,6 +90,7 @@ Current variables used between 'frontend/environment.js' and 'frontend/common/pr - `AMPLITUDE_API_KEY`: The Amplitude key to use for behaviour tracking. - `MIXPANEL_API_KEY`: Mixpanel analytics key to use for behaviour tracking. - `SENTRY_API_KEY`: Sentry key for error reporting. +- `ALBACROSS_CLIENT_ID`: Albacross client ID key for behaviour tracking. - `STATIC_ASSET_CDN_URL`: Used for replacing local static paths with a cdn, .e.g https://cdn.flagsmith.com. Defaults to `/`, i.e. no CDN. - `BASE_URL`: Used for specifying a base url path that's ignored during routing if serving from a subdirectory. diff --git a/frontend/api/index.js b/frontend/api/index.js index 69c686f700d8..163718cd0696 100755 --- a/frontend/api/index.js +++ b/frontend/api/index.js @@ -110,6 +110,7 @@ app.get('/config/project-overrides', (req, res) => { name: 'hideInviteLinks', value: envToBool('DISABLE_INVITE_LINKS', false), }, + { name: 'albacross', value: process.env.ALBACROSS_CLIENT_ID }, ] let output = values.map(getVariable).join('') let dynatrace = '' diff --git a/frontend/web/components/pages/HomePage.js b/frontend/web/components/pages/HomePage.js index cf4ca409b43e..8c6c6e984b86 100644 --- a/frontend/web/components/pages/HomePage.js +++ b/frontend/web/components/pages/HomePage.js @@ -12,6 +12,8 @@ import Icon from 'components/Icon' import ErrorMessage from 'components/ErrorMessage' import Button from 'components/base/forms/Button' +let controller = new AbortController() + const HomePage = class extends React.Component { static contextTypes = { router: propTypes.object.isRequired, @@ -27,6 +29,42 @@ const HomePage = class extends React.Component { } } + addAlbacross() { + EventTarget.prototype.oldAddEventListener = + EventTarget.prototype.addEventListener + window._nQc = Project.albacross + const script = document.createElement('script') + script.type = 'text/javascript' + script.async = true + script.src = 'https://serve.albacross.com/track.js' + script.id = 'albacross' + + EventTarget.prototype.addEventListener = function ( + type, + listener, + options = false, + ) { + const parsedOptions = + typeof options == 'boolean' ? { capture: options } : options + + EventTarget.prototype.oldAddEventListener.call(this, type, listener, { + signal: controller.signal, + ...parsedOptions, + }) + } + + document.body.appendChild(script) + } + + removeAlbacross() { + controller.abort() + controller = new AbortController() + EventTarget.prototype.addEventListener = + EventTarget.prototype.oldAddEventListener + document.body.removeChild(document.getElementById('albacross')) + delete window._nQc + } + componentDidUpdate(prevProps) { if (this.props.location.pathname !== prevProps.location.pathname) { const emailField = @@ -35,10 +73,31 @@ const HomePage = class extends React.Component { if (emailField) { emailField.focus() } + if ( + Project.albacross && + this.props.location.pathname.indexOf('signup') !== -1 + ) { + this.addAlbacross() + } else if (document.getElementById('albacross')) { + this.removeAlbacross() + } + } + } + + componentWillUnmount() { + if (document.getElementById('albacross')) { + this.removeAlbacross() } } componentDidMount() { + if ( + Project.albacross && + this.props.location.pathname.indexOf('signup') !== -1 + ) { + this.addAlbacross() + } + document.body.classList.remove('dark') if (document.location.href.includes('oauth')) { const parts = location.href.split('oauth/') @@ -618,14 +677,15 @@ const HomePage = class extends React.Component { Have an account?{' '} - { + window.location.href = `/login${redirect}` + }} > - - + Log in + )}