Refactor Analytics and Head components

This commit is contained in:
Valentin Popov 2024-09-12 22:57:55 +00:00
parent b16d8ce36c
commit 33c9464dad
Signed by: Valentin Popov
GPG Key ID: AE3CE523DAAA8401
6 changed files with 33 additions and 18 deletions

View File

@ -1,5 +1,17 @@
--- ---
const id = "T5X0z12SoASBV8Dv"; type Props = {
readonly title: string;
};
const path = Astro.url.pathname;
const { title } = Astro.props;
--- ---
<script is:inline src={`https://appmetrix.com/pixel/${id}`}></script> <!-- AppMetrix -->
<script is:inline src="https://appmetrix.com/pixel/T5X0z12SoASBV8Dv"></script>
<!-- GoatCounter -->
<script is:inline data-goatcounter="https://analytics.popov.link/count" src="//gc.zgo.at/count.js"></script>
<noscript>
<img alt="pixel" src={`https://analytics.popov.link/count?p=${path}&t=${title}`} />
</noscript>

View File

@ -1,18 +1,18 @@
--- ---
type Props = { type Props = {
readonly description?: string; readonly description: string;
readonly title?: string; readonly title: string;
}; };
const canonicalURL = new URL(Astro.url.pathname, Astro.site); const canonicalURL = new URL(Astro.url.pathname, Astro.site);
const { title, description } = Astro.props; const { description, title } = Astro.props;
--- ---
<head> <head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content={description ?? import.meta.env.DEFAULT_DESCRIPTION} /> <meta name="description" content={description} />
<meta name="robots" content="index, follow" /> <meta name="robots" content="index, follow" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
@ -20,5 +20,5 @@ const { title, description } = Astro.props;
<link href="/sitemap-index.xml" rel="sitemap" /> <link href="/sitemap-index.xml" rel="sitemap" />
<link href={canonicalURL} rel="canonical" /> <link href={canonicalURL} rel="canonical" />
<title>{title ?? import.meta.env.DEFAULT_TITLE}</title> <title>{title}</title>
</head> </head>

View File

@ -3,11 +3,11 @@ import Next from "./Pagination/Next.astro";
import Prev from "./Pagination/Prev.astro"; import Prev from "./Pagination/Prev.astro";
type Props = { type Props = {
readonly prevUrl?: string;
readonly nextUrl?: string; readonly nextUrl?: string;
readonly prevUrl?: string;
}; };
const { prevUrl, nextUrl } = Astro.props; const { nextUrl, prevUrl } = Astro.props;
--- ---
<style lang="scss"> <style lang="scss">

View File

@ -9,17 +9,20 @@ type Props = {
readonly title?: string; readonly title?: string;
}; };
const { title, description } = Astro.props; const { description, title } = Astro.props;
--- ---
<html lang="ru"> <html lang="ru">
<Head title={title} description={description} /> <Head
description={description ?? import.meta.env.DEFAULT_DESCRIPTION}
title={title ?? import.meta.env.DEFAULT_TITLE}
/>
<body> <body>
<Header /> <Header />
<main> <main>
<slot /> <slot />
</main> </main>
<Analytics /> <Analytics title={title ?? import.meta.env.DEFAULT_TITLE} />
</body> </body>
</html> </html>

View File

@ -5,6 +5,8 @@ import Layout from "../layouts/BaseLayout.astro";
import Pagination from "../components/Pagination.astro"; import Pagination from "../components/Pagination.astro";
import PostSummary from "../components/PostSummary.astro"; import PostSummary from "../components/PostSummary.astro";
type Props = InferGetStaticPropsType<typeof getStaticPaths>;
export const getStaticPaths = (async ({ paginate }) => { export const getStaticPaths = (async ({ paginate }) => {
const posts = await getCollection("blog"); const posts = await getCollection("blog");
posts.sort((a, b) => b.data.pubDate.getTime() - a.data.pubDate.getTime()); posts.sort((a, b) => b.data.pubDate.getTime() - a.data.pubDate.getTime());
@ -14,8 +16,6 @@ export const getStaticPaths = (async ({ paginate }) => {
}); });
}) satisfies GetStaticPaths; }) satisfies GetStaticPaths;
type Props = InferGetStaticPropsType<typeof getStaticPaths>;
const { page } = Astro.props; const { page } = Astro.props;
--- ---
@ -25,6 +25,6 @@ const { page } = Astro.props;
</section> </section>
<section> <section>
<Pagination prevUrl={page.url.prev} nextUrl={page.url.next} /> <Pagination nextUrl={page.url.next} prevUrl={page.url.prev} />
</section> </section>
</Layout> </Layout>

View File

@ -3,6 +3,8 @@ import { type CollectionEntry, getCollection } from "astro:content";
import Comments from "../../components/Comments.astro"; import Comments from "../../components/Comments.astro";
import Layout from "../../layouts/BaseLayout.astro"; import Layout from "../../layouts/BaseLayout.astro";
type Props = CollectionEntry<"blog">;
export async function getStaticPaths() { export async function getStaticPaths() {
const posts = await getCollection("blog"); const posts = await getCollection("blog");
@ -12,8 +14,6 @@ export async function getStaticPaths() {
})); }));
} }
type Props = CollectionEntry<"blog">;
const post = Astro.props; const post = Astro.props;
const { Content, remarkPluginFrontmatter } = await post.render(); const { Content, remarkPluginFrontmatter } = await post.render();
--- ---
@ -24,7 +24,7 @@ const { Content, remarkPluginFrontmatter } = await post.render();
} }
</style> </style>
<Layout title={post.data.title} description={post.data.description}> <Layout description={post.data.description} title={post.data.title}>
<article> <article>
<section class="header"> <section class="header">
<h1>{post.data.title}</h1> <h1>{post.data.title}</h1>