refactor(frontend): extract UserIcon component

1 files changed, 19 insertions, 0 deletions

diff --git a/frontend/app/components/UserIcon.tsx b/frontend/app/components/UserIcon.tsx
new file mode 100644
index 0000000..656c170
--- /dev/null
+++ b/frontend/app/components/UserIcon.tsx
@@ -0,0 +1,19 @@
+type Props = {
+	iconPath: string;
+	displayName: string;
+	className: string;
+};
+
+export default function UserIcon({ iconPath, displayName, className }: Props) {
+	return (
+		<img
+			src={
+				process.env.NODE_ENV === "development"
+					? `http://localhost:8002/iosdc-japan/2024/code-battle${iconPath}`
+					: `/iosdc-japan/2024/code-battle${iconPath}`
+			}
+			alt={`${displayName} のアイコン`}
+			className={`rounded-full border-4 border-white ${className}`}
+		/>
+	);
+}