acid-info
/
logos-press-engine
mirror of https://github.com/acid-info/logos-press-engine.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor: refactor fathom with custom hooks

This commit is contained in:
jinhojang6 2023-10-25 22:24:34 +09:00 committed by Jinho Jang
parent 3ec59c7a64
commit bbd8ef2ede
7 changed files with 41 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.env
View File

@ -3,4 +3,5 @@ UNBODY_PROJECT_ID=
SIMPLECAST_ACCESS_TOKEN=
REVALIDATE_WEBHOOK_TOKEN=
DISCORD_LOGS_WEBHOOK_URL=
NEXT_PUBLIC_SITE_URL=
NEXT_PUBLIC_SITE_URL=
FATHOM_SITE_ID=

1
README.md
View File

@ -25,6 +25,7 @@ UNBODY_PROJECT_ID=
SIMPLECAST_ACCESS_TOKEN=
REVALIDATE_WEBHOOK_TOKEN=
NEXT_PUBLIC_SITE_URL=https://press.logos.co
FATHOM_SITE_ID=
```
This is a template for `.env.local`, which is included in `.gitignore`.

2
src/pages/_app.tsx
View File

@ -2,6 +2,7 @@ import { GlobalAudioPlayer } from '@/components/GlobalAudioPlayer'
import { ProgressBar } from '@/components/ProgressBar/ProgressBar'
import { uiConfigs } from '@/configs/ui.configs'
import { DefaultLayout } from '@/layouts/DefaultLayout'
import useFathomAnalytics from '@/utils/useFathomAnalytics'
import { css, Global } from '@emotion/react'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import { NextComponentType, NextPageContext } from 'next'
@ -27,6 +28,7 @@ const queryClient = new QueryClient()
export default function App({ Component, pageProps }: AppLayoutProps) {
const hydrated = useHydrated()
useFathomAnalytics()
const getLayout =
Component.getLayout ||

4
src/pages/_document.tsx
View File

@ -1,6 +1,8 @@
import { Head, Html, Main, NextScript } from 'next/document'
import { defaultThemeState } from '../states/themeState'
const fathom = process.env.FATHOM_SITE_ID || ''
export default function Document() {
return (
<Html lang="en" data-theme="light">
@ -21,7 +23,7 @@ export default function Document() {
o.async=1; o.src=t; o.id='fathom-script';
m.parentNode.insertBefore(o,m)
})(document, window, '//fathom.status.im/tracker.js', 'fathom');
fathom('set', 'siteId', 'VERNO');
fathom('set', 'siteId', '${fathom}');
fathom('trackPageview');`,
}}
/>

24
src/utils/useFathomAnalytics.ts Normal file
View File

@ -0,0 +1,24 @@
import Router from 'next/router'
import { useEffect } from 'react'
const useFathomAnalytics = () => {
useEffect(() => {
if (window.fathom) {
window.fathom('trackPageview')
}
const handleRouteChange = () => {
if (window.fathom) {
window.fathom('trackPageview')
}
}
Router.events.on('routeChangeComplete', handleRouteChange)
return () => {
Router.events.off('routeChangeComplete', handleRouteChange)
}
}, [])
}
export default useFathomAnalytics

2
tsconfig.json
View File

@ -19,6 +19,6 @@
"@/*": ["./src/*"]
}
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "./types"],
"exclude": ["node_modules"]
}

8
types/fathom.d.ts vendored Normal file
View File

@ -0,0 +1,8 @@
interface Fathom {
(command: string, ...args: any[]): void
q?: Array<any>
}
interface Window {
fathom?: Fathom
}