From 922bc6a1f52d8f01600e9a61ce31963075ec59a5 Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Thu, 22 Aug 2024 00:46:06 +0900
Subject: refactor(frontend): organize PlayerInfo

---
 frontend/app/components/PlayerNameAndIcon.tsx | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)
 create mode 100644 frontend/app/components/PlayerNameAndIcon.tsx

(limited to 'frontend/app/components/PlayerNameAndIcon.tsx')

diff --git a/frontend/app/components/PlayerNameAndIcon.tsx b/frontend/app/components/PlayerNameAndIcon.tsx
new file mode 100644
index 0000000..e9536e3
--- /dev/null
+++ b/frontend/app/components/PlayerNameAndIcon.tsx
@@ -0,0 +1,25 @@
+import { PlayerProfile } from "../types/PlayerProfile";
+import UserIcon from "./UserIcon";
+
+type Props = {
+	label: string;
+	profile: PlayerProfile;
+};
+
+export default function PlayerNameAndIcon({ label, profile }: Props) {
+	return (
+		<div className="flex flex-col gap-6 my-auto">
+			<div className="flex flex-col gap-2">
+				<div className="text-4xl">{label}</div>
+				<div className="text-6xl">{profile.displayName}</div>
+			</div>
+			{profile.iconPath && (
+				<UserIcon
+					iconPath={profile.iconPath}
+					displayName={profile.displayName}
+					className="w-48 h-48"
+				/>
+			)}
+		</div>
+	);
+}
-- 
cgit v1.3.1

