From 32ab2b3bd9e827823d1312fd45d33b20f3ba07c0 Mon Sep 17 00:00:00 2001
From: Jiwoo Ahn <ilp_rincipe@naver.com>
Date: Sat, 11 May 2024 11:28:43 +0900
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20Fix:=20client=20error=20on=20kak?=
 =?UTF-8?q?ao=20login?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 aeye/app/(nav)/my/page.tsx | 70 ++++++++++++++++++--------------------
 1 file changed, 33 insertions(+), 37 deletions(-)

diff --git a/aeye/app/(nav)/my/page.tsx b/aeye/app/(nav)/my/page.tsx
index f26310f..c2cb883 100644
--- a/aeye/app/(nav)/my/page.tsx
+++ b/aeye/app/(nav)/my/page.tsx
@@ -19,12 +19,8 @@ const StyledPaper = styled(Paper)(({ theme }) => ({
   },
 }));
 
-function generateStringAvatar(name: string) {
-  return `${name?.split(" ")[0][0]}${name?.split(" ")[1][0]}`;
-}
-
 function ProfileAvatar() {
-  const [member, setMember] = useState<Member>();
+  const [member, setMember] = useState<Member | null>(null);
 
   useEffect(() => {
     fetchWithInterception("https://api.a-eye.live/member/detail", {
@@ -36,38 +32,38 @@ function ProfileAvatar() {
   }, []);
 
   return (
-    <div
-      style={{
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        marginBottom: "20px",
-      }}
-    >
-      <Tooltip title="Update profile" placement="top-start">
-        <Avatar
-          alt="User member"
-          src={member?.profileUri}
-          sx={{
-            width: 100,
-            height: 100,
-            backgroundColor: "#f0f0f0", // Add background color
-            boxShadow: "0 2px 4px rgba(0,0,0,0.1)", // Add subtle shadow
-          }}
-        >
-          {generateStringAvatar(member?.name as string)}
-        </Avatar>
-      </Tooltip>
-      <Typography variant="h5" component="h2" style={{ marginTop: "12px" }}>
-        {member?.name}
-      </Typography>
-      <Typography style={{ color: "#666", marginBottom: "4px" }}>
-        {member?.email}
-      </Typography>
-      <Typography style={{ color: "#666", marginBottom: "4px" }}>
-        {member?.phone || "No phone number"}
-      </Typography>
-    </div>
+    member && (
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "center",
+          marginBottom: "20px",
+        }}
+      >
+        <Tooltip title="Update profile" placement="top-start">
+          <Avatar
+            alt="User member"
+            src={member.profileUri}
+            sx={{
+              width: 100,
+              height: 100,
+              backgroundColor: "#f0f0f0", // Add background color
+              boxShadow: "0 2px 4px rgba(0,0,0,0.1)", // Add subtle shadow
+            }}
+          />
+        </Tooltip>
+        <Typography variant="h5" component="h2" style={{ marginTop: "12px" }}>
+          {member.name}
+        </Typography>
+        <Typography style={{ color: "#666", marginBottom: "4px" }}>
+          {member.email}
+        </Typography>
+        <Typography style={{ color: "#666", marginBottom: "4px" }}>
+          {member.phone || "No phone number"}
+        </Typography>
+      </div>
+    )
   );
 }