From 69086cb333660940d2d2f43df81a7feb87f98809 Mon Sep 17 00:00:00 2001
From: Braydon Coyer <braydon@coyer.net>
Date: Sat, 10 Dec 2022 20:28:18 -0600
Subject: [PATCH] Adds plausible dispatch to track link previews, added Carbon
 ads to multiple pages

---
 components/CustomLink.tsx | 3 +++
 pages/community-wall.tsx  | 4 ++++
 pages/projects.tsx        | 5 +++++
 pages/toolbox.tsx         | 4 ++++
 4 files changed, 16 insertions(+)

diff --git a/components/CustomLink.tsx b/components/CustomLink.tsx
index 72e8044..1c9b246 100644
--- a/components/CustomLink.tsx
+++ b/components/CustomLink.tsx
@@ -2,12 +2,14 @@ import React, { useCallback } from 'react';
 
 import Image from 'next/image';
 import Link from 'next/link';
+import { usePlausible } from 'next-plausible';
 
 export default function CustomLink({ children, href }) {
   let [imagePreview, setImagePreview] = React.useState('');
   let [isHovering, setIsHovering] = React.useState(false);
   let inImagePreview = false;
   let inLink = false;
+  const plausible = usePlausible();
 
   const origin =
     typeof window !== 'undefined' && window.location.origin
@@ -39,6 +41,7 @@ export default function CustomLink({ children, href }) {
       const res = await fetch(`${origin}/api/link-preview?url=${url}`);
       const data = await res.json();
       setImagePreview(data.image);
+      plausible('Link Preview');
     },
     [origin]
   );
diff --git a/pages/community-wall.tsx b/pages/community-wall.tsx
index 21e4915..e46ed68 100644
--- a/pages/community-wall.tsx
+++ b/pages/community-wall.tsx
@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react';
 
+import { Ad } from '@/components/Ad';
 import { CommunityEntry } from '@/components/CommunityEntry';
 import { CommunityForm } from '@/components/CommunityForm';
 import { Container } from 'layouts/Container';
@@ -37,6 +38,9 @@ export default function CommunityWall({ session, supabase, messages }) {
         supabase={supabase}
         session={session}
       />
+      <div className="flex justify-center">
+        <Ad />
+      </div>
       <div className="mt-12">
         {entries.messages?.map((message) => (
           <div className="mt-8" key={message.id}>
diff --git a/pages/projects.tsx b/pages/projects.tsx
index b8228d1..82c036d 100644
--- a/pages/projects.tsx
+++ b/pages/projects.tsx
@@ -1,3 +1,4 @@
+import { Ad } from '@/components/Ad';
 import { Container } from 'layouts/Container';
 import Image from 'next/legacy/image';
 
@@ -77,6 +78,10 @@ export default function Projects() {
         <br />
         <br />
 
+        <div className="flex justify-center">
+          <Ad />
+        </div>
+
         <div className="relative w-full overflow-hidden border rounded-3xl bg-gradient-to-b from-purple-50 dark:from-purple-900/50 dark:to-fuchsia-700 to-fuchsia-300 dark:border-slate-700 border-slate-100">
           <div className="w-full h-[1px] bg-gradient-to-r from-transparent via-fuchsia-300 dark:via-fuchsia-600 to-transparent"></div>
           <div className="grid grid-cols-1 min-h-[500px] max-h-[500px] md:grid-cols-2">
diff --git a/pages/toolbox.tsx b/pages/toolbox.tsx
index a5c6572..b8788ff 100644
--- a/pages/toolbox.tsx
+++ b/pages/toolbox.tsx
@@ -1,5 +1,6 @@
 import { getPageInfo, getToolboxData } from '@/lib/notion';
 
+import { Ad } from '@/components/Ad';
 import { Container } from 'layouts/Container';
 import CustomLink from '@/components/CustomLink';
 import { GetStaticProps } from 'next';
@@ -41,6 +42,9 @@ export default function Toolbox({ software, hardware, thisSite }) {
             ))}
           </div>
         </div>
+        <div className="flex justify-center">
+          <Ad />
+        </div>
         <div className="space-y-12">
           <h2>Hardware</h2>
           <div className="grid grid-cols-1 gap-12 md:grid-cols-4">