Fix author profile link in blog

* Use internal links whenever possible
* Use .jpg in JSON-LD for compatibility, but .webp in the website for
  performance

2 files changed, 28 insertions, 1 deletions

diff --git a/blog/authors.yml b/blog/authors.yml
index 12a86d9..db3ee8b 100644
--- a/blog/authors.yml
+++ b/blog/authors.yml
@@ -6,5 +6,5 @@ kris:
   name: Kristóf Marussy
   title: Software engineering researcher, developer
   url: https://marussy.com
-  image_url: 'https://marussy.com/profile.webp'
+  image_url: 'https://marussy.com/profile.jpg'
   email: kristof@marussy.com
diff --git a/src/theme/BlogPostItem/Header/Author.tsx b/src/theme/BlogPostItem/Header/Author.tsx
new file mode 100644
index 0000000..226caee
--- /dev/null
+++ b/src/theme/BlogPostItem/Header/Author.tsx
@@ -0,0 +1,27 @@
+/*
+ * SPDX-FileCopyrightText: 2024 Kristóf Marussy
+ *
+ * SPDX-License-Identifier: MIT
+ */
+
+import Author from '@theme-original/BlogPostItem/Header/Author';
+import type AuthorType from '@theme/BlogPostItem/Header/Author';
+import type {WrapperProps} from '@docusaurus/types';
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+
+type Props = WrapperProps<typeof AuthorType>;
+
+export default function AuthorWrapper(props: Props): JSX.Element {
+  const { siteConfig: { url } } = useDocusaurusContext();
+  const newProps = {...props};
+  const { author } = props;
+  if (author.url !== undefined && author.url.startsWith(url)) {
+    const newURL = author.url.substring(url.length);
+    newProps.author.url = newURL === '' ? '/' : newURL;
+  }
+  if (author.imageURL !== undefined && author.imageURL.startsWith(url)) {
+    const newImageURL = author.imageURL.substring(url.length);
+    newProps.author.imageURL = newImageURL.replace(/\.jpg$/, '.webp');
+  }
+  return <Author {...newProps} />
+}