Merge pull request ChatGPTNextWeb#1693 from Yidadaa/bugfix-0522

fix: ChatGPTNextWeb#1668 ChatGPTNextWeb#1681

Author: Yidadaa

app/client/controller.ts

@@ -28,7 +28,6 @@ export const ChatControllerPool = {
 
   remove(sessionIndex: number, messageId: number) {
     const key = this.key(sessionIndex, messageId);
-    this.controllers[key]?.abort();
     delete this.controllers[key];
   },
 

app/components/exporter.module.scss

@@ -131,7 +131,8 @@
         position: absolute;
         top: 0px;
         left: 0px;
-        transform: scale(2);
+        height: 50%;
+        transform: scale(1.5);
       }
 
       .main-title {
@@ -184,6 +185,10 @@
         max-width: calc(100% - 104px);
         box-shadow: var(--card-shadow);
         border: var(--border-in-light);
+
+        * {
+          overflow: hidden;
+        }
       }
 
       &-assistant {

app/components/exporter.tsx

@@ -7,17 +7,19 @@ import { copyToClipboard, downloadAs, useMobileScreen } from "../utils";
 
 import CopyIcon from "../icons/copy.svg";
 import LoadingIcon from "../icons/three-dots.svg";
-import ChatGptIcon from "../icons/chatgpt.svg";
+import ChatGptIcon from "../icons/chatgpt.png";
 import ShareIcon from "../icons/share.svg";
+import BotIcon from "../icons/bot.png";
 
 import DownloadIcon from "../icons/download.svg";
 import { useMemo, useRef, useState } from "react";
 import { MessageSelector, useMessageSelector } from "./message-selector";
 import { Avatar } from "./emoji";
-import { MaskAvatar } from "./mask";
 import dynamic from "next/dynamic";
+import NextImage from "next/image";
 
 import { toBlob, toPng } from "html-to-image";
+import { DEFAULT_MASK_AVATAR } from "../store/mask";
 
 const Markdown = dynamic(async () => (await import("./markdown")).Markdown, {
   loading: () => <LoadingIcon />,
@@ -253,6 +255,22 @@ export function PreviewActions(props: {
   );
 }
 
+function ExportAvatar(props: { avatar: string }) {
+  if (props.avatar === DEFAULT_MASK_AVATAR) {
+    return (
+      <NextImage
+        src={BotIcon.src}
+        width={30}
+        height={30}
+        alt="bot"
+        className="user-avatar"
+      />
+    );
+  }
+
+  return <Avatar avatar={props.avatar}></Avatar>;
+}
+
 export function ImagePreviewer(props: {
   messages: ChatMessage[];
   topic: string;
@@ -319,7 +337,12 @@ export function ImagePreviewer(props: {
       >
         <div className={styles["chat-info"]}>
           <div className={styles["logo"] + " no-dark"}>
-            <ChatGptIcon />
+            <NextImage
+              src={ChatGptIcon.src}
+              alt="logo"
+              width={50}
+              height={50}
+            />
           </div>
 
           <div>
@@ -328,9 +351,9 @@ export function ImagePreviewer(props: {
               github.com/Yidadaa/ChatGPT-Next-Web
             </div>
             <div className={styles["icons"]}>
-              <Avatar avatar={config.avatar}></Avatar>
+              <ExportAvatar avatar={config.avatar} />
               <span className={styles["icon-space"]}>&</span>
-              <MaskAvatar mask={session.mask} />
+              <ExportAvatar avatar={mask.avatar} />
             </div>
           </div>
           <div>
@@ -358,14 +381,12 @@ export function ImagePreviewer(props: {
               key={i}
             >
               <div className={styles["avatar"]}>
-                {m.role === "user" ? (
-                  <Avatar avatar={config.avatar}></Avatar>
-                ) : (
-                  <MaskAvatar mask={session.mask} />
-                )}
+                <ExportAvatar
+                  avatar={m.role === "user" ? config.avatar : mask.avatar}
+                />
               </div>
 
-              <div className={`${styles["body"]} `}>
+              <div className={styles["body"]}>
                 <Markdown
                   content={m.content}
                   fontSize={config.fontSize}

app/icons/bot.png

@@ -257,7 +257,12 @@ export const useChatStore = create<ChatStore>()(
         });
 
         // get recent messages
-        const systemMessages = [systemInfo];
+        const systemMessages = [];
+        // if user define a mask with context prompts, wont send system info
+        if (session.mask.context.length === 0) {
+          systemMessages.push(systemInfo);
+        }
+
         const recentMessages = get().getMessagesWithMemory();
         const sendMessages = systemMessages.concat(
           recentMessages.concat(userMessage),
@@ -345,7 +350,7 @@ export const useChatStore = create<ChatStore>()(
 
         // wont send cleared context messages
         const clearedContextMessages = session.messages.slice(
-          (session.clearContextIndex ?? 0),
+          session.clearContextIndex ?? 0,
         );
         const messages = clearedContextMessages.filter((msg) => !msg.isError);
         const n = messages.length;