diff --git a/src/components/AppLayout.tsx b/src/components/AppLayout.tsx index e5f2bf6a..e5d423dd 100644 --- a/src/components/AppLayout.tsx +++ b/src/components/AppLayout.tsx @@ -32,6 +32,12 @@ import { import { BarsIcon } from '@patternfly/react-icons'; import ThemePreference from '@/components/ThemePreference/ThemePreference'; import '../styles/globals.scss'; + PROD_DEPLOYMENT_ENVIRONMENT, + PROD_METRICS_WEBSITE_ID, + QA_DEPLOYMENT_ENVIRONMENT, + QA_METRICS_WEBSITE_ID, + UMAMI_METRICS_SCRIPT_SOURCE +} from '../types/const'; interface IAppLayout { children: React.ReactNode; @@ -50,6 +56,31 @@ const AppLayout: React.FunctionComponent<IAppLayout> = ({ children }) => { const router = useRouter(); const pathname = usePathname(); + React.useEffect(() => { + if (typeof window === 'undefined') return; + + const hostname = window.location.hostname; + const isProd = hostname === PROD_DEPLOYMENT_ENVIRONMENT; + const isQA = hostname === QA_DEPLOYMENT_ENVIRONMENT; + + const scriptSource = isQA || isProd ? UMAMI_METRICS_SCRIPT_SOURCE : ''; + const websiteId = isProd ? PROD_METRICS_WEBSITE_ID : isQA ? QA_METRICS_WEBSITE_ID : null; + + if (scriptSource && websiteId) { + const script = document.createElement('script'); + script.async = true; + script.defer = true; + script.dataset.websiteId = websiteId; + script.src = scriptSource; + + document.head.appendChild(script); + + return () => { + document.head.removeChild(script); + }; + } + }, []); + React.useEffect(() => { // Fetch the experimental feature flag const fetchExperimentalFeature = async () => { diff --git a/src/types/const.ts b/src/types/const.ts index 478fa231..e92d1a44 100644 --- a/src/types/const.ts +++ b/src/types/const.ts @@ -6,3 +6,11 @@ export const FORK_CLONE_CHECK_RETRY_TIMEOUT = 5000; export const FORK_CLONE_CHECK_RETRY_COUNT = 10; export const GITHUB_API_URL = 'https://api.github.com'; export const BASE_BRANCH = 'main'; + +// Umami metrics constants +export const PROD_DEPLOYMENT_ENVIRONMENT = 'ui.instructlab.ai'; +export const PROD_METRICS_WEBSITE_ID = 'e20a625c-c3aa-487b-81ec-79525ecec36b'; +export const QA_DEPLOYMENT_ENVIRONMENT = 'qa.ui.instructlab.ai'; +export const QA_METRICS_WEBSITE_ID = '013a7037-2576-4dc9-95e2-a48c234680cb'; +export const UMAMI_METRICS_SCRIPT_SOURCE = + 'https://umami-umami.ui-instructlab-ai-0e3e0ef4c9c6d831e8aa6fe01f33bfc4-0000.us-south.containers.appdomain.cloud/script.js';