diff --git a/.github/workflows/docs-pr.yml b/.github/workflows/docs-pr.yml index 945ed555639..9cb6775bfb7 100644 --- a/.github/workflows/docs-pr.yml +++ b/.github/workflows/docs-pr.yml @@ -79,6 +79,8 @@ jobs: run: yarn workspace docs version::stables - name: Build docs + env: + MATOMO_ENV: staging # not really a secret, it will show in the footer anyway run: yarn workspaces foreach -Rpt --from docs run build - name: Upload artifact diff --git a/docs/docusaurus.config.ts b/docs/docusaurus.config.ts index 49566c5c380..2d5b8941f55 100644 --- a/docs/docusaurus.config.ts +++ b/docs/docusaurus.config.ts @@ -47,7 +47,9 @@ export default { }, ], ], - + customFields: { + MATOMO_ENV: process.env.MATOMO_ENV, + }, themeConfig: { colorMode: { respectPrefersColorScheme: true, diff --git a/docs/package.json b/docs/package.json index f9e95fc02f8..c81d0b7b24f 100644 --- a/docs/package.json +++ b/docs/package.json @@ -4,11 +4,12 @@ "private": true, "scripts": { "preprocess": "yarn workspace @noir-lang/acvm_js build && ./scripts/codegen_nargo_reference.sh && yarn node ./scripts/preprocess/index.js", - "start": "yarn preprocess && docusaurus start", + "start": "yarn preprocess && MATOMO_ENV=dev docusaurus start", "build": "yarn preprocess && docusaurus build", "clean": "rm -rf ./processed-docs ./processed-docs ./build", "version::stables": "ts-node ./scripts/setStable.ts", "serve": "serve build", + "swizzle": "docusaurus swizzle", "version": "yarn version::stables && ./scripts/cut_version.sh" }, "dependencies": { diff --git a/docs/src/components/Matomo/matomo.jsx b/docs/src/components/Matomo/matomo.jsx new file mode 100644 index 00000000000..7ee34fc8e51 --- /dev/null +++ b/docs/src/components/Matomo/matomo.jsx @@ -0,0 +1,133 @@ +import { useEffect, useState } from 'react'; +import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; +import Link from '@docusaurus/Link'; + +function getSiteId(env) { + if (env == 'dev') { + return '3'; + } else if (env == 'staging') { + return '2'; + } else { + return '1'; + } +} +function pushInstruction(name, ...args) { + return window._paq.push([name, ...args]); +} + +export default function useMatomo() { + const { siteConfig } = useDocusaurusContext(); + const [showBanner, setShowBanner] = useState(false); + + const env = siteConfig.customFields.MATOMO_ENV; + const urlBase = 'https://noirlang.matomo.cloud/'; + const trackerUrl = `${urlBase}matomo.php`; + const srcUrl = `${urlBase}matomo.js`; + + window._paq = window._paq || []; + + useEffect(() => { + const storedConsent = localStorage.getItem('matomoConsent'); + if (storedConsent === null) { + setShowBanner(true); + } + }, []); + + useEffect(() => { + pushInstruction('setTrackerUrl', trackerUrl); + pushInstruction('setSiteId', getSiteId(env)); + if (env !== 'prod') { + pushInstruction('setSecureCookie', false); + } + + const doc = document; + const scriptElement = doc.createElement('script'); + const scripts = doc.getElementsByTagName('script')[0]; + + scriptElement.type = 'text/javascript'; + scriptElement.async = true; + scriptElement.defer = true; + scriptElement.src = srcUrl; + + if (scripts && scripts.parentNode) { + scripts.parentNode.insertBefore(scriptElement, scripts); + } + }, []); + + useEffect(() => { + pushInstruction('trackPageView'); + }, [window.location.href]); + + const optIn = () => { + pushInstruction('rememberConsentGiven'); + localStorage.setItem('matomoConsent', true); + setShowBanner(false); + }; + + const optOut = () => { + pushInstruction('forgetConsentGiven'); + localStorage.setItem('matomoConsent', false); + setShowBanner(false); + }; + + const debug = () => { + pushInstruction(function () { + console.log(this.getRememberedConsent()); + console.log(localStorage.getItem('matomoConsent')); + }); + }; + + const reset = () => { + pushInstruction('forgetConsentGiven'); + localStorage.clear('matomoConsent'); + }; + + if (!showBanner && env === 'dev') { + return ( +
Debugging analytics
+
+ We value your privacy and we only collect statistics and essential cookies. If you'd like to help us improve
+ our websites, you can allow cookies for tracking page views, time on site, and other analytics.
+
+
+
+ Find out how we use cookies and how you can change your settings.
+
+