Refactor & Feat UI/UX Page [Chats] (ChatGPTNextWeb#164)

* Chore Locales [Chats Page]

- [+] chore(locales): add "GeneratingImage" translation in cn.ts, en.ts, and id.ts

* Refactor & Feat UI/UX Page [Chats]

- [+] refactor(chat.tsx): simplify conditional rendering of typing status message
- [+] feat(chat.tsx): add support for displaying "Generating Image" status message for assistant using DALL-E model

app/components/chat.tsx

@@ -1353,6 +1353,9 @@ function _Chat() {
         {messages.map((message, i) => {
           const isUser = message.role === "user";
           const isContext = i < context.length;
+          const isAssistant = message.role === "assistant";
+          const isDallEModel = session.mask.modelConfig.model.startsWith("dall-e");
+
           const showActions =
             i > 0 &&
             !(message.preview || message.content.length === 0) &&
@@ -1450,11 +1453,13 @@ function _Chat() {
                       </div>
                     )}
                   </div>
-                  {showTyping && (
+                  {showTyping && (isAssistant || isUser) ? (
                     <div className={styles["chat-message-status"]}>
-                      {Locale.Chat.Typing}
+                      {isAssistant && isDallEModel
+                        ? Locale.Chat.GeneratingImage
+                        : Locale.Chat.Typing}
                     </div>
-                  )}
+                  ) : null}
                   <div className={styles["chat-message-item"]}>
                     <Markdown
                       content={message.content}

app/locales/cn.ts

@@ -103,6 +103,7 @@ const cn = {
     },
     Rename: "重命名对话",
     Typing: "正在输入…",
+    GeneratingImage: "生成图片中...",
     Input: (submitKey: string) => {
       var inputHints = `${submitKey} 发送`;
       if (submitKey === String(SubmitKey.Enter)) {

app/locales/en.ts

@@ -105,6 +105,7 @@ const en: LocaleType = {
     },
     Rename: "Rename Chat",
     Typing: "Typing…",
+    GeneratingImage: "Generating Images…",
     Input: (submitKey: string) => {
       var inputHints = `${submitKey} to send`;
       if (submitKey === String(SubmitKey.Enter)) {

app/locales/id.ts

@@ -92,6 +92,7 @@ const id: PartialLocaleType = {
     },
     Rename: "Ubah Nama Chat",
     Typing: "Mengetik...",
+    GeneratingImage: "Menghasilkan Gambar...",
     Input: (submitKey: string) => {
       var inputHints = `${submitKey} untuk mengirim`;
       if (submitKey === String(SubmitKey.Enter)) {