8 files changed, 92 insertions, 29 deletions
diff --git a/src/components/Head.astro b/src/components/Head.astro
index 258162d..fbfba1c 100644
--- a/src/components/Head.astro
+++ b/src/components/Head.astro
@@ -1,33 +1,44 @@
 ---
 import type { Thing } from "schema-dts";
+import { config } from "../config";
 import JsonLd from "./JsonLd.astro";
 
 type Props = {
 	readonly description: string;
+	readonly lang: string;
+	readonly modifiedTime?: string;
+	readonly ogType?: "website" | "article";
 	readonly preview: string;
+	readonly publishedTime?: string;
 	readonly robots?: string;
 	readonly schema: Thing[];
 	readonly title: string;
 };
 
-const { description, preview, robots = "index, follow", schema, title } = Astro.props;
+const { description, lang, modifiedTime, ogType = "website", preview, publishedTime, robots = "index, follow", schema, title } = Astro.props;
 
 const canonicalUrl = new URL(Astro.url.pathname, Astro.site);
 const previewUrl = new URL(preview, Astro.site);
+const ogLocale = lang === "ru" ? "ru_RU" : "en_US";
 ---
 
 <head>
 	<!-- Meta Tags -->
-	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
-	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1" />
 
 	<meta name="description" content={description} />
 	<meta name="robots" content={robots} />
-	<meta name="viewport" content="width=device-width, initial-scale=1" />
+	<meta name="author" content={config.author.name} />
 
 	<link href="/feed.xml" rel="alternate" title="RSS" type="application/atom+xml" />
 	<link href="/sitemap-index.xml" rel="sitemap" />
 	<link href={canonicalUrl} rel="canonical" />
+	<link href={config.author.url} rel="author" />
+
+	<!-- hreflang -->
+	<link rel="alternate" hreflang={lang} href={canonicalUrl} />
+	<link rel="alternate" hreflang="x-default" href={canonicalUrl} />
 
 	<title>{title}</title>
 
@@ -36,20 +47,32 @@ const previewUrl = new URL(preview, Astro.site);
 	<link rel="icon" type="image/png" href="/favicon.png" />
 	<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
 	<link rel="manifest" href="/manifest.json" />
-	<meta name="theme-color" content="#ffffff" />
+	<meta name="theme-color" content="#181818" />
 
 	<!-- Open Graph -->
-	<meta property="og:type" content="website" />
+	<meta property="og:type" content={ogType} />
+	<meta property="og:site_name" content={config.og.website} />
+	<meta property="og:locale" content={ogLocale} />
 	<meta property="og:title" content={title} />
 	<meta property="og:description" content={description} />
-	<meta property="og:image" content={previewUrl} />
 	<meta property="og:url" content={canonicalUrl} />
+	<meta property="og:image" content={previewUrl} />
+	<meta property="og:image:width" content={String(config.og.dimensions.width)} />
+	<meta property="og:image:height" content={String(config.og.dimensions.height)} />
+	<meta property="og:image:alt" content={title} />
+
+	{ogType === "article" && publishedTime && <meta property="article:published_time" content={publishedTime} />}
+	{ogType === "article" && modifiedTime && <meta property="article:modified_time" content={modifiedTime} />}
+	{ogType === "article" && <meta property="article:author" content={config.author.url} />}
 
 	<!-- Twitter Cards -->
 	<meta name="twitter:card" content="summary_large_image" />
+	<meta name="twitter:site" content="@valyaha" />
+	<meta name="twitter:creator" content="@valyaha" />
 	<meta name="twitter:title" content={title} />
 	<meta name="twitter:description" content={description} />
 	<meta name="twitter:image" content={previewUrl} />
+	<meta name="twitter:image:alt" content={title} />
 
 	<JsonLd schema={schema} />
 </head>
diff --git a/src/components/Header.astro b/src/components/Header.astro
index f9a0c57..3013520 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -10,7 +10,7 @@
 
 <header>
 	<nav aria-label="Navigation">
