web: add map image to map page

web/src/app/maps/[mapId]/_mapImage.tsx

@@ -0,0 +1,28 @@
+import Image from "next/image";
+import { MapInfo } from "@/app/ts/Map";
+
+interface AssetID {
+	id: MapInfo["ID"];
+}
+
+function MapImage({ id }: AssetID) {
+	if (!id) {
+		return <p>Missing asset ID</p>;
+	}
+
+	const imageUrl = `/thumbnails/asset/${id}`;
+
+	return (
+		<Image
+			src={imageUrl}
+			alt="Map Thumbnail"
+			layout="responsive"
+			width={512}
+			height={512}
+			priority={true}
+			className="map-image"
+		/>
+	);
+}
+
+export { type AssetID, MapImage };

web/src/app/maps/[mapId]/page.tsx

@@ -1,6 +1,7 @@
 "use client"
 
 import { MapInfo } from "@/app/ts/Map";
+import { MapImage } from "./_mapImage";
 import Webpage from "@/app/_components/webpage";
 import { useParams } from "next/navigation";
 import Link from "next/link";
@@ -46,6 +47,11 @@ export default function Map() {
 	      <p>GameID: { map.GameID }</p>
 	      <p>Release Date: { map.Date }</p>
 	      <Button name="Submit A Mapfix For This Map" href={`/maps/${mapId}/fix`}/>
+       <aside className="review-area">
+        	<section className="map-image-area">
+         <MapImage id={map.ID}/>
+         	</section>
+        </aside>
       </Webpage>
 	)
 }