no search results message + try to prevent repeat api requests

3 files changed, 45 insertions, 31 deletions

diff --git a/pages/index.tsx b/pages/index.tsx
index 2aa8243..719f9ea 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -127,19 +127,24 @@ export default function HomePage() {
 		setLoggedIn(document.cookie.includes("token"));
 
 		if (!loggedIn) return; // don't request user info if not logged in
-		var userInfoReq = await axios.request<userInfo>({
-			method: "get",
-			url: `/api/user/info`,
-			headers: {"content-type": "application/json"}
-		})
-		setUserInfo(userInfoReq.data);
-
-		var userGamesReq = await axios.request<userGames>({
-			method: "get",
-			url: `/api/user/games`,
-			headers: {"content-type": "application/json"}
-		})
-		setGameInfo(userGamesReq.data);
+
+		if (!userInfo) {
+			var userInfoReq = await axios.request<userInfo>({
+				method: "get",
+				url: `/api/user/info`,
+				headers: {"content-type": "application/json"}
+			})
+			setUserInfo(userInfoReq.data);
+		}
+
+		if (!gameInfo) {
+			var userGamesReq = await axios.request<userGames>({
+				method: "get",
+				url: `/api/user/games`,
+				headers: {"content-type": "application/json"}
+			})
+			setGameInfo(userGamesReq.data);
+		}
 
 		setGotData(true);
 	})()})
diff --git a/pages/search.tsx b/pages/search.tsx
index 92de828..66e16d2 100644
--- a/pages/search.tsx
+++ b/pages/search.tsx
@@ -74,10 +74,12 @@ function SearchBar(props: {
 }
 
 export default function HomePage() {
+	var [searched, setSearched] = useState(false);
 	var [results, setResults] = useState<Array<userInfo>>([]);
 	var getSearchResults = (event?: FormEvent<HTMLFormElement>) => {
 		event.preventDefault();
 		search(results => setResults(results));
+		setSearched(true);
 	}
 
 	return <div>
@@ -86,6 +88,12 @@ export default function HomePage() {
 			<PageTitle>Zoeken</PageTitle>
 			<SearchBar searchFunction={getSearchResults}/>
 			<SearchResults userList={results}/>
+			{ searched && results.length == 0 && <h1 style={{
+				opacity: .6,
+				color: "var(--text)",
+				textAlign: "center",
+				margin: "24px 32px"
+			}}>Geen zoekresultaten gevonden</h1> }
 		</CenteredPage>
 	</div>
 }
diff --git a/pages/user.tsx b/pages/user.tsx
index 1b0e170..71177d3 100644
--- a/pages/user.tsx
+++ b/pages/user.tsx
@@ -84,35 +84,36 @@ export default function AccountPage() {
 
 		if (id || loggedIn) {
 			var self_id = "";
-			if (loggedIn) {
+			if (loggedIn && !self_id) {
 				var selfReq = await axios.request<userInfo>({
 					method: "get",
 					url: `/api/user/info`,
 					headers: {"content-type": "application/json"}
 				});
-
 				self_id = selfReq?.data.id;
 			}
 
 			if (id == self_id || !id) setOwnPage(true);
 
-			var userReq = await axios.request<userInfo>({
-				method: "post",
-				url: `/api/user/info`,
-				headers: {"content-type": "application/json"},
-				data: { "id": id || self_id }
-			});
-
-			setUser(userReq.data);
-
-			var userGamesReq = await axios.request<userGames>({
-				method: "post",
-				url: `/api/user/games`,
-				headers: {"content-type": "application/json"},
-				data: { "id": id || self_id }
-			});
+			if (!user) {
+				var userReq = await axios.request<userInfo>({
+					method: "post",
+					url: `/api/user/info`,
+					headers: {"content-type": "application/json"},
+					data: { "id": id || self_id }
+				});
+				setUser(userReq.data);
+			}
 
-			setGameInfo(userGamesReq.data);
+			if (!gameInfo) {
+				var userGamesReq = await axios.request<userGames>({
+					method: "post",
+					url: `/api/user/games`,
+					headers: {"content-type": "application/json"},
+					data: { "id": id || self_id }
+				});
+				setGameInfo(userGamesReq.data);
+			}
 		} else {
 			window.history.go(-1);
 		}