-		<a href="/" lang="en" aria-label="Home">Home</a>
-		<a href="/blog/" lang="en" aria-label="Blog">Blog</a>
+		<a href="/" lang="en">Home</a>
+		<a href="/blog/" lang="en">Blog</a>
 	</nav>
 </header>
diff --git a/src/components/PostElement.astro b/src/components/PostElement.astro
index 051a8ff..e201102 100644
--- a/src/components/PostElement.astro
+++ b/src/components/PostElement.astro
@@ -31,7 +31,7 @@ const datePublished = post.data.datePublished.toISOString();
 		<a href={`/blog/${post.id}`} lang={post.data.lang}>{post.data.title}</a>
 		<div>
 			<small>
-				<time datetime={datePublished} lang="en">{formattedDate}</time>
+				<time datetime={datePublished} lang={post.data.lang}>{formattedDate}</time>
 				<span>•</span>
 				<span>{remarkPluginFrontmatter.minutesRead}</span>
 			</small>
diff --git a/src/components/Sections/LatestPosts.astro b/src/components/Sections/LatestPosts.astro
index 5c6afd9..daba4c8 100644
--- a/src/components/Sections/LatestPosts.astro
+++ b/src/components/Sections/LatestPosts.astro
@@ -32,7 +32,7 @@ const latestPosts = posts.slice(0, 5);
 					</a>
 
 					<small>
-						<time datetime={post.data.datePublished.toISOString()} lang="en">
+						<time datetime={post.data.datePublished.toISOString()} lang={post.data.lang}>
 							{dayjs(post.data.datePublished.toString()).format("MMMM DD, YYYY")}
 						</time>
 					</small>
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index a2f0327..8336a3c 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -8,17 +8,20 @@ import "../scss/global.scss";
 type Props = {
 	readonly description: string;
 	readonly lang: string;
+	readonly modifiedTime?: string;
+	readonly ogType?: "website" | "article";
 	readonly preview: string;
+	readonly publishedTime?: string;
 	readonly robots?: string;
 	readonly schema: Thing[];
 	readonly title: string;
 };
 
-const { description, lang, preview, robots, schema, title } = Astro.props;
+const { description, lang, modifiedTime, ogType, preview, publishedTime, robots, schema, title } = Astro.props;
 ---
 
 <html lang={lang}>
-	<Head title={title} description={description} preview={preview} robots={robots} schema={schema} />
+	<Head title={title} description={description} preview={preview} robots={robots} schema={schema} lang={lang} ogType={ogType} publishedTime={publishedTime} modifiedTime={modifiedTime} />
 
 	<body>
 		<main>
diff --git a/src/pages/blog/[...slug].astro b/src/pages/blog/[...slug].astro
index 5ba6b3b..907f64e 100644
--- a/src/pages/blog/[...slug].astro
+++ b/src/pages/blog/[...slug].astro
@@ -1,9 +1,9 @@
 ---
 import { type CollectionEntry, getCollection, render } from "astro:content";
+import dayjs from "dayjs";
 import blogPostSchema from "../../utils/schemas/blogPostSchema";
 import breadcrumbSchema from "../../utils/schemas/breadcrumbSchema";
 import Comments from "../../components/Comments.astro";
-import dayjs from "dayjs";
 import Layout from "../../layouts/BaseLayout.astro";
 import personSchema from "../../utils/schemas/personSchema";
 import websiteSchema from "../../utils/schemas/websiteSchema";
@@ -31,9 +31,10 @@ const isBasedOn = post.data.basedOn;
 const lang = post.data.lang;
 const preview = `/images/preview/${post.id}.png`;
 const slug = post.id;
-const title = post.data.title;
+const headline = post.data.title;
+const title = `${post.data.title} | Valentin Popov`;
 
-const dateModified = post.data.dateModified?.toISOString();
+const dateModified = (post.data.dateModified ?? post.data.datePublished).toISOString();
 const datePublished = post.data.datePublished.toISOString();
 const formattedDate = dayjs(post.data.datePublished.toString()).format("MMMM DD, YYYY");
 
