From 2e7f892579f908ee7fd751a24f7442d765c66339 Mon Sep 17 00:00:00 2001
From: zkldi <20380519+zkldi@users.noreply.github.com>
Date: Thu, 26 Jan 2023 15:09:40 +0000
Subject: [PATCH] fix: improve import page

---
 .../src/app/pages/dashboard/import/ImportPage.tsx   | 11 ++++++++++-
 .../components/layout/header/ImportScoresLink.tsx   | 13 ++++++++++++-
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/client/src/app/pages/dashboard/import/ImportPage.tsx b/client/src/app/pages/dashboard/import/ImportPage.tsx
index b6438cee8..a5bf8b702 100644
--- a/client/src/app/pages/dashboard/import/ImportPage.tsx
+++ b/client/src/app/pages/dashboard/import/ImportPage.tsx
@@ -9,7 +9,7 @@ import Loading from "components/util/Loading";
 import useApiQuery from "components/util/query/useApiQuery";
 import { UserContext } from "context/UserContext";
 import { TachiConfig } from "lib/config";
-import React, { useContext, useState } from "react";
+import React, { useContext, useEffect, useState } from "react";
 import { Row } from "react-bootstrap";
 import { Link } from "react-router-dom";
 import {
@@ -27,6 +27,14 @@ export default function ImportPage({ user }: { user: UserDocument }) {
 
 	const [game, setGame] = useState<Game | null>(null);
 
+	const queryGame = new URLSearchParams(window.location.search).get("game");
+
+	useEffect(() => {
+		if (queryGame) {
+			setGame(queryGame as Game);
+		}
+	}, [queryGame]);
+
 	return (
 		<div>
 			<div>
@@ -50,6 +58,7 @@ export default function ImportPage({ user }: { user: UserDocument }) {
 			<select
 				className="form-control"
 				onChange={(e) => setGame(e.target.value === "" ? null : (e.target.value as Game))}
+				value={game}
 			>
 				<option value="">Please select a game.</option>
 				{TachiConfig.games.map((e) => (
diff --git a/client/src/components/layout/header/ImportScoresLink.tsx b/client/src/components/layout/header/ImportScoresLink.tsx
index e923f2178..a71d38ab5 100644
--- a/client/src/components/layout/header/ImportScoresLink.tsx
+++ b/client/src/components/layout/header/ImportScoresLink.tsx
@@ -1,6 +1,17 @@
 import React from "react";
+import { FormatGame, GetGameConfig } from "tachi-common";
+import { TachiConfig } from "lib/config";
 import MenuLink from "./MenuLink";
+import MenuDropdown from "./MenuDropdown";
 
 export default function ImportScoresLink() {
-	return <MenuLink to="/import" name="Import Scores"></MenuLink>;
+	const links = [];
+
+	for (const game of TachiConfig.games) {
+		const gameConfig = GetGameConfig(game);
+
+		links.push(<MenuLink key={game} name={gameConfig.name} to={`/import?game=${game}`} />);
+	}
+
+	return <MenuDropdown name="Import Scores">{links}</MenuDropdown>;
 }