fix(og): fix Twitter image size, improve type-safety

Author: WarningImHack3r

src/routes/+layout.ts

@@ -20,7 +20,7 @@ export function load({ url, data }) {
 	return {
 		...data,
 		siteName,
-		baseMetaTags: Object.freeze({
+		baseMetaTags: Object.freeze<MetaTagsProps>({
 			title: "Loading...",
 			titleTemplate: `%s | ${siteName}`,
 			description: "A nice UI to stay up-to-date with Svelte releases",
@@ -41,13 +41,13 @@ export function load({ url, data }) {
 			},
 			twitter: {
 				creator: "@probably_coding",
-				cardType: "summary" as const,
+				cardType: "summary",
 				description: "A nice UI to stay up-to-date with Svelte releases"
 			},
 			keywords: ["svelte", "changelog", "svelte changelog", "sveltekit"],
 			additionalRobotsProps: {
 				noarchive: true
 			}
-		}) satisfies MetaTagsProps
+		})
 	};
 }

src/routes/[pid=pid]/[org]/[repo]/[id=number]/+page.server.ts

@@ -4,6 +4,8 @@ import { publicRepos } from "$lib/repositories";
 import { githubCache } from "$lib/server/github-cache";
 import type { BranchCommit } from "$lib/types";
 
+type Type = "pull" | "issue" | "discussion";
+
 export async function load({ params, fetch }) {
 	const { pid: type, org, repo, id } = params;
 	const numId = +id; // id is already validated by the route matcher
@@ -25,12 +27,10 @@ export async function load({ params, fetch }) {
 			org,
 			repo,
 			id: numId,
-			type:
-				type === "issues"
-					? ("issue" as const)
-					: type === "discussions"
-						? ("discussion" as const)
-						: ("pull" as const)
+			type: type === "issues" ? "issue" : type === "discussions" ? "discussion" : type
+		} satisfies {
+			type: Type;
+			[key: string]: unknown;
 		},
 		item,
 		mergedTagName: new Promise<[string, string] | undefined>((resolve, reject) => {

src/routes/[pid=pid]/[org]/[repo]/[id=number]/+page.ts

@@ -3,7 +3,7 @@ import type { MetaTagsProps } from "svelte-meta-tags";
 export function load({ data, url }) {
 	return {
 		...data,
-		pageMetaTags: Object.freeze({
+		pageMetaTags: Object.freeze<MetaTagsProps>({
 			title: `Detail of ${data.itemMetadata.org}/${data.itemMetadata.repo}#${data.itemMetadata.id}`,
 			openGraph: {
 				images: [
@@ -19,7 +19,10 @@ export function load({ data, url }) {
 						}
 					}
 				]
+			},
+			twitter: {
+				cardType: "summary_large_image"
 			}
-		}) satisfies MetaTagsProps
+		})
 	};
 }

src/routes/devlog/v2/+page.ts

@@ -2,7 +2,7 @@ import type { MetaTagsProps } from "svelte-meta-tags";
 
 export function load({ url }) {
 	return {
-		pageMetaTags: Object.freeze({
+		pageMetaTags: Object.freeze<MetaTagsProps>({
 			title: "v2 • Devlog",
 			description: "The development blog of Svelte Changelog",
 			openGraph: {
@@ -15,7 +15,10 @@ export function load({ url }) {
 						}
 					}
 				]
+			},
+			twitter: {
+				cardType: "summary_large_image"
 			}
-		}) satisfies MetaTagsProps
+		})
 	};
 }

src/routes/package/[...package]/+page.ts

@@ -3,7 +3,7 @@ import type { MetaTagsProps } from "svelte-meta-tags";
 export function load({ data, url }) {
 	return {
 		...data,
-		pageMetaTags: Object.freeze({
+		pageMetaTags: Object.freeze<MetaTagsProps>({
 			title: data.currentPackage.pkg.name,
 			openGraph: {
 				images: [
@@ -19,7 +19,10 @@ export function load({ data, url }) {
 						}
 					}
 				]
+			},
+			twitter: {
+				cardType: "summary_large_image"
 			}
-		}) satisfies MetaTagsProps
+		})
 	};
 }

src/routes/packages/+page.ts

@@ -3,7 +3,7 @@ import type { MetaTagsProps } from "svelte-meta-tags";
 export function load({ data, url }) {
 	return {
 		...data,
-		pageMetaTags: Object.freeze({
+		pageMetaTags: Object.freeze<MetaTagsProps>({
 			title: "All Packages",
 			openGraph: {
 				images: [
@@ -15,7 +15,10 @@ export function load({ data, url }) {
 						}
 					}
 				]
+			},
+			twitter: {
+				cardType: "summary_large_image"
 			}
-		}) satisfies MetaTagsProps
+		})
 	};
 }

src/routes/tracker/[org]/[repo]/+page.ts

@@ -3,7 +3,7 @@ import type { MetaTagsProps } from "svelte-meta-tags";
 export function load({ data, params, url }) {
 	return {
 		...data,
-		pageMetaTags: Object.freeze({
+		pageMetaTags: Object.freeze<MetaTagsProps>({
 			title: `Tracker for ${params.org}/${params.repo}`,
 			openGraph: {
 				images: [
@@ -15,7 +15,10 @@ export function load({ data, params, url }) {
 						}
 					}
 				]
+			},
+			twitter: {
+				cardType: "summary_large_image"
 			}
-		}) satisfies MetaTagsProps
+		})
 	};
 }