design tweaks and astro 3

.astro/types.d.ts

@@ -1,12 +1,3 @@
-declare module 'astro:content' {
-	interface Render {
-		'.mdx': Promise<{
-			Content: import('astro').MarkdownInstance<{}>['Content'];
-			headings: import('astro').MarkdownHeading[];
-			remarkPluginFrontmatter: Record<string, any>;
-		}>;
-	}
-}
 declare module 'astro:content' {
 	interface Render {
 		'.md': Promise<{
@@ -19,11 +10,17 @@ declare module 'astro:content' {
 
 declare module 'astro:content' {
 	export { z } from 'astro/zod';
-	export type CollectionEntry<C extends keyof typeof entryMap> =
-		(typeof entryMap)[C][keyof (typeof entryMap)[C]];
+
+	type Flatten<T> = T extends { [K: string]: infer U } ? U : never;
+
+	export type CollectionKey = keyof AnyEntryMap;
+	export type CollectionEntry<C extends CollectionKey> = Flatten<AnyEntryMap[C]>;
+
+	export type ContentCollectionKey = keyof ContentEntryMap;
+	export type DataCollectionKey = keyof DataEntryMap;
 
 	// This needs to be in sync with ImageMetadata
-	export const image: () => import('astro/zod').ZodObject<{
+	export type ImageFunction = () => import('astro/zod').ZodObject<{
 		src: import('astro/zod').ZodString;
 		width: import('astro/zod').ZodNumber;
 		height: import('astro/zod').ZodNumber;
@@ -35,252 +32,340 @@ declare module 'astro:content' {
 				import('astro/zod').ZodLiteral<'tiff'>,
 				import('astro/zod').ZodLiteral<'webp'>,
 				import('astro/zod').ZodLiteral<'gif'>,
-				import('astro/zod').ZodLiteral<'svg'>
+				import('astro/zod').ZodLiteral<'svg'>,
+				import('astro/zod').ZodLiteral<'avif'>,
 			]
 		>;
 	}>;
 
 	type BaseSchemaWithoutEffects =
 		| import('astro/zod').AnyZodObject
-		| import('astro/zod').ZodUnion<import('astro/zod').AnyZodObject[]>
+		| import('astro/zod').ZodUnion<[BaseSchemaWithoutEffects, ...BaseSchemaWithoutEffects[]]>
 		| import('astro/zod').ZodDiscriminatedUnion<string, import('astro/zod').AnyZodObject[]>
-		| import('astro/zod').ZodIntersection<
-				import('astro/zod').AnyZodObject,
-				import('astro/zod').AnyZodObject
-		  >;
+		| import('astro/zod').ZodIntersection<BaseSchemaWithoutEffects, BaseSchemaWithoutEffects>;
 
 	type BaseSchema =
 		| BaseSchemaWithoutEffects
 		| import('astro/zod').ZodEffects<BaseSchemaWithoutEffects>;
 
-	type BaseCollectionConfig<S extends BaseSchema> = {
-		schema?: S;
-		slug?: (entry: {
-			id: CollectionEntry<keyof typeof entryMap>['id'];
-			defaultSlug: string;
-			collection: string;
-			body: string;
-			data: import('astro/zod').infer<S>;
-		}) => string | Promise<string>;
-	};
-	export function defineCollection<S extends BaseSchema>(
-		input: BaseCollectionConfig<S>
-	): BaseCollectionConfig<S>;
+	export type SchemaContext = { image: ImageFunction };
+
+	type DataCollectionConfig<S extends BaseSchema> = {
+		type: 'data';
+		schema?: S | ((context: SchemaContext) => S);
+	};
+
+	type ContentCollectionConfig<S extends BaseSchema> = {
+		type?: 'content';
+		schema?: S | ((context: SchemaContext) => S);
+	};
+
+	type CollectionConfig<S> = ContentCollectionConfig<S> | DataCollectionConfig<S>;
+
+	export function defineCollection<S extends BaseSchema>(
+		input: CollectionConfig<S>
+	): CollectionConfig<S>;
 
-	type EntryMapKeys = keyof typeof entryMap;
 	type AllValuesOf<T> = T extends any ? T[keyof T] : never;
-	type ValidEntrySlug<C extends EntryMapKeys> = AllValuesOf<(typeof entryMap)[C]>['slug'];
+	type ValidContentEntrySlug<C extends keyof ContentEntryMap> = AllValuesOf<
+		ContentEntryMap[C]
+	>['slug'];
 
 	export function getEntryBySlug<
-		C extends keyof typeof entryMap,
-		E extends ValidEntrySlug<C> | (string & {})
+		C extends keyof ContentEntryMap,
+		E extends ValidContentEntrySlug<C> | (string & {}),
 	>(
 		collection: C,
 		// Note that this has to accept a regular string too, for SSR
 		entrySlug: E
-	): E extends ValidEntrySlug<C>
+	): E extends ValidContentEntrySlug<C>
 		? Promise<CollectionEntry<C>>
 		: Promise<CollectionEntry<C> | undefined>;
-	export function getCollection<C extends keyof typeof entryMap, E extends CollectionEntry<C>>(
+
+	export function getDataEntryById<C extends keyof DataEntryMap, E extends keyof DataEntryMap[C]>(
+		collection: C,
+		entryId: E
+	): Promise<CollectionEntry<C>>;
+
+	export function getCollection<C extends keyof AnyEntryMap, E extends CollectionEntry<C>>(
 		collection: C,
 		filter?: (entry: CollectionEntry<C>) => entry is E
 	): Promise<E[]>;
-	export function getCollection<C extends keyof typeof entryMap>(
+	export function getCollection<C extends keyof AnyEntryMap>(
 		collection: C,
 		filter?: (entry: CollectionEntry<C>) => unknown
 	): Promise<CollectionEntry<C>[]>;
 
-	type InferEntrySchema<C extends keyof typeof entryMap> = import('astro/zod').infer<
-		Required<ContentConfig['collections'][C]>['schema']
+	export function getEntry<
+		C extends keyof ContentEntryMap,
+		E extends ValidContentEntrySlug<C> | (string & {}),
+	>(entry: {
+		collection: C;
+		slug: E;
+	}): E extends ValidContentEntrySlug<C>
+		? Promise<CollectionEntry<C>>
+		: Promise<CollectionEntry<C> | undefined>;
+	export function getEntry<
+		C extends keyof DataEntryMap,
+		E extends keyof DataEntryMap[C] | (string & {}),
+	>(entry: {
+		collection: C;
+		id: E;
+	}): E extends keyof DataEntryMap[C]
+		? Promise<DataEntryMap[C][E]>
+		: Promise<CollectionEntry<C> | undefined>;
+	export function getEntry<
+		C extends keyof ContentEntryMap,
+		E extends ValidContentEntrySlug<C> | (string & {}),
+	>(
+		collection: C,
+		slug: E
+	): E extends ValidContentEntrySlug<C>
+		? Promise<CollectionEntry<C>>
+		: Promise<CollectionEntry<C> | undefined>;
+	export function getEntry<
+		C extends keyof DataEntryMap,
+		E extends keyof DataEntryMap[C] | (string & {}),
+	>(
+		collection: C,
+		id: E
+	): E extends keyof DataEntryMap[C]
+		? Promise<DataEntryMap[C][E]>
+		: Promise<CollectionEntry<C> | undefined>;
+
+	/** Resolve an array of entry references from the same collection */
+	export function getEntries<C extends keyof ContentEntryMap>(
+		entries: {
+			collection: C;
+			slug: ValidContentEntrySlug<C>;
+		}[]
+	): Promise<CollectionEntry<C>[]>;
+	export function getEntries<C extends keyof DataEntryMap>(
+		entries: {
+			collection: C;
+			id: keyof DataEntryMap[C];
+		}[]
+	): Promise<CollectionEntry<C>[]>;
+
+	export function reference<C extends keyof AnyEntryMap>(
+		collection: C
+	): import('astro/zod').ZodEffects<
+		import('astro/zod').ZodString,
+		C extends keyof ContentEntryMap
+			? {
+					collection: C;
+					slug: ValidContentEntrySlug<C>;
+			  }
+			: {
+					collection: C;
+					id: keyof DataEntryMap[C];
+			  }
+	>;
+	// Allow generic `string` to avoid excessive type errors in the config
+	// if `dev` is not running to update as you edit.
+	// Invalid collection names will be caught at build time.
+	export function reference<C extends string>(
+		collection: C
+	): import('astro/zod').ZodEffects<import('astro/zod').ZodString, never>;
+
+	type ReturnTypeOrOriginal<T> = T extends (...args: any[]) => infer R ? R : T;
+	type InferEntrySchema<C extends keyof AnyEntryMap> = import('astro/zod').infer<
+		ReturnTypeOrOriginal<Required<ContentConfig['collections'][C]>['schema']>
 	>;
 
-	const entryMap: {
+	type ContentEntryMap = {
 		"blog": {
 "an-update-on-my-ai-dating-profile.md": {
-  id: "an-update-on-my-ai-dating-profile.md",
-  slug: "an-update-on-my-ai-dating-profile",
-  body: string,
-  collection: "blog",
+	id: "an-update-on-my-ai-dating-profile.md";
+  slug: "an-update-on-my-ai-dating-profile";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "ask-the-darn-question.md": {
-  id: "ask-the-darn-question.md",
-  slug: "ask-the-darn-question",
-  body: string,
-  collection: "blog",
+	id: "ask-the-darn-question.md";
+  slug: "ask-the-darn-question";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "baldurs-gate-3-feels.md": {
-  id: "baldurs-gate-3-feels.md",
-  slug: "baldurs-gate-3-feels",
-  body: string,
-  collection: "blog",
+	id: "baldurs-gate-3-feels.md";
+  slug: "baldurs-gate-3-feels";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "building-ghalldev-30.md": {
-  id: "building-ghalldev-30.md",
-  slug: "building-ghalldev-30",
-  body: string,
-  collection: "blog",
+	id: "building-ghalldev-30.md";
+  slug: "building-ghalldev-30";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "coding-with-depression.md": {
-  id: "coding-with-depression.md",
-  slug: "coding-with-depression",
-  body: string,
-  collection: "blog",
+	id: "coding-with-depression.md";
+  slug: "coding-with-depression";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "creating-a-dating-profile-with-ai.md": {
-  id: "creating-a-dating-profile-with-ai.md",
-  slug: "creating-a-dating-profile-with-ai",
-  body: string,
-  collection: "blog",
+	id: "creating-a-dating-profile-with-ai.md";
+  slug: "creating-a-dating-profile-with-ai";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "finding-home-in-hyrule.md": {
-  id: "finding-home-in-hyrule.md",
-  slug: "finding-home-in-hyrule",
-  body: string,
-  collection: "blog",
+	id: "finding-home-in-hyrule.md";
+  slug: "finding-home-in-hyrule";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "getting-out-of-your-comfort-zone.md": {
-  id: "getting-out-of-your-comfort-zone.md",
-  slug: "getting-out-of-your-comfort-zone",
-  body: string,
-  collection: "blog",
+	id: "getting-out-of-your-comfort-zone.md";
+  slug: "getting-out-of-your-comfort-zone";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "handheld-gaming.md": {
-  id: "handheld-gaming.md",
-  slug: "handheld-gaming",
-  body: string,
-  collection: "blog",
+	id: "handheld-gaming.md";
+  slug: "handheld-gaming";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "ileopard-a-retrospective.md": {
-  id: "ileopard-a-retrospective.md",
-  slug: "ileopard-a-retrospective",
-  body: string,
-  collection: "blog",
+	id: "ileopard-a-retrospective.md";
+  slug: "ileopard-a-retrospective";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "journal-app-impressions.md": {
-  id: "journal-app-impressions.md",
-  slug: "journal-app-impressions",
-  body: string,
-  collection: "blog",
+	id: "journal-app-impressions.md";
+  slug: "journal-app-impressions";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "my-favorite-little-apps-part-2.md": {
-  id: "my-favorite-little-apps-part-2.md",
-  slug: "my-favorite-little-apps-part-2",
-  body: string,
-  collection: "blog",
+	id: "my-favorite-little-apps-part-2.md";
+  slug: "my-favorite-little-apps-part-2";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "my-favorite-little-apps.md": {
-  id: "my-favorite-little-apps.md",
-  slug: "my-favorite-little-apps",
-  body: string,
-  collection: "blog",
+	id: "my-favorite-little-apps.md";
+  slug: "my-favorite-little-apps";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "my-gunpla-adventure.md": {
-  id: "my-gunpla-adventure.md",
-  slug: "my-gunpla-adventure",
-  body: string,
-  collection: "blog",
+	id: "my-gunpla-adventure.md";
+  slug: "my-gunpla-adventure";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "my-macos-home-directory-overview.md": {
-  id: "my-macos-home-directory-overview.md",
-  slug: "my-macos-home-directory-overview",
-  body: string,
-  collection: "blog",
+	id: "my-macos-home-directory-overview.md";
+  slug: "my-macos-home-directory-overview";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "my-top-3-games-of-2022.md": {
-  id: "my-top-3-games-of-2022.md",
-  slug: "my-top-3-games-of-2022",
-  body: string,
-  collection: "blog",
+	id: "my-top-3-games-of-2022.md";
+  slug: "my-top-3-games-of-2022";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "nextjs-13-and-exploring-new-technologies.md": {
-  id: "nextjs-13-and-exploring-new-technologies.md",
-  slug: "nextjs-13-and-exploring-new-technologies",
-  body: string,
-  collection: "blog",
+	id: "nextjs-13-and-exploring-new-technologies.md";
+  slug: "nextjs-13-and-exploring-new-technologies";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "nostalgia.md": {
-  id: "nostalgia.md",
-  slug: "nostalgia",
-  body: string,
-  collection: "blog",
+	id: "nostalgia.md";
+  slug: "nostalgia";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "on-text-editors.md": {
-  id: "on-text-editors.md",
-  slug: "on-text-editors",
-  body: string,
-  collection: "blog",
+	id: "on-text-editors.md";
+  slug: "on-text-editors";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "on-using-chat-gpt.md": {
-  id: "on-using-chat-gpt.md",
-  slug: "on-using-chat-gpt",
-  body: string,
-  collection: "blog",
+	id: "on-using-chat-gpt.md";
+  slug: "on-using-chat-gpt";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "questlogger-from-ios-to-mac.md": {
-  id: "questlogger-from-ios-to-mac.md",
-  slug: "questlogger-from-ios-to-mac",
-  body: string,
-  collection: "blog",
+	id: "questlogger-from-ios-to-mac.md";
+  slug: "questlogger-from-ios-to-mac";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "reflecting-on-building-my-first-app.md": {
-  id: "reflecting-on-building-my-first-app.md",
-  slug: "reflecting-on-building-my-first-app",
-  body: string,
-  collection: "blog",
+	id: "reflecting-on-building-my-first-app.md";
+  slug: "reflecting-on-building-my-first-app";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "reflecting-on-my-first-year-as-a-developer.md": {
-  id: "reflecting-on-my-first-year-as-a-developer.md",
-  slug: "reflecting-on-my-first-year-as-a-developer",
-  body: string,
-  collection: "blog",
+	id: "reflecting-on-my-first-year-as-a-developer.md";
+  slug: "reflecting-on-my-first-year-as-a-developer";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "thoughs-on-macos.md": {
-  id: "thoughs-on-macos.md",
-  slug: "thoughs-on-macos",
-  body: string,
-  collection: "blog",
+	id: "thoughs-on-macos.md";
+  slug: "thoughs-on-macos";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "using-json-for-data-storage.md": {
-  id: "using-json-for-data-storage.md",
-  slug: "using-json-for-data-storage",
-  body: string,
-  collection: "blog",
+	id: "using-json-for-data-storage.md";
+  slug: "using-json-for-data-storage";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
+} & { render(): Render[".md"] };
 "using-tailwind-with-mui-base.md": {
-  id: "using-tailwind-with-mui-base.md",
-  slug: "using-tailwind-with-mui-base",
-  body: string,
-  collection: "blog",
+	id: "using-tailwind-with-mui-base.md";
+  slug: "using-tailwind-with-mui-base";
+  body: string;
+  collection: "blog";
   data: InferEntrySchema<"blog">
-} & { render(): Render[".md"] },
-},
+} & { render(): Render[".md"] };
+};
 
 	};
 
+	type DataEntryMap = {
+		
+	};
+
+	type AnyEntryMap = ContentEntryMap & DataEntryMap;
+
 	type ContentConfig = typeof import("../src/content/config");
 }

package.json

@@ -11,10 +11,10 @@
     "astro": "astro"
   },
   "dependencies": {
-    "@astrojs/mdx": "^0.17.0",
-    "@astrojs/netlify": "^2.1.2",
-    "@astrojs/rss": "^2.1.0",
-    "astro": "^2.1.8",
+    "@astrojs/mdx": "^1.1.5",
+    "@astrojs/netlify": "^3.0.4",
+    "@astrojs/rss": "^3.0.0",
+    "astro": "^3.5.4",
     "date-fns-tz": "^1.3.7",
     "markdown-it": "^13.0.1",
     "sanitize-html": "^2.9.0"

src/components/BlogHeader.astro

@@ -5,6 +5,7 @@ import Calendar from './icons/Calendar.astro'
 interface Props {
 	title: String
 	date: String
+	slug: String
 }
 
 const { title, date, slug } = Astro.props
@@ -13,19 +14,26 @@ const { title, date, slug } = Astro.props
 <div class="blog-header">
 	<h2>
 		{slug ? <a href={`/posts/${slug}`}>{title}</a> : title}
-		<h3>
-			<!-- <img class="svg-icon" src={calendarIcon} alt="" /> -->
-			<Calendar />
-			<FormattedDate date={date} />
-		</h3>
 	</h2>
-
-	<style>
-		h3 {
-			display: flex;
-			align-items: center;
-			gap: 6px;
-			font-size: 1.1rem;
-		}
-	</style>
+	<h3>
+		<!-- <img class="svg-icon" src={calendarIcon} alt="" /> -->
+		<Calendar />
+		<FormattedDate date={date} />
+	</h3>
 </div>
+
+<style>
+	a {
+		text-decoration: none;
+	}
+	a:hover {
+		text-decoration: none;
+	}
+
+	h3 {
+		display: flex;
+		align-items: center;
+		gap: 6px;
+		font-size: 1.1rem;
+	}
+</style>

src/components/Header.astro

@@ -74,6 +74,7 @@ const navLinks = [
 		display: flex;
 		gap: 0.5rem;
 		align-items: center;
+		text-decoration: none;
 	}
 
 	nav ul li a::before {

src/components/Tags.astro

@@ -25,6 +25,7 @@ const { tags } = Astro.props
 		background: var(--blue);
 		line-height: 2rem;
 		transition: filter 0.15s;
+		text-decoration: none;
 	}
 
 	.tag:hover {

src/styles/global.css

@@ -87,7 +87,8 @@ hr {
 
 a {
 	color: var(--blue);
-	text-decoration: none;
+	text-decoration: underline;
+	text-decoration-style: dotted;
 }
 
 a:hover {
@@ -149,6 +150,7 @@ button,
 	border: none;
 	border-radius: 5px;
 	transition: filter 0.15s;
+	text-decoration: none;
 }
 
 button:hover,