From 37f9c7c8d658300f0bdc6c57454bb295ea7cce78 Mon Sep 17 00:00:00 2001
From: boojack <stevenlgtm@gmail.com>
Date: Sat, 18 Feb 2023 10:48:31 +0800
Subject: [PATCH] chore: update avatar max size (#1109)

---
 api/user.go                                |  8 ++++--
 store/user.go                              |  6 ++---
 web/src/components/Sidebar.tsx             | 30 +++++++++++++++-------
 web/src/components/UpdateAccountDialog.tsx |  2 --
 web/src/components/UserAvatar.tsx          |  2 +-
 web/src/less/siderbar.less                 | 12 ---------
 6 files changed, 30 insertions(+), 30 deletions(-)

diff --git a/api/user.go b/api/user.go
index b2390a4f..cb1e1ccd 100644
--- a/api/user.go
+++ b/api/user.go
@@ -56,7 +56,6 @@ type UserCreate struct {
 	Email        string `json:"email"`
 	Nickname     string `json:"nickname"`
 	Password     string `json:"password"`
-	AvatarURL    string `json:"avatarUrl"`
 	PasswordHash string
 	OpenID       string
 }
@@ -111,7 +110,12 @@ func (patch UserPatch) Validate() error {
 	if patch.Nickname != nil && len(*patch.Nickname) > 64 {
 		return fmt.Errorf("nickname is too long, maximum length is 64")
 	}
-	if patch.Email != nil {
+	if patch.AvatarURL != nil {
+		if len(*patch.AvatarURL) > 2<<20 {
+			return fmt.Errorf("avatar is too large, maximum is 2MB")
+		}
+	}
+	if patch.Email != nil && *patch.Email != "" {
 		if len(*patch.Email) > 256 {
 			return fmt.Errorf("email is too long, maximum length is 256")
 		}
diff --git a/store/user.go b/store/user.go
index 90378295..fdddbe50 100644
--- a/store/user.go
+++ b/store/user.go
@@ -182,10 +182,9 @@ func createUser(ctx context.Context, tx *sql.Tx, create *api.UserCreate) (*userR
 			email,
 			nickname,
 			password_hash,
-			open_id,
-			avatar_url
+			open_id
 		)
-		VALUES (?, ?, ?, ?, ?, ?, ?)
+		VALUES (?, ?, ?, ?, ?, ?)
 		RETURNING id, username, role, email, nickname, password_hash, open_id, avatar_url, created_ts, updated_ts, row_status
 	`
 	var userRaw userRaw
@@ -196,7 +195,6 @@ func createUser(ctx context.Context, tx *sql.Tx, create *api.UserCreate) (*userR
 		create.Nickname,
 		create.PasswordHash,
 		create.OpenID,
-		create.AvatarURL,
 	).Scan(
 		&userRaw.ID,
 		&userRaw.Username,
diff --git a/web/src/components/Sidebar.tsx b/web/src/components/Sidebar.tsx
index 746531c9..000503ab 100644
--- a/web/src/components/Sidebar.tsx
+++ b/web/src/components/Sidebar.tsx
@@ -32,20 +32,32 @@ const Sidebar = () => {
       <aside className="sidebar-wrapper">
         <UserBanner />
         <UsageHeatMap />
-        <div className="action-btns-container">
-          <button className="btn action-btn" onClick={() => showDailyReviewDialog()}>
-            <span className="icon">📅</span> {t("sidebar.daily-review")}
+        <div className="w-full px-2 my-2 flex flex-col justify-start items-start shrink-0">
+          <button
+            className="leading-10 px-4 rounded-lg text-base dark:text-gray-200 hover:bg-white hover:shadow dark:hover:bg-zinc-700"
+            onClick={() => showDailyReviewDialog()}
+          >
+            <span className="mr-1">📅</span> {t("sidebar.daily-review")}
           </button>
-          <Link to="/explore" className="btn action-btn">
-            <span className="icon">🏂</span> {t("common.explore")}
+          <Link
+            to="/explore"
+            className="leading-10 px-4 rounded-lg text-base dark:text-gray-200 hover:bg-white hover:shadow dark:hover:bg-zinc-700"
+          >
+            <span className="mr-1">🏂</span> {t("common.explore")}
           </Link>
-          <button className="btn action-btn" onClick={() => showResourcesDialog()}>
-            <span className="icon">🗂️</span> {t("sidebar.resources")}
+          <button
+            className="leading-10 px-4 rounded-lg text-base dark:text-gray-200 hover:bg-white hover:shadow dark:hover:bg-zinc-700"
+            onClick={() => showResourcesDialog()}
+          >
+            <span className="mr-1">🗂️</span> {t("sidebar.resources")}
           </button>
           {!userStore.isVisitorMode() && (
             <>
-              <button className="btn action-btn" onClick={handleSettingBtnClick}>
-                <span className="icon">⚙️</span> {t("sidebar.setting")}
+              <button
+                className="leading-10 px-4 rounded-lg text-base dark:text-gray-200 hover:bg-white hover:shadow dark:hover:bg-zinc-700"
+                onClick={handleSettingBtnClick}
+              >
+                <span className="mr-1">⚙️</span> {t("sidebar.setting")}
               </button>
             </>
           )}
diff --git a/web/src/components/UpdateAccountDialog.tsx b/web/src/components/UpdateAccountDialog.tsx
index 2f488e48..c4bd2ed0 100644
--- a/web/src/components/UpdateAccountDialog.tsx
+++ b/web/src/components/UpdateAccountDialog.tsx
@@ -64,8 +64,6 @@ const UpdateAccountDialog: React.FC<Props> = ({ destroy }: Props) => {
         console.error(error);
         toastHelper.error(`Failed to convert image to base64`);
       }
-    } else {
-      toastHelper.error("Image not found");
     }
   };
 
diff --git a/web/src/components/UserAvatar.tsx b/web/src/components/UserAvatar.tsx
index f38114ae..4ebb3e00 100644
--- a/web/src/components/UserAvatar.tsx
+++ b/web/src/components/UserAvatar.tsx
@@ -9,7 +9,7 @@ const UserAvatar = (props: Props) => {
   const { avatarUrl, className } = props;
   return (
     <div className={`${className ?? ""} w-8 h-8 rounded-full bg-gray-100 dark:bg-zinc-800`}>
-      <img className="w-full h-full" src={avatarUrl || MEMOS_LOGO_URL} alt="" />
+      <img className="w-full h-auto min-w-full min-h-full object-cover" src={avatarUrl || MEMOS_LOGO_URL} alt="" />
     </div>
   );
 };
diff --git a/web/src/less/siderbar.less b/web/src/less/siderbar.less
index 4f4b0d31..08efe92d 100644
--- a/web/src/less/siderbar.less
+++ b/web/src/less/siderbar.less
@@ -4,18 +4,6 @@
   &.show {
     @apply translate-x-0 shadow-2xl sm:shadow-none;
   }
-
-  > .action-btns-container {
-    @apply w-full px-2 my-2 flex flex-col justify-start items-start shrink-0;
-
-    > .action-btn {
-      @apply leading-10 px-4 rounded-lg text-base dark:text-gray-200 hover:bg-white dark:hover:bg-zinc-700;
-
-      > .icon {
-        @apply mr-1;
-      }
-    }
-  }
 }
 
 .mask {