Skip to content
This repository has been archived by the owner on Mar 22, 2024. It is now read-only.

Commit

Permalink
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(tracking): add matomo trackers
Browse files Browse the repository at this point in the history
Alezco committed Aug 31, 2020
1 parent 4c447e8 commit 008f001
Showing 4 changed files with 119 additions and 55 deletions.
29 changes: 22 additions & 7 deletions src/components/download-link.tsx
Original file line number Diff line number Diff line change
@@ -1,17 +1,32 @@
import { Button } from "@material-ui/core";
import GetAppIcon from "@material-ui/icons/GetApp";
import React, { FC } from "react";
import React, { FC, useCallback } from "react";

import { trackAppDownload } from "../tracker";

type DownloadLinkProps = {
url: string;
label: string;
version: string;
};

const DownloadLink: FC<DownloadLinkProps> = ({ url, label }) => (
<Button target="_blank" href={url} color="inherit" rel="noopener">
<GetAppIcon />
{label}
</Button>
);
const DownloadLink: FC<DownloadLinkProps> = ({ url, label, version }) => {
const onClick = useCallback(() => {
trackAppDownload(version, label);
}, [label]);

return (
<Button
target="_blank"
href={url}
color="inherit"
rel="noopener"
onClick={onClick}
>
<GetAppIcon />
{label}
</Button>
);
};

export default DownloadLink;
12 changes: 11 additions & 1 deletion src/pages/index.tsx
Original file line number Diff line number Diff line change
@@ -14,7 +14,12 @@ import ProductFeatures from "../components/product-features";
import SEO from "../components/seo";
import versions from "../display-data/versions";
import Layout from "../layout";
import { defaultOperatingSystem, getOperatingSystem } from "../utils/os-util";
import { trackAppDownload } from "../tracker";
import {
defaultOperatingSystem,
getOperatingSystem,
OS,
} from "../utils/os-util";

const useStyles = makeStyles((theme: Theme) => ({
downloadLink: {
@@ -40,6 +45,10 @@ const getDownloadLink = (): string => {

const IndexPage: FC = () => {
const classes = useStyles();
const onDownloadClick = () => {
const userOperatingSystem = OS[getOperatingSystem()];
trackAppDownload(versions[0].number, userOperatingSystem);
};
return (
<Layout>
<SEO title="Accueil" />
@@ -54,6 +63,7 @@ const IndexPage: FC = () => {
variant="contained"
size="large"
color="primary"
onClick={onDownloadClick}
startIcon={<GetAppIcon />}
>
Télécharger
98 changes: 51 additions & 47 deletions src/pages/telechargements.tsx
Original file line number Diff line number Diff line change
@@ -9,53 +9,57 @@ import versions from "../display-data/versions";
import Layout from "../layout";
import { getPlatformName, Platform } from "../utils/os-util";

const Telechargements: FC = () => {
return (
<Layout>
<SEO title="Téléchargements" />
<Box p={1}>
<h1>Téléchargements</h1>
<h3>Script</h3>
<Box>
<DownloadLink
url="https://raw.githubusercontent.com/SocialGouv/archifiltre/master/scripts/load-from-filesystem.ps1"
label="Windows"
/>
</Box>
<Box>
<DownloadLink
url="https://raw.githubusercontent.com/SocialGouv/archifiltre/master/scripts/load-filesystem.sh"
label="Linux/MacOS"
/>
</Box>
{versions.map((version) => (
<div key={`${version.name}-${version.number}`}>
<h3>
{`${version.name} ${version.number} - ${version.date} - `}
<Button
color="inherit"
component={GatsbyLink}
to="/changelog"
size="small"
>
Nouveautés de cette version
</Button>
</h3>
<Box>
{version.platforms.map((platform: Platform) => {
const platformName = getPlatformName(platform);
return (
<Box key={`${platformName}-${version.number}`}>
<DownloadLink url={platform.url} label={platformName} />
</Box>
);
})}
</Box>
</div>
))}
const Telechargements: FC = () => (
<Layout>
<SEO title="Téléchargements" />
<Box p={1}>
<h1>Téléchargements</h1>
<h3>Script d&rsquo;import (serveur)</h3>
<Box>
<DownloadLink
url="https://raw.githubusercontent.com/SocialGouv/archifiltre/master/scripts/load-from-filesystem.ps1"
label="Windows"
version="Script"
/>
</Box>
</Layout>
);
};
<Box>
<DownloadLink
url="https://raw.githubusercontent.com/SocialGouv/archifiltre/master/scripts/load-filesystem.sh"
label="Linux/MacOS"
version="Script"
/>
</Box>
{versions.map((version) => (
<div key={`${version.name}-${version.number}`}>
<h3>
{`${version.name} ${version.number} - ${version.date} - `}
<Button
color="inherit"
component={GatsbyLink}
to="/changelog"
size="small"
>
Nouveautés de cette version
</Button>
</h3>
<Box>
{version.platforms.map((platform: Platform) => {
const platformName = getPlatformName(platform);
return (
<Box key={`${platformName}-${version.number}`}>
<DownloadLink
url={platform.url}
label={platformName}
version={version.number}
/>
</Box>
);
})}
</Box>
</div>
))}
</Box>
</Layout>
);

export default Telechargements;
35 changes: 35 additions & 0 deletions src/tracker.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
declare global {
interface Window {
_paq: any[];
}
}

type TrackerAction = {
type: string;
title?: string;
value?: any;
};

const sanitizeTrackerData = (trackerAction: TrackerAction) =>
Object.values(trackerAction).filter(
(actionProperty) => actionProperty !== undefined && actionProperty !== null
);

const addTracker = (trackerAction: TrackerAction): void => {
if (window._paq) {
const sanitizedData = sanitizeTrackerData(trackerAction);
window._paq.push(sanitizedData);
}
};

export const trackAppDownload = (
versionNumber: string,
platform: string
): void => {
addTracker({
type: "trackEvent",
// eslint-disable-next-line sort-keys-fix/sort-keys-fix
title: "download",
value: `v${versionNumber} ${platform}`,
});
};

0 comments on commit 008f001

Please sign in to comment.