web: fix mapfix thumbnails

web/src/app/mapfixes/[mapfixId]/_mapImage.tsx

@@ -1,11 +1,28 @@
+import Image from "next/image";
 import { MapfixInfo } from "@/app/ts/Mapfix"
 
 interface AssetID {
     id: MapfixInfo["AssetID"]
 }
 
-function MapImage() {
-    return <p>Fetching map image...</p>
+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 {

web/src/app/mapfixes/[mapfixId]/page.tsx

@@ -2,7 +2,7 @@
 
 import { MapfixInfo, MapfixStatusToString } from "@/app/ts/Mapfix";
 import type { CreatorAndReviewStatus } from "./_comments";
-import { MapImage } from "./_map";
+import { MapImage } from "./_mapImage";
 import { useParams } from "next/navigation";
 import ReviewButtons from "./_reviewButtons";
 import Comments from "./_comments";
@@ -16,13 +16,14 @@ interface ReviewId {
 	mapfixId: string,
 	mapfixStatus: number;
 	mapfixSubmitter: number,
+	mapfixAssetId: number;
 }
 
 function RatingArea(mapfix: ReviewId) {
     return (
         <aside className="review-area">
         	<section className="map-image-area">
-         		<MapImage/>
+         		<MapImage id={mapfix.mapfixAssetId}/>
          	</section>
 			<ReviewButtons mapfixId={mapfix.mapfixId} mapfixStatus={mapfix.mapfixStatus} mapfixSubmitter={mapfix.mapfixSubmitter}/>
         </aside>
@@ -74,7 +75,7 @@ export default function MapfixInfoPage() {
         <Webpage>
             <main className="map-page-main">
                 <section className="review-section">
-					<RatingArea mapfixId={dynamicId.mapfixId} mapfixStatus={mapfix.StatusID} mapfixSubmitter={mapfix.Submitter}/>
+						<RatingArea mapfixId={dynamicId.mapfixId} mapfixStatus={mapfix.StatusID} mapfixSubmitter={mapfix.Submitter} mapfixAssetId={mapfix.AssetID} />
                     <TitleAndComments name={mapfix.DisplayName} creator={mapfix.Creator} review={mapfix.StatusID} status_message={mapfix.StatusMessage} asset_id={mapfix.AssetID} comments={[]}/>
                 </section>
             </main>