Header+Footer: log GA events on download(s)

This commit is contained in:
rektdeckard
2020-10-10 01:17:23 -04:00
parent 079633d8f6
commit ae9e71886b
2 changed files with 44 additions and 16 deletions

View File

@@ -1,5 +1,6 @@
import React from "react";
import { ArrowElbowDownRight, Coffee, Heart } from "phosphor-react";
import { OutboundLink } from "react-ga";
import uArrowUpLeft from "../../assets/u-arrow-up-left.svg";
import markerGreen from "../../assets/marker-green.svg";
@@ -37,25 +38,35 @@ const Footer: React.FC<FooterProps> = () => {
<div className="links">
<div>
<ArrowElbowDownRight size={24} />
<a
<OutboundLink
className="nav-link"
href="https://phosphoricons.com/assets/phosphor-icons.zip"
to="https://phosphoricons.com/assets/phosphor-icons.zip"
eventLabel="Download all"
download
type="application/zip"
>
Download all
</a>
</OutboundLink>
</div>
<div>
<ArrowElbowDownRight size={24} />
<a className="nav-link" href="#">
<OutboundLink
className="nav-link"
to="#"
eventLabel="Figma library"
>
Figma library
</a>
</OutboundLink>
</div>
<div>
<ArrowElbowDownRight size={24} />
<a className="nav-link" href="#">
<OutboundLink
className="nav-link"
to="#"
eventLabel="Figma plugin"
>
Figma plugin
</a>
</OutboundLink>
</div>
<div>
<ArrowElbowDownRight size={24} />
@@ -73,7 +84,10 @@ const Footer: React.FC<FooterProps> = () => {
Donate on PayPal
</a>
{" / "}
<a className="nav-link" href="https://patreon.com/phosphoricons">
<a
className="nav-link"
href="https://patreon.com/phosphoricons"
>
Patreon
</a>
</span>

View File

@@ -4,6 +4,7 @@ import {
ArrowCircleDown,
ArrowElbowDownRight,
} from "phosphor-react";
import { OutboundLink } from "react-ga";
import "./Header.css";
import markerPurple from "../../assets/marker-purple.svg";
@@ -76,25 +77,35 @@ const Header: React.FC<HeaderProps> = () => {
<div className="links">
<div>
<ArrowElbowDownRight size={24} />
<a
<OutboundLink
className="nav-link"
href="https://phosphoricons.com/assets/phosphor-icons.zip"
to="https://phosphoricons.com/assets/phosphor-icons.zip"
eventLabel="Download all"
download
type="application/zip"
>
Download all
</a>
</OutboundLink>
</div>
<div>
<ArrowElbowDownRight size={24} />
<a className="nav-link" href="#">
<OutboundLink
className="nav-link"
to="#"
eventLabel="Figma library"
>
Figma library
</a>
</OutboundLink>
</div>
<div>
<ArrowElbowDownRight size={24} />
<a className="nav-link" href="#">
<OutboundLink
className="nav-link"
to="#"
eventLabel="Figma plugin"
>
Figma plugin
</a>
</OutboundLink>
</div>
<div>
<ArrowElbowDownRight size={24} />
@@ -112,7 +123,10 @@ const Header: React.FC<HeaderProps> = () => {
Donate on PayPal
</a>
{" / "}
<a className="nav-link" href="https://patreon.com/phosphoricons">
<a
className="nav-link"
href="https://patreon.com/phosphoricons"
>
Patreon
</a>
</span>