From 1d6ee64e1dbddff6f2894de55e6b1c47dbc6229a Mon Sep 17 00:00:00 2001
From: H0llyW00dzZ <priv8@btz.pm>
Date: Mon, 12 Feb 2024 19:36:52 +0700
Subject: [PATCH 1/3] [Cherry Pick] Fix [UI/UX] [Front End] Settings Page
 (#4032)

* Fix [UI/UX] [Locales] Correct Spelling

- [+] fix(locales): correct spelling and improve wording in cn.ts and en.ts locale files

* Fix [UI/UX] [Front End] Settings Page

- [+] fix(settings.tsx): correct typo in ApiVerion to ApiVersion
- [+] refactor(settings.tsx): switch Azure.ApiKey to Google.ApiKey in ListItem title and subTitle

* Fix [UI/UX] [Locales] [SK] Correct Typo

- [+] fix(sk.ts): correct typo in ApiVersion key in Slovak locale file
---
 app/components/settings.tsx |  8 ++++----
 app/locales/cn.ts           | 17 +++++++++--------
 app/locales/en.ts           | 10 +++++-----
 app/locales/sk.ts           |  2 +-
 4 files changed, 19 insertions(+), 18 deletions(-)

diff --git a/app/components/settings.tsx b/app/components/settings.tsx
index 35d3b0215..84ae7edf6 100644
--- a/app/components/settings.tsx
+++ b/app/components/settings.tsx
@@ -1081,8 +1081,8 @@ export function Settings() {
                         ></input>
                       </ListItem>
                       <ListItem
-                        title={Locale.Settings.Access.Azure.ApiKey.Title}
-                        subTitle={Locale.Settings.Access.Azure.ApiKey.SubTitle}
+                        title={Locale.Settings.Access.Google.ApiKey.Title}
+                        subTitle={Locale.Settings.Access.Google.ApiKey.SubTitle}
                       >
                         <PasswordInput
                           value={accessStore.googleApiKey}
@@ -1099,9 +1099,9 @@ export function Settings() {
                         />
                       </ListItem>
                       <ListItem
-                        title={Locale.Settings.Access.Google.ApiVerion.Title}
+                        title={Locale.Settings.Access.Google.ApiVersion.Title}
                         subTitle={
-                          Locale.Settings.Access.Google.ApiVerion.SubTitle
+                          Locale.Settings.Access.Google.ApiVersion.SubTitle
                         }
                       >
                         <input
diff --git a/app/locales/cn.ts b/app/locales/cn.ts
index 4a92b6383..dfb9aafa2 100644
--- a/app/locales/cn.ts
+++ b/app/locales/cn.ts
@@ -314,19 +314,20 @@ const cn = {
       },
       Google: {
         ApiKey: {
-          Title: "接口密钥",
-          SubTitle: "使用自定义 Google AI Studio API Key 绕过密码访问限制",
-          Placeholder: "Google AI Studio API Key",
+          Title: "API 密钥",
+          SubTitle:
+            "从 Google AI 获取您的 API 密钥",
+          Placeholder: "输入您的 Google AI Studio API 密钥",
         },
 
         Endpoint: {
-          Title: "接口地址",
-          SubTitle: "不包含请求路径，样例：",
+          Title: "终端地址",
+          SubTitle: "示例：",
         },
 
-        ApiVerion: {
-          Title: "接口版本 (gemini-pro api version)",
-          SubTitle: "选择指定的部分版本",
+        ApiVersion: {
+          Title: "API 版本（仅适用于 gemini-pro）",
+          SubTitle: "选择一个特定的 API 版本",
         },
       },
       CustomModel: {
diff --git a/app/locales/en.ts b/app/locales/en.ts
index 367161d6b..892a846a4 100644
--- a/app/locales/en.ts
+++ b/app/locales/en.ts
@@ -323,8 +323,8 @@ const en: LocaleType = {
         ApiKey: {
           Title: "API Key",
           SubTitle:
-            "Bypass password access restrictions using a custom Google AI Studio API Key",
-          Placeholder: "Google AI Studio API Key",
+            "Obtain your API Key from Google AI",
+          Placeholder: "Enter your Google AI Studio API Key",
         },
 
         Endpoint: {
@@ -332,9 +332,9 @@ const en: LocaleType = {
           SubTitle: "Example:",
         },
 
-        ApiVerion: {
-          Title: "API Version (gemini-pro api version)",
-          SubTitle: "Select a specific part version",
+        ApiVersion: {
+          Title: "API Version (specific to gemini-pro)",
+          SubTitle: "Select a specific API version",
         },
       },
     },
diff --git a/app/locales/sk.ts b/app/locales/sk.ts
index 66cd8f041..025519e77 100644
--- a/app/locales/sk.ts
+++ b/app/locales/sk.ts
@@ -334,7 +334,7 @@ const sk: PartialLocaleType = {
           SubTitle: "Príklad:",
         },
 
-        ApiVerion: {
+        ApiVersion: {
           Title: "Verzia API (gemini-pro verzia API)",
           SubTitle: "Vyberte špecifickú verziu časti",
         },

From e206fb900c3989552d28ad316cdc141d2e3d8c9d Mon Sep 17 00:00:00 2001
From: sijinhui <sijinhui@qq.com>
Date: Thu, 15 Feb 2024 10:51:12 +0800
Subject: [PATCH 2/3] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E4=BF=AE=E6=AD=A3?=
 =?UTF-8?q?=EF=BC=8C=E6=9A=82=E5=81=9C=E6=8C=89=E9=92=AE=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/chat.module.scss |  35 +++++----
 app/components/chat.tsx         | 133 ++++++++++++++++++++++----------
 2 files changed, 110 insertions(+), 58 deletions(-)

diff --git a/app/components/chat.module.scss b/app/components/chat.module.scss
index 32300a9c4..456e13eb0 100644
--- a/app/components/chat.module.scss
+++ b/app/components/chat.module.scss
@@ -298,24 +298,24 @@
 .chat-message-header {
   margin-top: 20px;
   display: flex;
-  align-items: center;
+  align-items: flex-end;
+}
 
-  .chat-message-actions {
+.chat-message-actions {
+  display: flex;
+  box-sizing: border-box;
+  font-size: 12px;
+  align-items: flex-end;
+  justify-content: space-between;
+  transition: all ease 0.3s;
+  transform: scale(0.9) translateY(5px);
+  margin: 0 10px;
+  opacity: 0;
+  pointer-events: none;
+
+  .chat-input-actions {
     display: flex;
-    box-sizing: border-box;
-    font-size: 12px;
-    align-items: flex-end;
-    justify-content: space-between;
-    transition: all ease 0.3s;
-    transform: scale(0.9) translateY(5px);
-    margin: 0 10px;
-    opacity: 0;
-    pointer-events: none;
-
-    .chat-input-actions {
-      display: flex;
-      flex-wrap: nowrap;
-    }
+    flex-wrap: nowrap;
   }
 }
 
@@ -431,10 +431,11 @@
   white-space: nowrap;
   transition: all ease 0.6s;
   color: var(--black);
-  text-align: right;
+  text-align: left;
   width: 100%;
   box-sizing: border-box;
   padding-right: 10px;
+  padding-left: 10px;
   pointer-events: none;
   z-index: 1;
 }
diff --git a/app/components/chat.tsx b/app/components/chat.tsx
index 4f1c6c764..0bef821b6 100644
--- a/app/components/chat.tsx
+++ b/app/components/chat.tsx
@@ -1258,44 +1258,50 @@ function _Chat() {
                       )}
                     </div>
 
-                    {showActions && (
-                      <div className={styles["chat-message-actions"]}>
-                        <div className={styles["chat-input-actions"]}>
-                          {message.streaming ? (
-                            <ChatAction
-                              text={Locale.Chat.Actions.Stop}
-                              icon={<StopIcon />}
-                              onClick={() => onUserStop(message.id ?? i)}
-                            />
-                          ) : (
-                            <>
-                              <ChatAction
-                                text={Locale.Chat.Actions.Retry}
-                                icon={<ResetIcon />}
-                                onClick={() => onResend(message)}
-                              />
+                    <div className={styles["chat-message-action-date"]}>
+                      {isContext
+                        ? Locale.Chat.IsContext
+                        : message.date.toLocaleString()}
+                    </div>
 
-                              <ChatAction
-                                text={Locale.Chat.Actions.Delete}
-                                icon={<DeleteIcon />}
-                                onClick={() => onDelete(message.id ?? i)}
-                              />
+                    {/*{showActions && (*/}
+                    {/*  <div className={styles["chat-message-actions"]}>*/}
+                    {/*    <div className={styles["chat-input-actions"]}>*/}
+                    {/*      {message.streaming ? (*/}
+                    {/*        <ChatAction*/}
+                    {/*          text={Locale.Chat.Actions.Stop}*/}
+                    {/*          icon={<StopIcon />}*/}
+                    {/*          onClick={() => onUserStop(message.id ?? i)}*/}
+                    {/*        />*/}
+                    {/*      ) : (*/}
+                    {/*        <>*/}
+                    {/*          <ChatAction*/}
+                    {/*            text={Locale.Chat.Actions.Retry}*/}
+                    {/*            icon={<ResetIcon />}*/}
+                    {/*            onClick={() => onResend(message)}*/}
+                    {/*          />*/}
 
-                              <ChatAction
-                                text={Locale.Chat.Actions.Pin}
-                                icon={<PinIcon />}
-                                onClick={() => onPinMessage(message)}
-                              />
-                              <ChatAction
-                                text={Locale.Chat.Actions.Copy}
-                                icon={<CopyIcon />}
-                                onClick={() => copyToClipboard(message.content)}
-                              />
-                            </>
-                          )}
-                        </div>
-                      </div>
-                    )}
+                    {/*          <ChatAction*/}
+                    {/*            text={Locale.Chat.Actions.Delete}*/}
+                    {/*            icon={<DeleteIcon />}*/}
+                    {/*            onClick={() => onDelete(message.id ?? i)}*/}
+                    {/*          />*/}
+
+                    {/*          <ChatAction*/}
+                    {/*            text={Locale.Chat.Actions.Pin}*/}
+                    {/*            icon={<PinIcon />}*/}
+                    {/*            onClick={() => onPinMessage(message)}*/}
+                    {/*          />*/}
+                    {/*          <ChatAction*/}
+                    {/*            text={Locale.Chat.Actions.Copy}*/}
+                    {/*            icon={<CopyIcon />}*/}
+                    {/*            onClick={() => copyToClipboard(message.content)}*/}
+                    {/*          />*/}
+                    {/*        </>*/}
+                    {/*      )}*/}
+                    {/*    </div>*/}
+                    {/*  </div>*/}
+                    {/*)}*/}
                   </div>
                   {showTyping && (
                     <div className={styles["chat-message-status"]}>
@@ -1413,11 +1419,56 @@ function _Chat() {
                       </div>
                     )}
 
-                  <div className={styles["chat-message-action-date"]}>
-                    {isContext
-                      ? Locale.Chat.IsContext
-                      : message.date.toLocaleString()}
-                  </div>
+                  {/*<div className={styles["chat-message-action-date"]}>*/}
+                  {/*  {isContext*/}
+                  {/*    ? Locale.Chat.IsContext*/}
+                  {/*    : message.date.toLocaleString()}*/}
+                  {/*</div>*/}
+
+                  {showActions && (
+                    <div
+                      className={styles["chat-message-actions"]}
+                      style={{
+                        marginTop: "10px",
+                        marginBottom: "0px",
+                      }}
+                    >
+                      <div className={styles["chat-input-actions"]}>
+                        {message.streaming ? (
+                          <ChatAction
+                            text={Locale.Chat.Actions.Stop}
+                            icon={<StopIcon />}
+                            onClick={() => onUserStop(message.id ?? i)}
+                          />
+                        ) : (
+                          <>
+                            <ChatAction
+                              text={Locale.Chat.Actions.Retry}
+                              icon={<ResetIcon />}
+                              onClick={() => onResend(message)}
+                            />
+
+                            <ChatAction
+                              text={Locale.Chat.Actions.Delete}
+                              icon={<DeleteIcon />}
+                              onClick={() => onDelete(message.id ?? i)}
+                            />
+
+                            <ChatAction
+                              text={Locale.Chat.Actions.Pin}
+                              icon={<PinIcon />}
+                              onClick={() => onPinMessage(message)}
+                            />
+                            <ChatAction
+                              text={Locale.Chat.Actions.Copy}
+                              icon={<CopyIcon />}
+                              onClick={() => copyToClipboard(message.content)}
+                            />
+                          </>
+                        )}
+                      </div>
+                    </div>
+                  )}
                 </div>
               </div>
               {shouldShowClearContextDivider && <ClearContextDivider />}

From d701e63a526f9b04ebf2f7839183f723629cd37e Mon Sep 17 00:00:00 2001
From: sijinhui <sijinhui@qq.com>
Date: Thu, 15 Feb 2024 10:52:04 +0800
Subject: [PATCH 3/3] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E4=BF=AE=E6=AD=A3?=
 =?UTF-8?q?=EF=BC=8C=E6=9A=82=E5=81=9C=E6=8C=89=E9=92=AE=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/chat.tsx | 45 -----------------------------------------
 1 file changed, 45 deletions(-)

diff --git a/app/components/chat.tsx b/app/components/chat.tsx
index 0bef821b6..48b16e2b0 100644
--- a/app/components/chat.tsx
+++ b/app/components/chat.tsx
@@ -1263,45 +1263,6 @@ function _Chat() {
                         ? Locale.Chat.IsContext
                         : message.date.toLocaleString()}
                     </div>
-
-                    {/*{showActions && (*/}
-                    {/*  <div className={styles["chat-message-actions"]}>*/}
-                    {/*    <div className={styles["chat-input-actions"]}>*/}
-                    {/*      {message.streaming ? (*/}
-                    {/*        <ChatAction*/}
-                    {/*          text={Locale.Chat.Actions.Stop}*/}
-                    {/*          icon={<StopIcon />}*/}
-                    {/*          onClick={() => onUserStop(message.id ?? i)}*/}
-                    {/*        />*/}
-                    {/*      ) : (*/}
-                    {/*        <>*/}
-                    {/*          <ChatAction*/}
-                    {/*            text={Locale.Chat.Actions.Retry}*/}
-                    {/*            icon={<ResetIcon />}*/}
-                    {/*            onClick={() => onResend(message)}*/}
-                    {/*          />*/}
-
-                    {/*          <ChatAction*/}
-                    {/*            text={Locale.Chat.Actions.Delete}*/}
-                    {/*            icon={<DeleteIcon />}*/}
-                    {/*            onClick={() => onDelete(message.id ?? i)}*/}
-                    {/*          />*/}
-
-                    {/*          <ChatAction*/}
-                    {/*            text={Locale.Chat.Actions.Pin}*/}
-                    {/*            icon={<PinIcon />}*/}
-                    {/*            onClick={() => onPinMessage(message)}*/}
-                    {/*          />*/}
-                    {/*          <ChatAction*/}
-                    {/*            text={Locale.Chat.Actions.Copy}*/}
-                    {/*            icon={<CopyIcon />}*/}
-                    {/*            onClick={() => copyToClipboard(message.content)}*/}
-                    {/*          />*/}
-                    {/*        </>*/}
-                    {/*      )}*/}
-                    {/*    </div>*/}
-                    {/*  </div>*/}
-                    {/*)}*/}
                   </div>
                   {showTyping && (
                     <div className={styles["chat-message-status"]}>
@@ -1419,12 +1380,6 @@ function _Chat() {
                       </div>
                     )}
 
-                  {/*<div className={styles["chat-message-action-date"]}>*/}
-                  {/*  {isContext*/}
-                  {/*    ? Locale.Chat.IsContext*/}
-                  {/*    : message.date.toLocaleString()}*/}
-                  {/*</div>*/}
-
                   {showActions && (
                     <div
                       className={styles["chat-message-actions"]}