Migrate more code to typescript

src/components/atoms/Pagination.astro

@@ -16,11 +16,7 @@ const { prevUrl, nextUrl, prevText = 'Newer posts', nextText = 'Older posts' } =
 	(prevUrl || nextUrl) && (
 		<div class="container flex">
 			<div class="flex flex-row mx-auto container justify-between">
-				<a
-					href={getRelativeLink(prevUrl)}
-					class={`btn btn-ghost px-3 mr-2
-      ${!prevUrl ? 'invisible' : ''}`}
-				>
+				<a href={getRelativeLink(prevUrl)} class={`btn btn-ghost px-3 mr-2 ${!prevUrl ? 'invisible' : ''}`}>
 					<div class="flex flex-row align-middle">
 						<Icon name="tabler:arrow-left" class="w-6 h-6" />
 						<p class="ml-2">{prevText}</p>

src/components/atoms/Tags.astro

@@ -1,7 +1,7 @@
 ---
 import { getPermalink } from '~/utils/permalinks';
 
-import type { Post } from '~/utils/posts';
+import type { Post } from "~/types"
 
 export interface Props {
 	tags: Post['tags'];

src/components/blog/Grid.astro

@@ -1,6 +1,6 @@
 ---
 import Item from '~/components/blog/GridItem.astro';
-import type { Post } from '~/utils/posts';
+import type { Post } from "~/types"
 
 export interface Props {
 	posts: Array<Post>;

src/components/blog/GridItem.astro

@@ -4,7 +4,7 @@ import { Picture } from '@astrojs/image/components';
 import { findImage } from '~/utils/images';
 import { getPermalink } from '~/utils/permalinks';
 
-import type { Post } from '~/utils/posts';
+import type { Post } from "~/types"
 
 export interface Props {
 	post: Post;

src/components/blog/List.astro

@@ -1,6 +1,6 @@
 ---
 import Item from '~/components/blog/ListItem.astro';
-import type { Post } from '~/utils/posts';
+import type { Post } from "~/types"
 
 export interface Props {
 	posts: Array<Post>;

src/components/blog/ListItem.astro

@@ -6,7 +6,7 @@ import { getPermalink } from '~/utils/permalinks';
 import { findImage } from '~/utils/images';
 import { getFormattedDate } from '~/utils/utils';
 
-import type { Post } from '~/utils/posts';
+import type { Post } from "~/types"
 
 export interface Props {
 	post: Post;

src/components/blog/SinglePost.astro

@@ -5,7 +5,7 @@ import SocialShare from '~/components/atoms/SocialShare.astro';
 
 import { getFormattedDate } from '~/utils/utils';
 
-import type { Post } from '~/utils/posts';
+import type { Post } from "~/types"
 
 export interface Props {
 	post: Post;

src/components/core/MetaTags.astro

@@ -11,6 +11,8 @@ import Fonts from '../atoms/Fonts.astro';
 import ExtraMetaTags from '../atoms/ExtraMetaTags.astro';
 import SplitbeeAnalytics from './SplitbeeAnalytics.astro';
 
+import { MetaSEO } from '~/types';
+
 const { src: defaultImage } = await getImage({
 	src: defaultImageSrc,
 	alt: 'Default image',
@@ -18,6 +20,8 @@ const { src: defaultImage } = await getImage({
 	height: 628,
 });
 
+export interface Props extends MetaSEO {}
+
 const {
 	title = SITE.name,
 	description = '',

src/env.d.ts

@@ -1 +1 @@
-/// <reference types="astro/client" />
+/// <reference types="@astrojs/image/client" />

src/layouts/BaseLayout.astro

@@ -4,6 +4,12 @@ import '~/assets/styles/base.css';
 import MetaTags from '~/components/core/MetaTags.astro';
 import BasicScripts from '~/components/core/BasicScripts.astro';
 
+import { MetaSEO } from '~/types';
+
+export interface Props {
+	meta?: MetaSEO;
+}
+
 const { meta = {} } = Astro.props;
 ---
 

src/layouts/BlogLayout.astro

@@ -1,6 +1,12 @@
 ---
 import Layout from '~/layouts/PageLayout.astro';
 
+import { MetaSEO } from '~/types';
+
+export interface Props {
+	meta?: MetaSEO;
+}
+
 const { meta } = Astro.props;
 ---
 

src/layouts/PageLayout.astro

@@ -4,6 +4,12 @@ import Header from '~/components/widgets/Header.astro';
 import Footer from '~/components/widgets/Footer.astro';
 import Announcement from '~/components/widgets/Announcement.astro';
 
+import { MetaSEO } from '~/types';
+
+export interface Props {
+	meta?: MetaSEO;
+}
+
 const { meta } = Astro.props;
 ---
 

src/types.ts

@@ -0,0 +1,37 @@
+export interface Post {
+	id: string;
+	slug: string;
+
+	publishDate: Date;
+	title: string;
+	description?: string;
+
+	image?: string;
+
+	canonical?: string | URL;
+	permalink?: string;
+
+	draft?: boolean;
+
+	excerpt?: string;
+	category?: string;
+	tags?: Array<string>;
+	authors?: Array<string>;
+
+	Content: unknown;
+	content?: string;
+	readingTime: number;
+}
+
+export interface MetaSEO {
+  title?: string,
+	description?: string,
+	image?: string,
+
+	canonical?: string,
+	noindex?: boolean,
+	nofollow?: boolean,
+
+	ogTitle?: string,
+	ogType?: string,
+}

src/utils/posts.ts

@@ -1,30 +1,6 @@
 import { getCollection, getEntry } from 'astro:content';
 import type { CollectionEntry } from 'astro:content';
-
-export interface Post {
-	id: string;
-	slug: string;
-
-	publishDate: Date;
-	title: string;
-	description?: string;
-
-	image?: string;
-
-	canonical?: string;
-	permalink?: string;
-
-	draft?: boolean;
-
-	excerpt?: string;
-	category?: string;
-	tags?: Array<string>;
-	authors?: Array<string>;
-
-	Content: unknown;
-	content?: string;
-	readingTime: number;
-}
+import type { Post } from "~/types"
 
 const getNormalizedPost = async (post: CollectionEntry<'blog'>): Promise<Post> => {
 	const { id, slug, data } = post;