Fix thumbnail for web pages

astro/src/lib/pages.ts

@@ -4,6 +4,8 @@ import { getAlbum } from "@/content/photos/albums";
 import { getAllCategories, getPhotoCategory } from "@/content/photos/categories";
 import { getPhotoFromHash } from "@/content/photos/photos";
 import { getProject } from "@/content/projects/projects";
+import { getImageSize } from "./images";
+import { getImage } from "astro:assets";
 
 export async function getPage(settings: GlobalSettings, route: string): Promise<PageType | null> {  
     // Blog Index  
@@ -199,6 +201,16 @@ export async function getPage(settings: GlobalSettings, route: string): Promise<
             }
         }
 
+        const resizedImage = getImageSize(webpageContent.searchEngine.thumbnail.width, 
+            webpageContent.searchEngine.thumbnail.height, 0.756);
+        
+        const thumbnail = await getImage({
+            src: webpageContent.searchEngine.thumbnail.url,
+            width: resizedImage.width,
+            height: resizedImage.height,
+            format: "jpeg"
+        });
+
         return {
             route: route,
             pageType: "Webpage",
@@ -208,7 +220,14 @@ export async function getPage(settings: GlobalSettings, route: string): Promise<
                 id: webpageContent.id,
                 lastModified: webpageContent.lastModified,
                 url: webpageContent.url,
-                searchEngine: webpageContent.searchEngine,
+                searchEngine: {
+                    ...webpageContent.searchEngine,
+                    thumbnail: {
+                        url: `${settings.website.domainName}${thumbnail.src}`,
+                        width: resizedImage.width,
+                        height: resizedImage.height
+                    }
+                },
                 components: webpageContent.components
             }
         };