compilable:)

web/next.config.ts

@@ -7,9 +7,7 @@ const nextConfig: NextConfig = {
     	return [
      		{
 				source: "/api/:path*",
-        		destination: "http://localhost:8082/v1/:path*",
+        		destination: "http://localhost:8082/v1/:path*"
-       			// source: "/v1/submissions/:submissionid/status/:statustype",
-          		// destination: "http://submissions:8082/v1/submissions/:submissionid/status/:statustype"
        		}
      	]
     },

web/src/app/submissions/[submissionId]/_reviewButtons.tsx

@@ -6,11 +6,11 @@ type Action = "completed" | "submit" | "reject" | "revoke" | "trigger-validate"
 interface ReviewButton {
 	name: Review,
 	action: Action,
-	submissionId: string,
+	submissionId: number,
 	color: ButtonOwnProps["color"]
 }
 
-function ReviewButtonClicked(action: Action, submissionId: string) {
+function ReviewButtonClicked(action: Action, submissionId: number) {
 	fetch(`/api/submissions/${submissionId}/status/${action}`, {
 		method: "POST",
 		headers: {

web/src/app/submissions/[submissionId]/page.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { SubmissionInfo, SubmissionStatus, SubmissionStatusToString } from "@/app/ts/Submission";
+import { SubmissionInfo, SubmissionStatusToString } from "@/app/ts/Submission";
 import type { CreatorAndReviewStatus } from "./_comments";
 import { MapImage } from "./_map";
 import { useParams } from "next/navigation";
@@ -42,7 +42,7 @@ function RatingArea(submission: SubmissionInfo) {
          		<MapImage/>
          	</section>
             <Ratings/>
-			{ReviewButtons(submission)}
+            {/* TODO: NOT DO!!! */} {ReviewButtons(submission)}
 			{/* <ReviewButtons submissionId={submission.ID}/> */}
         </aside>
     )
@@ -70,7 +70,7 @@ function TitleAndComments(stats: CreatorAndReviewStatus) {
 export default function SubmissionInfoPage() {
     const dynamicId = useParams<{submissionId: string}>()
 
-    const [submission, setSubmission] = useState(null)
+    const [submission, setSubmission] = useState<SubmissionInfo | null>(null)
  
 	useEffect(() => { // needs to be client sided since server doesn't have a session, nextjs got mad at me for exporting an async function: (https://nextjs.org/docs/messages/no-async-client-component)
 		async function getSubmission() {
@@ -79,7 +79,7 @@ export default function SubmissionInfoPage() {
 			setSubmission(data)
 		}
         getSubmission()
-	}, [])
+	}, [dynamicId.submissionId])
 
 	if (!submission) return (
 	<Webpage>

web/src/app/submissions/_card.tsx

@@ -2,7 +2,15 @@ import React from "react";
 import Image from "next/image";
 import Link from "next/link";
 
-export default function SubmissionCard({ id, displayName, author, rating }) {
+interface SubmissionCardProps {
+	id: number;
+	assetId: number;
+	displayName: string;
+	author: string;
+	rating: number;
+}
+
+export default function SubmissionCard({ id, displayName, author, rating }: SubmissionCardProps) {
 	return (
 		<Link href={`/submissions/${id}`}>
 			<div className="submissionCard">

web/src/app/submissions/page.tsx

@@ -7,9 +7,10 @@ import SubmissionCard from "./_card";
 import SkeletonGrid from './_loading';
 
 import "./(styles)/page.scss";
+import { SubmissionInfo } from '../ts/Submission';
 
 export default function SubmissionInfoPage() {
-	const [submissions, setSubmissions] = useState(null)
+	const [submissions, setSubmissions] = useState<SubmissionInfo[]>([])
  
 	useEffect(() => { // needs to be client sided since server doesn't have a session, nextjs got mad at me for exporting an async function: (https://nextjs.org/docs/messages/no-async-client-component)
 		async function fetchSubmissions() {
@@ -45,7 +46,7 @@ export default function SubmissionInfoPage() {
 						<Grid key={submission.ID}>
 							<SubmissionCard
 								id={submission.ID}
-								assetId={submission.AssetId}
+								assetId={submission.AssetID}
 								displayName={submission.DisplayName}
 								author={submission.Creator}
 								rating={submission.StatusID}

web/src/app/submit/_game.tsx

@@ -2,12 +2,13 @@ import { FormControl, Select, InputLabel, MenuItem } from "@mui/material";
 import { styled } from '@mui/material/styles';
 import InputBase from '@mui/material/InputBase';
 import React from "react";
+import { SelectChangeEvent } from "@mui/material";
 
 // TODO: Properly style everything instead of pasting 🤚
 
 type GameSelectionProps = {
-	game: string;
+	game: number;
-	setGame: React.Dispatch<React.SetStateAction<string>>;
+	setGame: React.Dispatch<React.SetStateAction<number>>;
 };
 
 const BootstrapInput = styled(InputBase)(({ theme }) => ({
@@ -44,14 +45,14 @@ const BootstrapInput = styled(InputBase)(({ theme }) => ({
 
 export default function GameSelection({ game, setGame }: GameSelectionProps) {
 	const handleChange = (event: SelectChangeEvent) => {
-		setGame(event.target.value);
+		setGame(Number(event.target.value)); // TODO: Change later!! there's 100% a proper way of doing this
 	};
 
 	return (
 		<FormControl>
 			<InputLabel sx={{ color: "#646464" }}>Game</InputLabel>
 			<Select
-				value={game}
+				value={String(game)}
 				label="Game"
 				onChange={handleChange}
 				input={<BootstrapInput />}

web/src/app/submit/page.tsx

@@ -1,11 +1,10 @@
 "use client"
 
-import { FormControl, FormLabel, RadioGroup, FormControlLabel, Button, TextField, Checkbox } from "@mui/material"
+import { FormControl, FormControlLabel, Button, TextField, Checkbox } from "@mui/material"
 
 import GameSelection from "./_game";
 import SendIcon from '@mui/icons-material/Send';
 import Webpage from "@/app/_components/webpage"
-import Radio from '@mui/material/Radio';
 import React, { useState } from "react";
 
 import "./(styles)/page.scss"
@@ -16,25 +15,9 @@ interface SubmissionPayload {
 	GameID: number;
 	AssetID: number;
 	AssetVersion: number;
-	Submitter: number;
 	SubmissionType: number;
 }
 
-const enum Map {
-	New,
-	Fix,
-}
-
-function TargetAsset() {
-	return (<FormControl>
-		<FormLabel id="target-asset-radio">Target:</FormLabel>
-		<RadioGroup defaultValue="New" aria-labelledby="target-asset-radio" name="target-asset-radio">
-			<FormControlLabel value="New" control={<Radio/>} label="New"/>
-			<FormControlLabel value="Fix" control={<Radio/>} label="Fix"/>
-		</RadioGroup>
-	</FormControl>)
-}
-
 export default function SubmissionInfoPage() {
 	const [game, setGame] = useState(1);
 	const [isFixingMap, setIsFixingMap] = useState(false);
@@ -44,23 +27,14 @@ export default function SubmissionInfoPage() {
 	
 		const form = event.currentTarget;
 		const formData = new FormData(form);
-		const data = {
-			displayName: formData.get("display-name"),
-			creator: formData.get("creator"),
-			assetId: formData.get("asset-id"),
-			game,
-			isFixingMap,
-		};
-
-		console.log(data)
 	
 		const payload: SubmissionPayload = {
-			DisplayName: data.displayName,
+			DisplayName: (formData.get("display-name") as string) ?? "unknown", // TEMPORARY! TODO: Change
-			Creator: data.creator,
+			Creator: (formData.get("creator") as string) ?? "unknown", // TEMPORARY! TODO: Change
 			GameID: 1073741824, // TODO: Change this!!
-			AssetID: Number(data.assetId),
+			AssetID: Number((formData.get("asset-id") as string) ?? "0"),
 			AssetVersion: 0,
-			SubmissionType: 1,
+			SubmissionType: isFixingMap ? 2 : 1,
 		};
 
 		console.log(payload)