diff --git a/README.md b/README.md index a6f9d5fa8..b18028d78 100644 --- a/README.md +++ b/README.md @@ -9,7 +9,7 @@ One-Click to deploy your own ChatGPT web UI. [演示 Demo](https://chat-gpt-next-web.vercel.app/) / [反馈 Issues](https://github.com/Yidadaa/ChatGPT-Next-Web/issues) / [加入 Discord](https://discord.gg/zrhvHCr79N) / [QQ 群](https://user-images.githubusercontent.com/16968934/228190818-7dd00845-e9b9-4363-97e5-44c507ac76da.jpeg) / [打赏开发者](https://user-images.githubusercontent.com/16968934/227772541-5bcd52d8-61b7-488c-a203-0330d8006e2b.jpg) -[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FYidadaa%2FChatGPT-Next-Web&env=OPENAI_API_KEY&project-name=chatgpt-next-web&repository-name=ChatGPT-Next-Web) +[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FYidadaa%2FChatGPT-Next-Web&env=OPENAI_API_KEY&env=CODE&project-name=chatgpt-next-web&repository-name=ChatGPT-Next-Web) [![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/Yidadaa/ChatGPT-Next-Web) @@ -40,7 +40,7 @@ One-Click to deploy your own ChatGPT web UI. 1. 准备好你的 [OpenAI API Key](https://platform.openai.com/account/api-keys); 2. 点击右侧按钮开始部署: - [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FYidadaa%2FChatGPT-Next-Web&env=OPENAI_API_KEY&project-name=chatgpt-next-web&repository-name=ChatGPT-Next-Web),直接使用 Github 账号登陆即可,记得在环境变量页填入 API Key; + [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FYidadaa%2FChatGPT-Next-Web&env=OPENAI_API_KEY&env=CODE&project-name=chatgpt-next-web&repository-name=ChatGPT-Next-Web),直接使用 Github 账号登陆即可,记得在环境变量页填入 API Key; 3. 部署完毕后,即可开始使用; 4. (可选)[绑定自定义域名](https://vercel.com/docs/concepts/projects/domains/add-a-domain):Vercel 分配的域名 DNS 在某些区域被污染了,绑定自定义域名即可直连。 @@ -48,7 +48,7 @@ One-Click to deploy your own ChatGPT web UI. 1. Get [OpenAI API Key](https://platform.openai.com/account/api-keys); 2. Click - [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FYidadaa%2FChatGPT-Next-Web&env=OPENAI_API_KEY&project-name=chatgpt-next-web&repository-name=ChatGPT-Next-Web); + [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FYidadaa%2FChatGPT-Next-Web&env=OPENAI_API_KEY&env=CODE&project-name=chatgpt-next-web&repository-name=ChatGPT-Next-Web); 3. Enjoy :) ## 保持更新 Keep Updated diff --git a/app/components/home.module.scss b/app/components/home.module.scss index 462b19ce5..fb96bd451 100644 --- a/app/components/home.module.scss +++ b/app/components/home.module.scss @@ -292,6 +292,7 @@ position: absolute; right: 20px; top: -26px; + left: 100px; transition: all ease 0.3s; opacity: 0; pointer-events: none; @@ -302,6 +303,7 @@ .chat-message-top-action { opacity: 0.5; color: var(--black); + white-space: nowrap; cursor: pointer; &:hover { @@ -408,7 +410,7 @@ background-color: var(--white); color: var(--black); font-family: inherit; - padding: 10px 14px; + padding: 10px 14px 50px; resize: none; outline: none; } diff --git a/app/components/home.tsx b/app/components/home.tsx index 828ee1916..909e54068 100644 --- a/app/components/home.tsx +++ b/app/components/home.tsx @@ -128,7 +128,7 @@ function useSubmitHandler() { const shouldSubmit = (e: KeyboardEvent) => { if (e.key !== "Enter") return false; - + return ( (config.submitKey === SubmitKey.AltEnter && e.altKey) || (config.submitKey === SubmitKey.CtrlEnter && e.ctrlKey) || @@ -170,7 +170,7 @@ export function PromptHints(props: { ); } -export function Chat(props: { showSideBar?: () => void }) { +export function Chat(props: { showSideBar?: () => void, sideBarShowing?: boolean }) { type RenderMessage = Message & { preview?: boolean }; const chatStore = useChatStore(); @@ -178,6 +178,7 @@ export function Chat(props: { showSideBar?: () => void }) { state.currentSession(), state.currentSessionIndex, ]); + const fontSize = useChatStore((state) => state.config.fontSize); const inputRef = useRef(null); const [userInput, setUserInput] = useState(""); @@ -205,6 +206,11 @@ export function Chat(props: { showSideBar?: () => void }) { // only search prompts when user input is short const SEARCH_TEXT_LIMIT = 30; const onInput = (text: string) => { + const textareaDom = inputRef.current + if (textareaDom) { + const paddingBottomNum: number = parseInt(window.getComputedStyle(textareaDom).paddingBottom, 10); + textareaDom.scrollTop = textareaDom.scrollHeight - textareaDom.offsetHeight + paddingBottomNum; + } setUserInput(text); const n = text.trim().length; if (n === 0 || n > SEARCH_TEXT_LIMIT) { @@ -374,7 +380,7 @@ export function Chat(props: { showSideBar?: () => void }) { )}
- {!isUser && ( + {(!isUser && !(message.preview || message.content.length === 0)) && (
{message.streaming ? (
void }) { ) : (
onRightClick(e, message)} > @@ -444,7 +451,7 @@ export function Chat(props: { showSideBar?: () => void }) { setAutoScroll(false); setTimeout(() => setPromptHints([]), 100); }} - autoFocus + autoFocus={!props?.sideBarShowing} /> } @@ -646,7 +653,7 @@ export function Home() { }} /> ) : ( - setShowSideBar(true)} /> + setShowSideBar(true)} sideBarShowing={showSideBar} /> )}
diff --git a/app/components/settings.tsx b/app/components/settings.tsx index 2eb8a0665..241cebae6 100644 --- a/app/components/settings.tsx +++ b/app/components/settings.tsx @@ -226,6 +226,26 @@ export function Settings(props: { closeSettings: () => void }) { + + + updateConfig( + (config) => + (config.fontSize = Number.parseInt(e.currentTarget.value)) + ) + } + > + +
void }) { type="range" value={config.modelConfig.temperature.toFixed(1)} min="0" - max="1" + max="2" step="0.1" onChange={(e) => { updateConfig( diff --git a/app/locales/cn.ts b/app/locales/cn.ts index 0c81c75dd..b93ec859b 100644 --- a/app/locales/cn.ts +++ b/app/locales/cn.ts @@ -1,3 +1,5 @@ +import { SubmitKey } from "../store/app"; + const cn = { WIP: "该功能仍在开发中……", Error: { @@ -17,7 +19,13 @@ const cn = { Retry: "重试", }, Typing: "正在输入…", - Input: (submitKey: string) => `输入消息,${submitKey} 发送`, + Input: (submitKey: string) => { + var inputHints = `输入消息,${submitKey} 发送`; + if (submitKey === String(SubmitKey.Enter)) { + inputHints += ",Shift + Enter 换行"; + } + return inputHints; + }, Send: "发送", }, Export: { @@ -51,6 +59,10 @@ const cn = { }, }, Avatar: "头像", + FontSize: { + Title: "字体大小", + SubTitle: "聊天内容的字体大小", + }, Update: { Version: (x: string) => `当前版本:${x}`, IsLatest: "已是最新版本", diff --git a/app/locales/en.ts b/app/locales/en.ts index 8eb379c2b..d16893725 100644 --- a/app/locales/en.ts +++ b/app/locales/en.ts @@ -1,3 +1,4 @@ +import { SubmitKey } from "../store/app"; import type { LocaleType } from "./index"; const en: LocaleType = { @@ -20,8 +21,13 @@ const en: LocaleType = { Retry: "Retry", }, Typing: "Typing…", - Input: (submitKey: string) => - `Type something and press ${submitKey} to send`, + Input: (submitKey: string) => { + var inputHints = `Type something and press ${submitKey} to send`; + if (submitKey === String(SubmitKey.Enter)) { + inputHints += ", press Shift + Enter to newline"; + } + return inputHints; + }, Send: "Send", }, Export: { @@ -55,6 +61,10 @@ const en: LocaleType = { }, }, Avatar: "Avatar", + FontSize: { + Title: "Font Size", + SubTitle: "Adjust font size of chat content", + }, Update: { Version: (x: string) => `Version: ${x}`, IsLatest: "Latest version", diff --git a/app/locales/tw.ts b/app/locales/tw.ts index 65145d898..29f5ec22a 100644 --- a/app/locales/tw.ts +++ b/app/locales/tw.ts @@ -1,3 +1,4 @@ +import { SubmitKey } from "../store/app"; import type { LocaleType } from "./index"; const tw: LocaleType = { @@ -19,7 +20,13 @@ const tw: LocaleType = { Retry: "重試", }, Typing: "正在輸入…", - Input: (submitKey: string) => `輸入訊息後,按下 ${submitKey} 鍵即可發送`, + Input: (submitKey: string) => { + var inputHints = `輸入訊息後,按下 ${submitKey} 鍵即可發送`; + if (submitKey === String(SubmitKey.Enter)) { + inputHints += ",Shift + Enter 鍵換行"; + } + return inputHints; + }, Send: "發送", }, Export: { @@ -53,6 +60,10 @@ const tw: LocaleType = { }, }, Avatar: "大頭貼", + FontSize: { + Title: "字型大小", + SubTitle: "聊天內容的字型大小", + }, Update: { Version: (x: string) => `當前版本:${x}`, IsLatest: "已是最新版本", diff --git a/app/store/app.ts b/app/store/app.ts index 6759afb80..8a978c0a4 100644 --- a/app/store/app.ts +++ b/app/store/app.ts @@ -31,12 +31,12 @@ export enum Theme { } export interface ChatConfig { - maxToken?: number; historyMessageCount: number; // -1 means all compressMessageLengthThreshold: number; sendBotMessages: boolean; // send bot's message or not submitKey: SubmitKey; avatar: string; + fontSize: number; theme: Theme; tightBorder: boolean; @@ -123,6 +123,7 @@ const DEFAULT_CONFIG: ChatConfig = { sendBotMessages: true as boolean, submitKey: SubmitKey.CtrlEnter as SubmitKey, avatar: "1f603", + fontSize: 14, theme: Theme.Auto as Theme, tightBorder: false, diff --git a/app/styles/markdown.scss b/app/styles/markdown.scss index 0a6b3bc56..107c1b80d 100644 --- a/app/styles/markdown.scss +++ b/app/styles/markdown.scss @@ -1116,4 +1116,4 @@ .markdown-body ::-webkit-calendar-picker-indicator { filter: invert(50%); -} +} \ No newline at end of file