@@ -51,14 +52,14 @@ const schema = [
 		lang,
 		preview,
 		slug,
-		title,
+		title: headline,
 	}),
 	breadcrumbSchema({
 		siteUrl,
 		items: [
 			{ name: "Home", url: "/" },
 			{ name: "Blog", url: "/blog/" },
-			{ name: title, url: `/blog/${slug}` },
+			{ name: headline, url: `/blog/${slug}` },
 		],
 	}),
 ];
@@ -72,10 +73,10 @@ const schema = [
 	}
 </style>
 
-<Layout title={title} description={description} preview={preview} lang={lang} schema={schema}>
+<Layout title={title} description={description} preview={preview} lang={lang} schema={schema} ogType="article" publishedTime={datePublished} modifiedTime={dateModified}>
 	<article>
 		<header>
-			<h1>{title}</h1>
+			<h1>{headline}</h1>
 
 			<p>
 				<small>
diff --git a/src/pages/feed.xml.js b/src/pages/feed.xml.js
index 5aea78b..005f2d8 100644
--- a/src/pages/feed.xml.js
+++ b/src/pages/feed.xml.js
@@ -1,24 +1,47 @@
 import { getCollection } from "astro:content";
+import MarkdownIt from "markdown-it";
 import rss from "@astrojs/rss";
+import sanitizeHtml from "sanitize-html";
+import { config } from "../config";
+
+const parser = new MarkdownIt({ html: true, linkify: true });
 
 export async function GET(context) {
 	const title = "RSS Feed | Valentin Popov Blog";
 	const description = "Follow the latest posts from Valentin Popov via RSS.";
 
-	const posts = await getCollection("blog", ({ data }) => {
-		return data.draft !== true;
-	});
+	const posts = (await getCollection("blog", ({ data }) => data.draft !== true)).sort((a, b) => b.data.datePublished.getTime() - a.data.datePublished.getTime());
+
+	const feedUrl = new URL("/feed.xml", context.site).toString();
 
 	return rss({
-		customData: `<language>en</language>`,
-		description: description,
+		title,
+		description,
+		site: context.site,
+		xmlns: {
+			atom: "http://www.w3.org/2005/Atom",
+			content: "http://purl.org/rss/1.0/modules/content/",
+			dc: "http://purl.org/dc/elements/1.1/",
+		},
+		customData: [`<language>en</language>`, `<atom:link href="${feedUrl}" rel="self" type="application/rss+xml"/>`].join(""),
 		items: posts.map((post) => ({
+			title: post.data.title,
 			description: post.data.description,
-			link: `/blog/${post.id}`,
+			link: `/blog/${post.id}/`,
 			pubDate: post.data.datePublished,
-			title: post.data.title,
+			author: `${config.author.email} (${config.author.name})`,
+			content: sanitizeHtml(parser.render(post.body ?? ""), {
+				allowedTags: sanitizeHtml.defaults.allowedTags.concat(["img", "pre", "code", "span"]),
+				allowedAttributes: {
+					...sanitizeHtml.defaults.allowedAttributes,
+					img: ["src", "alt", "title", "loading", "decoding"],
+					code: ["class"],
+					span: ["class", "style"],
+					pre: ["class", "style"],
+					a: ["href", "name", "target", "rel"],
+				},
+			}),
+			customData: `<dc:language>${post.data.lang}</dc:language>`,
 		})),
-		site: context.site,
-		title: title,
 	});
 }
diff --git a/src/plugins/rehypeLazyImages.ts b/src/plugins/rehypeLazyImages.ts
new file mode 100644
index 0000000..eb470a4
--- /dev/null
+++ b/src/plugins/rehypeLazyImages.ts
@@ -0,0 +1,13 @@
+import type { Element, Root } from "hast";
+import { visit } from "unist-util-visit";
+
+export default function rehypeLazyImages() {
+	return (tree: Root): void => {
+		visit(tree, "element", (node: Element) => {
+			if (node.tagName !== "img") return;
+			node.properties ??= {};
+			node.properties.loading ??= "lazy";
+			node.properties.decoding ??= "async";
+		});
+	};
+}