From a8af4bab7b74ecead3e0cdc1842e4ad1ad6e1c3f Mon Sep 17 00:00:00 2001 From: Rakov Roman Date: Tue, 31 May 2022 15:06:21 +0300 Subject: [PATCH] feat(#2464): integrated stats code mamoto --- package-lock.json | 30 ++++++++++++++++++++++++ package.json | 1 + src/config/pages.tsx | 1 + src/features/App/index.tsx | 36 ++++++++++++++++++----------- src/features/GlobalStores/index.tsx | 28 +++++++++++++++------- 5 files changed, 75 insertions(+), 21 deletions(-) diff --git a/package-lock.json b/package-lock.json index bab0f7a3..2af43d71 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "spa_instat_tv", "version": "0.1.0", "dependencies": { + "@jonkoops/matomo-tracker-react": "^0.7.0", "@stripe/react-stripe-js": "^1.4.0", "@stripe/stripe-js": "^1.13.2", "babel-polyfill": "^6.26.0", @@ -3711,6 +3712,22 @@ "node": ">=8" } }, + "node_modules/@jonkoops/matomo-tracker": { + "version": "0.7.0", + "resolved": "https://registry.npmjs.org/@jonkoops/matomo-tracker/-/matomo-tracker-0.7.0.tgz", + "integrity": "sha512-ppCXiDaVytTQOP6hNZIBwjUph5IrGgDoQw4IF5sBoA3PBpMAc5tWtPExbVWTR5pJWpTcp11dv2M83n9pm7LpeQ==" + }, + "node_modules/@jonkoops/matomo-tracker-react": { + "version": "0.7.0", + "resolved": "https://registry.npmjs.org/@jonkoops/matomo-tracker-react/-/matomo-tracker-react-0.7.0.tgz", + "integrity": "sha512-3iwG/QM1T6KokU/NZNCkhOccIkhaNnO1+0bTv2JsLbsS7u7hWxpio20gfBjCRd/9N1AMiGidvytG2FK9tu7WFw==", + "dependencies": { + "@jonkoops/matomo-tracker": "^0.7.0" + }, + "peerDependencies": { + "react": ">= 16.8.0" + } + }, "node_modules/@mdx-js/loader": { "version": "1.6.22", "resolved": "https://registry.npmjs.org/@mdx-js/loader/-/loader-1.6.22.tgz", @@ -36087,6 +36104,19 @@ } } }, + "@jonkoops/matomo-tracker": { + "version": "0.7.0", + "resolved": "https://registry.npmjs.org/@jonkoops/matomo-tracker/-/matomo-tracker-0.7.0.tgz", + "integrity": "sha512-ppCXiDaVytTQOP6hNZIBwjUph5IrGgDoQw4IF5sBoA3PBpMAc5tWtPExbVWTR5pJWpTcp11dv2M83n9pm7LpeQ==" + }, + "@jonkoops/matomo-tracker-react": { + "version": "0.7.0", + "resolved": "https://registry.npmjs.org/@jonkoops/matomo-tracker-react/-/matomo-tracker-react-0.7.0.tgz", + "integrity": "sha512-3iwG/QM1T6KokU/NZNCkhOccIkhaNnO1+0bTv2JsLbsS7u7hWxpio20gfBjCRd/9N1AMiGidvytG2FK9tu7WFw==", + "requires": { + "@jonkoops/matomo-tracker": "^0.7.0" + } + }, "@mdx-js/loader": { "version": "1.6.22", "resolved": "https://registry.npmjs.org/@mdx-js/loader/-/loader-1.6.22.tgz", diff --git a/package.json b/package.json index 23a2b040..18c11fc5 100644 --- a/package.json +++ b/package.json @@ -18,6 +18,7 @@ "lff": "REACT_APP_CLIENT=lff react-scripts start" }, "dependencies": { + "@jonkoops/matomo-tracker-react": "^0.7.0", "@stripe/react-stripe-js": "^1.4.0", "@stripe/stripe-js": "^1.13.2", "babel-polyfill": "^6.26.0", diff --git a/src/config/pages.tsx b/src/config/pages.tsx index 357ab69b..12ffcfaa 100644 --- a/src/config/pages.tsx +++ b/src/config/pages.tsx @@ -2,6 +2,7 @@ export const PAGES = { about_the_project: 'https://instatsport.com/InStatTV/ott_platform', home: '/', match: '/matches', + matomoBaseUrl: 'https://matomo.instat.tv/', player: '/players', team: '/teams', tournament: '/tournaments', diff --git a/src/features/App/index.tsx b/src/features/App/index.tsx index 4ad816a6..093fa7f6 100644 --- a/src/features/App/index.tsx +++ b/src/features/App/index.tsx @@ -1,10 +1,13 @@ import { Suspense } from 'react' import { Router } from 'react-router-dom' +import { createInstance, MatomoProvider } from '@jonkoops/matomo-tracker-react' + import { history } from 'config/history' import { client } from 'config/clients' -import { setClientTitleAndDescription } from 'helpers/setClientHeads' +import { PAGES } from 'config/pages' +import { setClientTitleAndDescription } from 'helpers/setClientHeads' import { isMatchPage } from 'helpers/isMatchPage' import { GlobalStores } from 'features/GlobalStores' @@ -18,6 +21,11 @@ import { AuthenticatedApp } from './AuthenticatedApp' setClientTitleAndDescription(client.title, client.description) +const matomoInstance = createInstance({ + siteId: 1, + urlBase: PAGES.matomoBaseUrl, +}) + const Main = () => { const { loadingUser, user } = useAuthStore() @@ -32,18 +40,20 @@ const Main = () => { } const OTTApp = () => ( - - - - - - -
- - - - - + + + + + + + +
+ + + + + + ) export default OTTApp diff --git a/src/features/GlobalStores/index.tsx b/src/features/GlobalStores/index.tsx index 9d858a1e..940222d2 100644 --- a/src/features/GlobalStores/index.tsx +++ b/src/features/GlobalStores/index.tsx @@ -1,9 +1,12 @@ -import { ReactNode } from 'react' +import { ReactNode, useEffect } from 'react' + +import { useMatomo } from '@jonkoops/matomo-tracker-react' import { getLanguageUrlParam } from 'helpers/languageUrlParam' import { AuthStore } from 'features/AuthStore' import { LexicsStore } from 'features/LexicsStore' +import { useLocation } from 'react-router' const initialLanguage = getLanguageUrlParam() @@ -11,10 +14,19 @@ type Props = { children: ReactNode, } -export const GlobalStores = ({ children }: Props) => ( - - - {children} - - -) +export const GlobalStores = ({ children }: Props) => { + const { pathname, search } = useLocation() + const { trackPageView } = useMatomo() + + useEffect(() => { + trackPageView() + }, [trackPageView, pathname, search]) + + return ( + + + {children} + + + ) +}