add fathom
This commit is contained in:
parent
05be8e56a9
commit
4b226b440d
19
app/hooks/use-fathom.ts
Normal file
19
app/hooks/use-fathom.ts
Normal file
@ -0,0 +1,19 @@
|
||||
import { useEffect } from "react";
|
||||
import { useLocation } from "@remix-run/react";
|
||||
import * as Fathom from "fathom-client";
|
||||
|
||||
export default function useFathom() {
|
||||
const location = useLocation();
|
||||
|
||||
useEffect(() => {
|
||||
Fathom.load(window.siteConfig.fathom.siteId, {
|
||||
spa: "history",
|
||||
includedDomains: ["local-ip.sh"],
|
||||
});
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
Fathom.trackPageview();
|
||||
}, [location]);
|
||||
}
|
||||
|
30
app/root.tsx
30
app/root.tsx
@ -1,5 +1,5 @@
|
||||
import { cssBundleHref } from "@remix-run/css-bundle";
|
||||
import type { LinksFunction } from "@remix-run/node";
|
||||
import { json, type SerializeFrom, type LinksFunction } from "@remix-run/node";
|
||||
import {
|
||||
Links,
|
||||
LiveReload,
|
||||
@ -7,13 +7,35 @@ import {
|
||||
Outlet,
|
||||
Scripts,
|
||||
ScrollRestoration,
|
||||
useLoaderData,
|
||||
} from "@remix-run/react";
|
||||
|
||||
import useFathom from "./hooks/use-fathom";
|
||||
|
||||
export const links: LinksFunction = () => [
|
||||
...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
|
||||
];
|
||||
|
||||
export const loader = () =>
|
||||
json({
|
||||
siteConfig: {
|
||||
fathom: {
|
||||
siteId: process.env.FATHOM_SITE_ID!,
|
||||
domain: process.env.FATHOM_CUSTOM_DOMAIN!,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
declare global {
|
||||
interface Window {
|
||||
siteConfig: SerializeFrom<typeof loader>["siteConfig"];
|
||||
}
|
||||
}
|
||||
|
||||
export default function App() {
|
||||
const { siteConfig } = useLoaderData<typeof loader>();
|
||||
useFathom();
|
||||
|
||||
return (
|
||||
<html lang="en">
|
||||
<head>
|
||||
@ -24,6 +46,12 @@ export default function App() {
|
||||
</head>
|
||||
<body>
|
||||
<Outlet />
|
||||
<script
|
||||
suppressHydrationWarning
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: `window.siteConfig=${JSON.stringify(siteConfig)};`,
|
||||
}}
|
||||
/>
|
||||
<ScrollRestoration />
|
||||
<Scripts />
|
||||
<LiveReload />
|
||||
|
6
package-lock.json
generated
6
package-lock.json
generated
@ -10,6 +10,7 @@
|
||||
"@remix-run/node": "^2.3.1",
|
||||
"@remix-run/react": "^2.3.1",
|
||||
"@remix-run/serve": "^2.3.1",
|
||||
"fathom-client": "^3.6.0",
|
||||
"isbot": "^3.6.8",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0"
|
||||
@ -4976,6 +4977,11 @@
|
||||
"reusify": "^1.0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/fathom-client": {
|
||||
"version": "3.6.0",
|
||||
"resolved": "https://registry.npmjs.org/fathom-client/-/fathom-client-3.6.0.tgz",
|
||||
"integrity": "sha512-/mrgmVvpw4HqDCcqUfPulERhONKgnJGL74RAxfqKDuRQ+7w9lKoTHMzqBWE7WNBvmsgZEthQWJFOWOEjv+T3gA=="
|
||||
},
|
||||
"node_modules/fault": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/fault/-/fault-2.0.1.tgz",
|
||||
|
@ -15,6 +15,7 @@
|
||||
"@remix-run/node": "^2.3.1",
|
||||
"@remix-run/react": "^2.3.1",
|
||||
"@remix-run/serve": "^2.3.1",
|
||||
"fathom-client": "^3.6.0",
|
||||
"isbot": "^3.6.8",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0"
|
||||
|
Reference in New Issue
Block a user