Merge pull request #226 from jack0pan/fix/deps

fix: update yarn.lock file
Merge pull request #228 from yanglyu902/fix-title
2025-08-30 18:46:58 +08:00 · 2023-03-30 19:01:04 +08:00 · 2023-03-30 19:00:05 +08:00 · 2023-03-30 09:55:41 +00:00 · 2023-03-30 02:55:19 -07:00 · 2023-03-30 16:06:22 +08:00
58 changed files with 3280 additions and 6317 deletions
--- a/.eslintignore
+++ b/.eslintignore
@@ -0,0 +1 @@
+public/serviceWorker.js
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -1,3 +1,4 @@
 {
-  "extends": "next/core-web-vitals"
+  "extends": "next/core-web-vitals",
+  "plugins": ["prettier"]
 }
--- a/.github/workflows/docker.yml
+++ b/.github/workflows/docker.yml
@@ -0,0 +1,52 @@
+name: Publish Docker image
+
+on:
+  workflow_dispatch:
+  release:
+    types: [published]
+
+jobs:
+  push_to_registry:
+    name: Push Docker image to Docker Hub
+    runs-on: ubuntu-latest
+    steps:
+      -
+        name: Check out the repo
+        uses: actions/checkout@v3
+      -
+        name: Log in to Docker Hub
+        uses: docker/login-action@v2
+        with:
+          username: ${{ secrets.DOCKER_USERNAME }}
+          password: ${{ secrets.DOCKER_PASSWORD }}
+      
+      - 
+        name: Extract metadata (tags, labels) for Docker
+        id: meta
+        uses: docker/metadata-action@v4
+        with:
+          images: yidadaa/chatgpt-next-web
+          tags: |
+            type=raw,value=latest
+            type=semver,pattern={{version}}
+      
+      - 
+        name: Set up QEMU
+        uses: docker/setup-qemu-action@v2
+
+      - 
+        name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+      
+      - 
+        name: Build and push Docker image
+        uses: docker/build-push-action@v4
+        with:
+          context: .
+          platforms: linux/amd64,linux/arm/v6,linux/arm/v7,linux/arm64/v8
+          push: true
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
+          cache-from: type=gha
+          cache-to: type=gha,mode=max
+            
--- a/.gitignore
+++ b/.gitignore
@@ -34,4 +34,6 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
-dev
+dev
+
+public/prompts.json
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx lint-staged
--- a/.lintstagedrc.json
+++ b/.lintstagedrc.json
@@ -0,0 +1,6 @@
+{
+  "./app/**/*.{js,ts,jsx,tsx,json,html,css,md}": [
+    "eslint --fix",
+    "prettier --write"
+  ]
+}
--- a/.prettierrc.js
+++ b/.prettierrc.js
@@ -0,0 +1,10 @@
+module.exports = {
+  printWidth: 80,
+  tabWidth: 2,
+  useTabs: false,
+  semi: true,
+  singleQuote: false,
+  trailingComma: 'all',
+  bracketSpacing: true,
+  arrowParens: 'always',
+};
--- a/44
+++ b/44
@@ -0,0 +1,44 @@
+FROM node:18-alpine AS base
+
+FROM base AS deps
+
+RUN apk add --no-cache libc6-compat
+
+WORKDIR /app
+
+COPY package.json yarn.lock* package-lock.json* ./
+
+RUN \
+  if [ -f yarn.lock ]; then yarn install --frozen-lockfile --network-timeout 100000; \
+  elif [ -f package-lock.json ]; then npm ci; \
+  else echo "Lockfile not found." && exit 1; \
+  fi
+
+FROM base AS builder
+
+RUN apk update && apk add --no-cache git
+
+ENV OPENAI_API_KEY=""
+ENV CODE=""
+ARG DOCKER=true
+
+WORKDIR /app
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
+
+RUN yarn build
+
+FROM base AS runner
+WORKDIR /app
+
+ENV OPENAI_API_KEY=""
+ENV CODE=""
+
+COPY --from=builder /app/public ./public
+COPY --from=builder /app/.next/standalone ./
+COPY --from=builder /app/.next/static ./.next/static
+COPY --from=builder /app/.next/server ./.next/server
+
+EXPOSE 3000
+
+CMD ["node","server.js"]
--- a/README.md
+++ b/README.md
@@ -7,9 +7,9 @@

 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)
+[演示 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) / [Donate](#捐赠-donate-usdt)

-[![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)

@@ -22,6 +22,7 @@ One-Click to deploy your own ChatGPT web UI.
 - 在 1 分钟内使用 Vercel **免费一键部署**
 - 精心设计的 UI，响应式设计，支持深色模式
 - 极快的首屏加载速度（~85kb）
+- 海量的内置 prompt 列表，来自[中文](https://github.com/PlexPt/awesome-chatgpt-prompts-zh)和[英文](https://github.com/f/awesome-chatgpt-prompts)
 - 自动压缩上下文聊天记录，在节省 Token 的同时支持超长对话
 - 一键导出聊天记录，完整的 Markdown 支持
 - 拥有自己的域名？好上加好，绑定后即可在任何地方**无障碍**快速访问
@@ -31,6 +32,7 @@ One-Click to deploy your own ChatGPT web UI.
 - **Deploy for free with one-click** on Vercel in under 1 minute
 - Responsive design, and dark mode
 - Fast first screen loading speed (~85kb)
+- Awesome prompts powered by [awesome-chatgpt-prompts-zh](https://github.com/PlexPt/awesome-chatgpt-prompts-zh) and [awesome-chatgpt-prompts](https://github.com/f/awesome-chatgpt-prompts)
 - Automatically compresses chat history to support long conversations while also saving your tokens
 - One-click export all chat history with full Markdown support

@@ -38,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 在某些区域被污染了，绑定自定义域名即可直连。

@@ -46,21 +48,147 @@ 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
+
+如果你按照上述步骤一键部署了自己的项目，可能会发现总是提示“存在更新”的问题，这是由于 Vercel 会默认为你创建一个新项目而不是 fork 本项目，这会导致无法正确地检测更新。
+推荐你按照下列步骤重新部署：
+
+- 删除掉原先的 repo；
+- fork 本项目；
+- 前往 vercel 控制台，删除掉原先的 project，然后新建 project，选择你刚刚 fork 出来的项目重新进行部署即可；
+- 在重新部署的过程中，请手动添加名为 `OPENAI_API_KEY` 的环境变量，并填入你的 api key 作为值。
+
+本项目会持续更新，如果你想让代码库总是保持更新，可以查看 [Github 的文档](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/syncing-a-fork) 了解如何让 fork 的项目与上游代码同步，建议定期进行同步操作以获得新功能。
+
+你可以 star/watch 本项目或者 follow 作者来及时获得新功能更新通知。
+
+If you have deployed your own project with just one click following the steps above, you may encounter the issue of "Updates Available" constantly showing up. This is because Vercel will create a new project for you by default instead of forking this project, resulting in the inability to detect updates correctly.
+
+We recommend that you follow the steps below to re-deploy:
+
+- Delete the original repo;
+- Fork this project;
+- Go to the Vercel dashboard, delete the original project, then create a new project and select the project you just forked to redeploy;
+- Please manually add an environment variable named `OPENAI_API_KEY` and enter your API key as the value during the redeploy process.
+
+This project will be continuously maintained. If you want to keep the code repository up to date, you can check out the [Github documentation](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/syncing-a-fork) to learn how to synchronize a forked project with upstream code. It is recommended to perform synchronization operations regularly.
+
+You can star or watch this project or follow author to get release notifictions in time.
+
+## 配置密码 Password
+
+本项目提供有限的权限控制功能，请在 Vercel 项目控制面板的环境变量页增加名为 `CODE` 的环境变量，值为用英文逗号分隔的自定义密码：
+
+```
+code1,code2,code3
+```
+
+增加或修改该环境变量后，请**重新部署**项目使改动生效。
+
+This project provides limited access control. Please add an environment variable named `CODE` on the vercel environment variables page. The value should be passwords separated by comma like this:
+
+```
+code1,code2,code3
+```
+
+After adding or modifying this environment variable, please redeploy the project for the changes to take effect.
+
+## 环境变量 Environment Variables
+
+### `OPENAI_API_KEY` (required)
+
+OpanAI 密钥。
+
+Your openai api key.
+
+### `CODE` (optional)
+
+访问密码，可选，可以使用逗号隔开多个密码。
+
+Access passsword, separated by comma.
+
+### `BASE_URL` (optional)
+
+> Default: `api.openai.com`
+
+OpenAI 接口代理 URL。
+
+Override openai api request base url.
+
+### `PROTOCOL` (optional)
+
+> Default: `https`
+
+> Values: `http` | `https`
+
+OpenAI 接口协议。
+
+Override openai api request protocol.
+
 ## 开发 Development

 点击下方按钮，开始二次开发：

 [![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/Yidadaa/ChatGPT-Next-Web)

+在开始写代码之前，需要在项目根目录新建一个 `.env.local` 文件，里面填入环境变量：
+
+Before starting development, you must create a new `.env.local` file at project root, and place your api key into it:
+
+```
+OPENAI_API_KEY=<your api key here>
+```
+
+### 本地开发 Local Development
+
+> 如果你是中国大陆用户，不建议在本地进行开发，除非你能够独立解决 OpenAI API 本地代理问题。
+
+1. 安装 nodejs 和 yarn，具体细节请询问 ChatGPT；
+2. 执行 `yarn install && yarn dev` 即可。
+
+### 本地部署 Local Deployment
+
+```shell
+bash <(curl -s https://raw.githubusercontent.com/Yidadaa/ChatGPT-Next-Web/main/scripts/setup.sh)
+```
+
+### 容器部署 Docker Deployment
+
+```shell
+docker pull yidadaa/chatgpt-next-web
+
+docker run -d -p 3000:3000 -e OPENAI_API_KEY="" -e CODE="" yidadaa/chatgpt-next-web
+```
+
 ## 截图 Screenshots

 ![设置 Settings](./static/settings.png)

 ![更多展示 More](./static/more.png)

+
+## 捐赠 Donate USDT
+> BNB Smart Chain (BEP 20)
+```
+0x67cD02c7EB62641De576a1fA3EdB32eA0c3ffD89
+```
+
+## 鸣谢 Special Thanks
+
+### 捐赠者 Sponsor
+
+[@mushan0x0](https://github.com/mushan0x0)
+[@ClarenceDan](https://github.com/ClarenceDan)
+[@zhangjia](https://github.com/zhangjia)
+[@hoochanlon](https://github.com/hoochanlon)
+
+### 贡献者 Contributor
+
+[Contributors](https://github.com/Yidadaa/ChatGPT-Next-Web/graphs/contributors)
+
 ## LICENSE

 - [Anti 996 License](https://github.com/kattgu7/Anti-996-License/blob/master/LICENSE_CN_EN)
--- a/app/api/access.ts
+++ b/app/api/access.ts
@@ -0,0 +1,17 @@
+import md5 from "spark-md5";
+
+export function getAccessCodes(): Set<string> {
+  const code = process.env.CODE;
+
+  try {
+    const codes = (code?.split(",") ?? [])
+      .filter((v) => !!v)
+      .map((v) => md5.hash(v.trim()));
+    return new Set(codes);
+  } catch (e) {
+    return new Set();
+  }
+}
+
+export const ACCESS_CODES = getAccessCodes();
+export const IS_IN_DOCKER = process.env.DOCKER;
--- a/app/api/chat-stream/route.ts
+++ b/app/api/chat-stream/route.ts
@@ -1,21 +1,12 @@
-import type { ChatRequest } from "../chat/typing";
 import { createParser } from "eventsource-parser";
 import { NextRequest } from "next/server";
+import { requestOpenai } from "../common";

-const apiKey = process.env.OPENAI_API_KEY;
-
-async function createStream(payload: ReadableStream<Uint8Array>) {
+async function createStream(req: NextRequest) {
  const encoder = new TextEncoder();
  const decoder = new TextDecoder();

-  const res = await fetch("https://api.openai.com/v1/chat/completions", {
-    headers: {
-      "Content-Type": "application/json",
-      Authorization: `Bearer ${apiKey}`,
-    },
-    method: "POST",
-    body: payload,
-  });
+  const res = await requestOpenai(req);

  const stream = new ReadableStream({
    async start(controller) {
@@ -49,7 +40,7 @@ async function createStream(payload: ReadableStream<Uint8Array>) {

 export async function POST(req: NextRequest) {
  try {
-    const stream = await createStream(req.body!);
+    const stream = await createStream(req);
    return new Response(stream);
  } catch (error) {
    console.error("[Chat Stream]", error);
--- a/app/api/chat/.gitignore
+++ b/app/api/chat/.gitignore
@@ -1 +0,0 @@
-config.ts
--- a/app/api/chat/route.ts
+++ b/app/api/chat/route.ts
@@ -1,26 +0,0 @@
-import { OpenAIApi, Configuration } from "openai";
-import { ChatRequest } from "./typing";
-
-const apiKey = process.env.OPENAI_API_KEY;
-
-const openai = new OpenAIApi(
-  new Configuration({
-    apiKey,
-  })
-);
-
-export async function POST(req: Request) {
-  try {
-    const requestBody = (await req.json()) as ChatRequest;
-    const completion = await openai!.createChatCompletion(
-      {
-        ...requestBody,
-      }
-    );
-
-    return new Response(JSON.stringify(completion.data));
-  } catch (e) {
-    console.error("[Chat] ", e);
-    return new Response(JSON.stringify(e));
-  }
-}
--- a/app/api/common.ts
+++ b/app/api/common.ts
@@ -0,0 +1,22 @@
+import { NextRequest } from "next/server";
+
+const OPENAI_URL = "api.openai.com";
+const DEFAULT_PROTOCOL = "https";
+const PROTOCOL = process.env.PROTOCOL ?? DEFAULT_PROTOCOL;
+const BASE_URL = process.env.BASE_URL ?? OPENAI_URL;
+
+export async function requestOpenai(req: NextRequest) {
+  const apiKey = req.headers.get("token");
+  const openaiPath = req.headers.get("path");
+
+  console.log("[Proxy] ", openaiPath);
+
+  return fetch(`${PROTOCOL}://${BASE_URL}/${openaiPath}`, {
+    headers: {
+      "Content-Type": "application/json",
+      Authorization: `Bearer ${apiKey}`,
+    },
+    method: req.method,
+    body: req.body,
+  });
+}
--- a/app/api/openai/route.ts
+++ b/app/api/openai/route.ts
@@ -0,0 +1,28 @@
+import { NextRequest, NextResponse } from "next/server";
+import { requestOpenai } from "../common";
+
+async function makeRequest(req: NextRequest) {
+  try {
+    const res = await requestOpenai(req);
+    return new Response(res.body);
+  } catch (e) {
+    console.error("[OpenAI] ", req.body, e);
+    return NextResponse.json(
+      {
+        error: true,
+        msg: JSON.stringify(e),
+      },
+      {
+        status: 500,
+      },
+    );
+  }
+}
+
+export async function POST(req: NextRequest) {
+  return makeRequest(req);
+}
+
+export async function GET(req: NextRequest) {
+  return makeRequest(req);
+}
--- a/app/api/openai/typing.ts
+++ b/app/api/openai/typing.ts
--- a/app/components/home.module.scss
+++ b/app/components/home.module.scss
@@ -221,6 +221,14 @@
  margin-bottom: 100px;
 }

+.chat-body-title {
+  cursor: pointer;
+
+  &:hover {
+    text-decoration: underline;
+  }
+}
+
 .chat-message {
  display: flex;
  flex-direction: row;
@@ -237,6 +245,14 @@
  flex-direction: column;
  align-items: flex-start;
  animation: slide-in ease 0.3s;
+
+  &:hover {
+    .chat-message-top-actions {
+      opacity: 1;
+      right: 10px;
+      pointer-events: all;
+    }
+  }
 }

 .chat-message-user > .chat-message-container {
@@ -276,6 +292,36 @@
  user-select: text;
  word-break: break-word;
  border: var(--border-in-light);
+  position: relative;
+}
+
+.chat-message-top-actions {
+  font-size: 12px;
+  position: absolute;
+  right: 20px;
+  top: -26px;
+  left: 100px;
+  transition: all ease 0.3s;
+  opacity: 0;
+  pointer-events: none;
+
+  display: flex;
+  flex-direction: row-reverse;
+
+  .chat-message-top-action {
+    opacity: 0.5;
+    color: var(--black);
+    white-space: nowrap;
+    cursor: pointer;
+
+    &:hover {
+      opacity: 1;
+    }
+
+    &:not(:first-child) {
+      margin-right: 10px;
+    }
+  }
 }

 .chat-message-user > .chat-message-container > .chat-message-item {
@@ -288,20 +334,74 @@
  width: 100%;
  padding-top: 5px;
  box-sizing: border-box;
+  font-size: 12px;
 }

 .chat-message-action-date {
-  font-size: 12px;
  color: #aaa;
 }

 .chat-input-panel {
  position: absolute;
-  bottom: 20px;
+  bottom: 0px;
  display: flex;
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
+  flex-direction: column;
+}
+
+@mixin single-line {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.prompt-hints {
+  min-height: 20px;
+  width: 100%;
+  max-height: 50vh;
+  overflow: auto;
+  display: flex;
+  flex-direction: column-reverse;
+
+  background-color: var(--white);
+  border: var(--border-in-light);
+  border-radius: 10px;
+  margin-bottom: 10px;
+  box-shadow: var(--shadow);
+
+  .prompt-hint {
+    color: var(--black);
+    padding: 6px 10px;
+    animation: slide-in ease 0.3s;
+    cursor: pointer;
+    transition: all ease 0.3s;
+    border: transparent 1px solid;
+    margin: 4px;
+    border-radius: 8px;
+
+    &:not(:last-child) {
+      margin-top: 0;
+    }
+
+    .hint-title {
+      font-size: 12px;
+      font-weight: bolder;
+
+      @include single-line();
+    }
+    .hint-content {
+      font-size: 12px;
+
+      @include single-line();
+    }
+
+    &-selected,
+    &:hover {
+      border-color: var(--primary);
+    }
+  }
 }

 .chat-input-panel-inner {
@@ -318,7 +418,7 @@
  background-color: var(--white);
  color: var(--black);
  font-family: inherit;
-  padding: 10px 14px;
+  padding: 10px 14px 50px;
  resize: none;
  outline: none;
 }
@@ -339,7 +439,7 @@

  position: absolute;
  right: 30px;
-  bottom: 10px;
+  bottom: 30px;
 }

 .export-content {
--- a/app/components/home.tsx
+++ b/app/components/home.tsx
@@ -1,6 +1,7 @@
 "use client";

-import { useState, useRef, useEffect } from "react";
+import { useState, useRef, useEffect, useLayoutEffect } from "react";
+import { useDebouncedCallback } from "use-debounce";

 import { IconButton } from "./button";
 import styles from "./home.module.scss";
@@ -21,11 +22,14 @@ import CopyIcon from "../icons/copy.svg";
 import DownloadIcon from "../icons/download.svg";

 import { Message, SubmitKey, useChatStore, ChatSession } from "../store";
-import { showModal } from "./ui-lib";
+import { showModal, showToast } from "./ui-lib";
 import { copyToClipboard, downloadAs, isIOS, selectOrCopy } from "../utils";
 import Locale from "../locales";

 import dynamic from "next/dynamic";
+import { REPO_URL } from "../constant";
+import { ControllerPool } from "../requests";
+import { Prompt, usePromptStore } from "../store/prompt";

 export function Loading(props: { noLogo?: boolean }) {
  return (
@@ -129,7 +133,12 @@ function useSubmitHandler() {
      (config.submitKey === SubmitKey.AltEnter && e.altKey) ||
      (config.submitKey === SubmitKey.CtrlEnter && e.ctrlKey) ||
      (config.submitKey === SubmitKey.ShiftEnter && e.shiftKey) ||
-      config.submitKey === SubmitKey.Enter
+      (config.submitKey === SubmitKey.MetaEnter && e.metaKey) ||
+      (config.submitKey === SubmitKey.Enter &&
+        !e.altKey &&
+        !e.ctrlKey &&
+        !e.shiftKey &&
+        !e.metaKey)
    );
  };

@@ -139,29 +148,147 @@ function useSubmitHandler() {
  };
 }

-export function Chat(props: { showSideBar?: () => void }) {
+export function PromptHints(props: {
+  prompts: Prompt[];
+  onPromptSelect: (prompt: Prompt) => void;
+}) {
+  if (props.prompts.length === 0) return null;
+
+  return (
+    <div className={styles["prompt-hints"]}>
+      {props.prompts.map((prompt, i) => (
+        <div
+          className={styles["prompt-hint"]}
+          key={prompt.title + i.toString()}
+          onClick={() => props.onPromptSelect(prompt)}
+        >
+          <div className={styles["hint-title"]}>{prompt.title}</div>
+          <div className={styles["hint-content"]}>{prompt.content}</div>
+        </div>
+      ))}
+    </div>
+  );
+}
+
+export function Chat(props: {
+  showSideBar?: () => void;
+  sideBarShowing?: boolean;
+}) {
  type RenderMessage = Message & { preview?: boolean };

-  const session = useChatStore((state) => state.currentSession());
+  const chatStore = useChatStore();
+  const [session, sessionIndex] = useChatStore((state) => [
+    state.currentSession(),
+    state.currentSessionIndex,
+  ]);
+  const fontSize = useChatStore((state) => state.config.fontSize);
+
+  const inputRef = useRef<HTMLTextAreaElement>(null);
  const [userInput, setUserInput] = useState("");
  const [isLoading, setIsLoading] = useState(false);
  const { submitKey, shouldSubmit } = useSubmitHandler();

-  const onUserInput = useChatStore((state) => state.onUserInput);
+  // prompt hints
+  const promptStore = usePromptStore();
+  const [promptHints, setPromptHints] = useState<Prompt[]>([]);
+  const onSearch = useDebouncedCallback(
+    (text: string) => {
+      setPromptHints(promptStore.search(text));
+    },
+    100,
+    { leading: true, trailing: true }
+  );
+
+  const onPromptSelect = (prompt: Prompt) => {
+    setUserInput(prompt.content);
+    setPromptHints([]);
+    inputRef.current?.focus();
+  };
+
+  const scrollInput = () => {
+    const dom = inputRef.current;
+    if (!dom) return;
+    const paddingBottomNum: number = parseInt(
+      window.getComputedStyle(dom).paddingBottom,
+      10
+    );
+    dom.scrollTop = dom.scrollHeight - dom.offsetHeight + paddingBottomNum;
+  };
+
+  // only search prompts when user input is short
+  const SEARCH_TEXT_LIMIT = 30;
+  const onInput = (text: string) => {
+    scrollInput();
+    setUserInput(text);
+    const n = text.trim().length;
+
+    // clear search results
+    if (n === 0) {
+      setPromptHints([]);
+    } else if (!chatStore.config.disablePromptHint && n < SEARCH_TEXT_LIMIT) {
+      // check if need to trigger auto completion
+      if (text.startsWith("/") && text.length > 1) {
+        onSearch(text.slice(1));
+      }
+    }
+  };
+
+  // submit user input
  const onUserSubmit = () => {
    if (userInput.length <= 0) return;
    setIsLoading(true);
-    onUserInput(userInput).then(() => setIsLoading(false));
+    chatStore.onUserInput(userInput).then(() => setIsLoading(false));
    setUserInput("");
+    setPromptHints([]);
+    inputRef.current?.focus();
  };
+
+  // stop response
+  const onUserStop = (messageIndex: number) => {
+    console.log(ControllerPool, sessionIndex, messageIndex);
+    ControllerPool.stop(sessionIndex, messageIndex);
+  };
+
+  // check if should send message
  const onInputKeyDown = (e: KeyboardEvent) => {
    if (shouldSubmit(e)) {
      onUserSubmit();
      e.preventDefault();
    }
  };
+  const onRightClick = (e: any, message: Message) => {
+    // auto fill user input
+    if (message.role === "user") {
+      setUserInput(message.content);
+    }
+
+    // copy to clipboard
+    if (selectOrCopy(e.currentTarget, message.content)) {
+      e.preventDefault();
+    }
+  };
+
+  const onResend = (botIndex: number) => {
+    // find last user input message and resend
+    for (let i = botIndex; i >= 0; i -= 1) {
+      if (messages[i].role === "user") {
+        setIsLoading(true);
+        chatStore
+          .onUserInput(messages[i].content)
+          .then(() => setIsLoading(false));
+        inputRef.current?.focus();
+        return;
+      }
+    }
+  };
+
+  // for auto-scroll
  const latestMessageRef = useRef<HTMLDivElement>(null);

+  // wont scroll while hovering messages
+  const [autoScroll, setAutoScroll] = useState(false);
+
+  // preview messages
  const messages = (session.messages as RenderMessage[])
    .concat(
      isLoading
@@ -188,14 +315,16 @@ export function Chat(props: { showSideBar?: () => void }) {
        : []
    );

-  useEffect(() => {
-    const dom = latestMessageRef.current;
-    if (dom && !isIOS()) {
-      dom.scrollIntoView({
-        behavior: "smooth",
-        block: "end",
-      });
-    }
+  // auto scroll
+  useLayoutEffect(() => {
+    setTimeout(() => {
+      const dom = latestMessageRef.current;
+      if (dom && !isIOS() && autoScroll) {
+        dom.scrollIntoView({
+          block: "end",
+        });
+      }
+    }, 500);
  });

  return (
@@ -205,7 +334,17 @@ export function Chat(props: { showSideBar?: () => void }) {
          className={styles["window-header-title"]}
          onClick={props?.showSideBar}
        >
-          <div className={styles["window-header-main-title"]}>
+          <div
+            className={`${styles["window-header-main-title"]} ${styles["chat-body-title"]}`}
+            onClick={() => {
+              const newTopic = prompt(Locale.Chat.Rename, session.topic);
+              if (newTopic && newTopic !== session.topic) {
+                chatStore.updateCurrentSession(
+                  (session) => (session.topic = newTopic!)
+                );
+              }
+            }}
+          >
            {session.topic}
          </div>
          <div className={styles["window-header-sub-title"]}>
@@ -265,17 +404,42 @@ export function Chat(props: { showSideBar?: () => void }) {
                  </div>
                )}
                <div className={styles["chat-message-item"]}>
+                  {!isUser &&
+                    !(message.preview || message.content.length === 0) && (
+                      <div className={styles["chat-message-top-actions"]}>
+                        {message.streaming ? (
+                          <div
+                            className={styles["chat-message-top-action"]}
+                            onClick={() => onUserStop(i)}
+                          >
+                            {Locale.Chat.Actions.Stop}
+                          </div>
+                        ) : (
+                          <div
+                            className={styles["chat-message-top-action"]}
+                            onClick={() => onResend(i)}
+                          >
+                            {Locale.Chat.Actions.Retry}
+                          </div>
+                        )}
+
+                        <div
+                          className={styles["chat-message-top-action"]}
+                          onClick={() => copyToClipboard(message.content)}
+                        >
+                          {Locale.Chat.Actions.Copy}
+                        </div>
+                      </div>
+                    )}
                  {(message.preview || message.content.length === 0) &&
                  !isUser ? (
                    <LoadingIcon />
                  ) : (
                    <div
                      className="markdown-body"
-                      onContextMenu={(e) => {
-                        if (selectOrCopy(e.currentTarget, message.content)) {
-                          e.preventDefault();
-                        }
-                      }}
+                      style={{ fontSize: `${fontSize}px` }}
+                      onContextMenu={(e) => onRightClick(e, message)}
+                      onDoubleClickCapture={() => setUserInput(message.content)}
                    >
                      <Markdown content={message.content} />
                    </div>
@@ -292,20 +456,28 @@ export function Chat(props: { showSideBar?: () => void }) {
            </div>
          );
        })}
-        <span ref={latestMessageRef} style={{ opacity: 0 }}>
+        <div ref={latestMessageRef} style={{ opacity: 0, height: "4em" }}>
          -
-        </span>
+        </div>
      </div>

      <div className={styles["chat-input-panel"]}>
+        <PromptHints prompts={promptHints} onPromptSelect={onPromptSelect} />
        <div className={styles["chat-input-panel-inner"]}>
          <textarea
+            ref={inputRef}
            className={styles["chat-input"]}
            placeholder={Locale.Chat.Input(submitKey)}
-            rows={3}
-            onInput={(e) => setUserInput(e.currentTarget.value)}
+            rows={4}
+            onInput={(e) => onInput(e.currentTarget.value)}
            value={userInput}
            onKeyDown={(e) => onInputKeyDown(e as any)}
+            onFocus={() => setAutoScroll(true)}
+            onBlur={() => {
+              setAutoScroll(false);
+              setTimeout(() => setPromptHints([]), 100);
+            }}
+            autoFocus={!props?.sideBarShowing}
          />
          <IconButton
            icon={<SendWhiteIcon />}
@@ -325,11 +497,18 @@ function useSwitchTheme() {
  useEffect(() => {
    document.body.classList.remove("light");
    document.body.classList.remove("dark");
+
    if (config.theme === "dark") {
      document.body.classList.add("dark");
    } else if (config.theme === "light") {
      document.body.classList.add("light");
    }
+
+    const themeColor = getComputedStyle(document.body)
+      .getPropertyValue("--theme-color")
+      .trim();
+    const metaDescription = document.querySelector('meta[name="theme-color"]');
+    metaDescription?.setAttribute("content", themeColor);
  }, [config.theme]);
 }

@@ -391,6 +570,16 @@ function showMemoryPrompt(session: ChatSession) {
  });
 }

+const useHasHydrated = () => {
+  const [hasHydrated, setHasHydrated] = useState<boolean>(false);
+
+  useEffect(() => {
+    setHasHydrated(true);
+  }, []);
+
+  return hasHydrated;
+};
+
 export function Home() {
  const [createNewSession, currentIndex, removeSession] = useChatStore(
    (state) => [
@@ -399,7 +588,7 @@ export function Home() {
      state.removeSession,
    ]
  );
-  const loading = !useChatStore?.persist?.hasHydrated();
+  const loading = !useHasHydrated();
  const [showSideBar, setShowSideBar] = useState(true);

  // setting
@@ -463,10 +652,7 @@ export function Home() {
              />
            </div>
            <div className={styles["sidebar-action"]}>
-              <a
-                href="https://github.com/Yidadaa/ChatGPT-Next-Web"
-                target="_blank"
-              >
+              <a href={REPO_URL} target="_blank">
                <IconButton icon={<GithubIcon />} />
              </a>
            </div>
@@ -475,7 +661,10 @@ export function Home() {
            <IconButton
              icon={<AddIcon />}
              text={Locale.Home.NewChat}
-              onClick={createNewSession}
+              onClick={() => {
+                createNewSession();
+                setShowSideBar(false);
+              }}
            />
          </div>
        </div>
@@ -490,7 +679,11 @@ export function Home() {
            }}
          />
        ) : (
-          <Chat key="chat" showSideBar={() => setShowSideBar(true)} />
+          <Chat
+            key="chat"
+            showSideBar={() => setShowSideBar(true)}
+            sideBarShowing={showSideBar}
+          />
        )}
      </div>
    </div>
--- a/app/components/markdown.tsx
+++ b/app/components/markdown.tsx
@@ -1,14 +1,42 @@
 import ReactMarkdown from "react-markdown";
 import "katex/dist/katex.min.css";
 import RemarkMath from "remark-math";
+import RemarkBreaks from "remark-breaks";
 import RehypeKatex from "rehype-katex";
-import RemarkGfm from 'remark-gfm'
-import RehypePrsim from 'rehype-prism-plus'
+import RemarkGfm from "remark-gfm";
+import RehypePrsim from "rehype-prism-plus";
+import { useRef } from "react";
+import { copyToClipboard } from "../utils";
+
+export function PreCode(props: { children: any }) {
+  const ref = useRef<HTMLPreElement>(null);
+
+  return (
+    <pre ref={ref}>
+      <span
+        className="copy-code-button"
+        onClick={() => {
+          if (ref.current) {
+            const code = ref.current.innerText;
+            copyToClipboard(code);
+          }
+        }}
+      ></span>
+      {props.children}
+    </pre>
+  );
+}

 export function Markdown(props: { content: string }) {
-    return (
-        <ReactMarkdown remarkPlugins={[RemarkMath, RemarkGfm]} rehypePlugins={[RehypeKatex, RehypePrsim]}>
-            {props.content}
-        </ReactMarkdown>
-    );
-}
+  return (
+    <ReactMarkdown
+      remarkPlugins={[RemarkMath, RemarkGfm, RemarkBreaks]}
+      rehypePlugins={[RehypeKatex, [RehypePrsim, { ignoreMissing: true }]]}
+      components={{
+        pre: PreCode,
+      }}
+    >
+      {props.content}
+    </ReactMarkdown>
+  );
+}
--- a/app/components/settings.tsx
+++ b/app/components/settings.tsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useState, useEffect, useRef, useMemo } from "react";

 import EmojiPicker, { Theme as EmojiTheme } from "emoji-picker-react";

@@ -7,14 +7,27 @@ import styles from "./settings.module.scss";
 import ResetIcon from "../icons/reload.svg";
 import CloseIcon from "../icons/close.svg";
 import ClearIcon from "../icons/clear.svg";
+import EditIcon from "../icons/edit.svg";

-import { List, ListItem, Popover } from "./ui-lib";
+import { List, ListItem, Popover, showToast } from "./ui-lib";

 import { IconButton } from "./button";
-import { SubmitKey, useChatStore, Theme, ALL_MODELS } from "../store";
-import { Avatar } from "./home";
+import {
+  SubmitKey,
+  useChatStore,
+  Theme,
+  ALL_MODELS,
+  useUpdateStore,
+  useAccessStore,
+} from "../store";
+import { Avatar, PromptHints } from "./home";

-import Locale, { changeLang, getLang } from "../locales";
+import Locale, { AllLangs, changeLang, getLang } from "../locales";
+import { getCurrentCommitId } from "../utils";
+import Link from "next/link";
+import { UPDATE_URL } from "../constant";
+import { SearchService, usePromptStore } from "../store/prompt";
+import { requestUsage } from "../requests";

 function SettingItem(props: {
  title: string;
@@ -29,7 +42,7 @@ function SettingItem(props: {
          <div className={styles["settings-sub-title"]}>{props.subTitle}</div>
        )}
      </div>
-      <div>{props.children}</div>
+      {props.children}
    </ListItem>
  );
 }
@@ -42,9 +55,56 @@ export function Settings(props: { closeSettings: () => void }) {
      state.updateConfig,
      state.resetConfig,
      state.clearAllData,
-    ]
+    ],
  );

+  const updateStore = useUpdateStore();
+  const [checkingUpdate, setCheckingUpdate] = useState(false);
+  const currentId = getCurrentCommitId();
+  const remoteId = updateStore.remoteId;
+  const hasNewVersion = currentId !== remoteId;
+
+  function checkUpdate(force = false) {
+    setCheckingUpdate(true);
+    updateStore.getLatestCommitId(force).then(() => {
+      setCheckingUpdate(false);
+    });
+  }
+
+  const [usage, setUsage] = useState<{
+    granted?: number;
+    used?: number;
+  }>();
+  const [loadingUsage, setLoadingUsage] = useState(false);
+  function checkUsage() {
+    setLoadingUsage(true);
+    requestUsage()
+      .then((res) =>
+        setUsage({
+          granted: res?.total_granted,
+          used: res?.total_used,
+        }),
+      )
+      .finally(() => {
+        setLoadingUsage(false);
+      });
+  }
+
+  useEffect(() => {
+    checkUpdate();
+    checkUsage();
+  }, []);
+
+  const accessStore = useAccessStore();
+  const enabledAccessControl = useMemo(
+    () => accessStore.enabledAccessControl(),
+    [],
+  );
+
+  const promptStore = usePromptStore();
+  const builtinCount = SearchService.count.builtin;
+  const customCount = promptStore.prompts.size ?? 0;
+
  return (
    <>
      <div className={styles["window-header"]}>
@@ -109,13 +169,38 @@ export function Settings(props: { closeSettings: () => void }) {
            </Popover>
          </SettingItem>

+          <SettingItem
+            title={Locale.Settings.Update.Version(currentId)}
+            subTitle={
+              checkingUpdate
+                ? Locale.Settings.Update.IsChecking
+                : hasNewVersion
+                ? Locale.Settings.Update.FoundUpdate(remoteId ?? "ERROR")
+                : Locale.Settings.Update.IsLatest
+            }
+          >
+            {checkingUpdate ? (
+              <div />
+            ) : hasNewVersion ? (
+              <Link href={UPDATE_URL} target="_blank" className="link">
+                {Locale.Settings.Update.GoToUpdate}
+              </Link>
+            ) : (
+              <IconButton
+                icon={<ResetIcon></ResetIcon>}
+                text={Locale.Settings.Update.CheckUpdate}
+                onClick={() => checkUpdate(true)}
+              />
+            )}
+          </SettingItem>
+
          <SettingItem title={Locale.Settings.SendKey}>
            <select
              value={config.submitKey}
              onChange={(e) => {
                updateConfig(
                  (config) =>
-                    (config.submitKey = e.target.value as any as SubmitKey)
+                    (config.submitKey = e.target.value as any as SubmitKey),
                );
              }}
            >
@@ -135,7 +220,7 @@ export function Settings(props: { closeSettings: () => void }) {
              value={config.theme}
              onChange={(e) => {
                updateConfig(
-                  (config) => (config.theme = e.target.value as any as Theme)
+                  (config) => (config.theme = e.target.value as any as Theme),
                );
              }}
            >
@@ -148,22 +233,38 @@ export function Settings(props: { closeSettings: () => void }) {
          </ListItem>

          <SettingItem title={Locale.Settings.Lang.Name}>
-            <div className="">
-              <select
-                value={getLang()}
-                onChange={(e) => {
-                  changeLang(e.target.value as any);
-                }}
-              >
-                <option value="en" key="en">
-                  {Locale.Settings.Lang.Options.en}
+            <select
+              value={getLang()}
+              onChange={(e) => {
+                changeLang(e.target.value as any);
+              }}
+            >
+              {AllLangs.map((lang) => (
+                <option value={lang} key={lang}>
+                  {Locale.Settings.Lang.Options[lang]}
                </option>
+              ))}
+            </select>
+          </SettingItem>

-                <option value="cn" key="cn">
-                  {Locale.Settings.Lang.Options.cn}
-                </option>
-              </select>
-            </div>
+          <SettingItem
+            title={Locale.Settings.FontSize.Title}
+            subTitle={Locale.Settings.FontSize.SubTitle}
+          >
+            <input
+              type="range"
+              title={`${config.fontSize ?? 14}px`}
+              value={config.fontSize}
+              min="12"
+              max="18"
+              step="1"
+              onChange={(e) =>
+                updateConfig(
+                  (config) =>
+                    (config.fontSize = Number.parseInt(e.currentTarget.value)),
+                )
+              }
+            ></input>
          </SettingItem>

          <div className="no-mobile">
@@ -173,7 +274,7 @@ export function Settings(props: { closeSettings: () => void }) {
                checked={config.tightBorder}
                onChange={(e) =>
                  updateConfig(
-                    (config) => (config.tightBorder = e.currentTarget.checked)
+                    (config) => (config.tightBorder = e.currentTarget.checked),
                  )
                }
              ></input>
@@ -181,6 +282,91 @@ export function Settings(props: { closeSettings: () => void }) {
          </div>
        </List>
        <List>
+          <SettingItem
+            title={Locale.Settings.Prompt.Disable.Title}
+            subTitle={Locale.Settings.Prompt.Disable.SubTitle}
+          >
+            <input
+              type="checkbox"
+              checked={config.disablePromptHint}
+              onChange={(e) =>
+                updateConfig(
+                  (config) =>
+                    (config.disablePromptHint = e.currentTarget.checked),
+                )
+              }
+            ></input>
+          </SettingItem>
+
+          <SettingItem
+            title={Locale.Settings.Prompt.List}
+            subTitle={Locale.Settings.Prompt.ListCount(
+              builtinCount,
+              customCount,
+            )}
+          >
+            <IconButton
+              icon={<EditIcon />}
+              text={Locale.Settings.Prompt.Edit}
+              onClick={() => showToast(Locale.WIP)}
+            />
+          </SettingItem>
+        </List>
+        <List>
+          {enabledAccessControl ? (
+            <SettingItem
+              title={Locale.Settings.AccessCode.Title}
+              subTitle={Locale.Settings.AccessCode.SubTitle}
+            >
+              <input
+                value={accessStore.accessCode}
+                type="text"
+                placeholder={Locale.Settings.AccessCode.Placeholder}
+                onChange={(e) => {
+                  accessStore.updateCode(e.currentTarget.value);
+                }}
+              ></input>
+            </SettingItem>
+          ) : (
+            <></>
+          )}
+
+          <SettingItem
+            title={Locale.Settings.Token.Title}
+            subTitle={Locale.Settings.Token.SubTitle}
+          >
+            <input
+              value={accessStore.token}
+              type="text"
+              placeholder={Locale.Settings.Token.Placeholder}
+              onChange={(e) => {
+                accessStore.updateToken(e.currentTarget.value);
+              }}
+            ></input>
+          </SettingItem>
+
+          <SettingItem
+            title={Locale.Settings.Usage.Title}
+            subTitle={
+              loadingUsage
+                ? Locale.Settings.Usage.IsChecking
+                : Locale.Settings.Usage.SubTitle(
+                    usage?.granted ?? "[?]",
+                    usage?.used ?? "[?]",
+                  )
+            }
+          >
+            {loadingUsage ? (
+              <div />
+            ) : (
+              <IconButton
+                icon={<ResetIcon></ResetIcon>}
+                text={Locale.Settings.Usage.Check}
+                onClick={checkUsage}
+              />
+            )}
+          </SettingItem>
+
          <SettingItem
            title={Locale.Settings.HistoryCount.Title}
            subTitle={Locale.Settings.HistoryCount.SubTitle}
@@ -195,7 +381,7 @@ export function Settings(props: { closeSettings: () => void }) {
              onChange={(e) =>
                updateConfig(
                  (config) =>
-                    (config.historyMessageCount = e.target.valueAsNumber)
+                    (config.historyMessageCount = e.target.valueAsNumber),
                )
              }
            ></input>
@@ -214,7 +400,7 @@ export function Settings(props: { closeSettings: () => void }) {
                updateConfig(
                  (config) =>
                    (config.compressMessageLengthThreshold =
-                      e.currentTarget.valueAsNumber)
+                      e.currentTarget.valueAsNumber),
                )
              }
            ></input>
@@ -227,7 +413,8 @@ export function Settings(props: { closeSettings: () => void }) {
              value={config.modelConfig.model}
              onChange={(e) => {
                updateConfig(
-                  (config) => (config.modelConfig.model = e.currentTarget.value)
+                  (config) =>
+                    (config.modelConfig.model = e.currentTarget.value),
                );
              }}
            >
@@ -246,13 +433,13 @@ export function Settings(props: { closeSettings: () => void }) {
              type="range"
              value={config.modelConfig.temperature.toFixed(1)}
              min="0"
-              max="1"
+              max="2"
              step="0.1"
              onChange={(e) => {
                updateConfig(
                  (config) =>
                    (config.modelConfig.temperature =
-                      e.currentTarget.valueAsNumber)
+                      e.currentTarget.valueAsNumber),
                );
              }}
            ></input>
@@ -264,13 +451,13 @@ export function Settings(props: { closeSettings: () => void }) {
            <input
              type="number"
              min={100}
-              max={4000}
+              max={4096}
              value={config.modelConfig.max_tokens}
              onChange={(e) =>
                updateConfig(
                  (config) =>
                    (config.modelConfig.max_tokens =
-                      e.currentTarget.valueAsNumber)
+                      e.currentTarget.valueAsNumber),
                )
              }
            ></input>
@@ -289,7 +476,7 @@ export function Settings(props: { closeSettings: () => void }) {
                updateConfig(
                  (config) =>
                    (config.modelConfig.presence_penalty =
-                      e.currentTarget.valueAsNumber)
+                      e.currentTarget.valueAsNumber),
                );
              }}
            ></input>
--- a/app/components/ui-lib.tsx
+++ b/app/components/ui-lib.tsx
@@ -36,7 +36,7 @@ export function ListItem(props: { children: JSX.Element[] }) {
  return <div className={styles["list-item"]}>{props.children}</div>;
 }

-export function List(props: { children: JSX.Element[] }) {
+export function List(props: { children: JSX.Element[] | JSX.Element }) {
  return <div className={styles.list}>{props.children}</div>;
 }

--- a/app/constant.ts
+++ b/app/constant.ts
@@ -0,0 +1,5 @@
+export const OWNER = "Yidadaa";
+export const REPO = "ChatGPT-Next-Web";
+export const REPO_URL = `https://github.com/${OWNER}/${REPO}`;
+export const UPDATE_URL = `${REPO_URL}#%E4%BF%9D%E6%8C%81%E6%9B%B4%E6%96%B0-keep-updated`;
+export const FETCH_COMMIT_URL = `https://api.github.com/repos/${OWNER}/${REPO}/commits?per_page=1`;
--- a/app/icons/edit.svg
+++ b/app/icons/edit.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" viewBox="0 0 16 16" fill="none"><defs><rect id="path_0" x="0" y="0" width="16" height="16" /></defs><g opacity="1" transform="translate(0 0)  rotate(0 8 8)"><mask id="bg-mask-0" fill="white"><use xlink:href="#path_0"></use></mask><g mask="url(#bg-mask-0)" ><path  id="路径 1" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(10.5 11)  rotate(0 1.4166666666666665 1.8333333333333333)" d="M2.83,0L2.83,3C2.83,3.37 2.53,3.67 2.17,3.67L0,3.67 " /><path  id="路径 2" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(2.6666666666666665 1.3333333333333333)  rotate(0 5.333333333333333 6.666666666666666)" d="M10.67,4L10.67,0.67C10.67,0.3 10.37,0 10,0L0.67,0C0.3,0 0,0.3 0,0.67L0,12.67C0,13.03 0.3,13.33 0.67,13.33L2.67,13.33 " /><path  id="路径 3" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(5.333333333333333 5.333333333333333)  rotate(0 2.333333333333333 0)" d="M0,0L4.67,0 " /><path  id="路径 4" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(7.666666666666666 7.666666666666666)  rotate(0 2.833333333333333 3.5)" d="M0,7L5.67,0 " /><path  id="路径 5" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(5.333333333333333 8)  rotate(0 1.3333333333333333 0)" d="M0,0L2.67,0 " /></g></g></svg>
--- a/app/icons/export.svg
+++ b/app/icons/export.svg
@@ -1,24 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16"
-  height="16" viewBox="0 0 16 16" fill="none">
-  <defs>
-    <rect id="path_0" x="0" y="0" width="16" height="16" />
-  </defs>
-  <g opacity="1" transform="translate(0 0)  rotate(0 8 8)">
-    <mask id="bg-mask-0" fill="white">
-      <use xlink:href="#path_0"></use>
-    </mask>
-    <g mask="url(#bg-mask-0)">
-      <path id="路径 1"
-        style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0"
-        transform="translate(2 9)  rotate(0 6 2.6666666666666665)"
-        d="M12,0C12,2 10.67,5.33 6,5.33C1.33,5.33 0,2 0,0 " />
-      <path id="路径 2"
-        style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0"
-        transform="translate(8.0026 1.7001966666666668)  rotate(0 0 4.649918333333334)"
-        d="M0,0L0,9.3 " />
-      <path id="路径 3"
-        style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0"
-        transform="translate(4 1.6666666666666665)  rotate(0 4 2)" d="M0,4L4,0L8,4 " />
-    </g>
-  </g>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" viewBox="0 0 16 16" fill="none"><defs><rect id="path_0" x="0" y="0" width="16" height="16" /></defs><g opacity="1" transform="translate(0 0)  rotate(0 8 8)"><mask id="bg-mask-0" fill="white"><use xlink:href="#path_0"></use></mask><g mask="url(#bg-mask-0)" ><path  id="路径 1" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(1.2400716519614834 2.3333321805983163)  rotate(0 6.785117896431597 4.552683909700841)" d="M12.27,9.11C13.36,8.34 13.83,6.94 13.43,5.67C13.02,4.39 11.78,3.69 10.44,3.69L9.67,3.69C9.16,1.72 7.5,0.27 5.47,0.03C3.45,-0.2 1.5,0.84 0.56,2.64C-0.38,4.45 -0.11,6.64 1.23,8.17 " /><path  id="路径 2" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(8 7.666666666666666)  rotate(0 0.00140000000000029 3)" d="M0,6L0,0 " /><path  id="路径 3" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(5.8786 11.5454)  rotate(0 2.1213333333333333 1.0606666666666662)" d="M4.24,0L2.12,2.12L0,0 " /></g></g></svg>
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -1,12 +1,45 @@
+/* eslint-disable @next/next/no-page-custom-font */
 import "./styles/globals.scss";
 import "./styles/markdown.scss";
 import "./styles/prism.scss";
+import process from "child_process";
+import { ACCESS_CODES, IS_IN_DOCKER } from "./api/access";
+
+let COMMIT_ID: string | undefined;
+try {
+  COMMIT_ID = process
+    .execSync("git rev-parse --short HEAD")
+    .toString()
+    .trim();
+} catch (e) {
+  console.error("No git or not from git repo.")
+}

 export const metadata = {
  title: "ChatGPT Next Web",
  description: "Your personal ChatGPT Chat Bot.",
+  appleWebApp: {
+    title: "ChatGPT Next Web",
+    statusBarStyle: "black-translucent",
+  },
+  themeColor: "#fafafa"
 };

+function Meta() {
+  const metas = {
+    version: COMMIT_ID ?? "unknown",
+    access: (ACCESS_CODES.size > 0 || IS_IN_DOCKER) ? "enabled" : "disabled",
+  };
+
+  return (
+    <>
+      {Object.entries(metas).map(([k, v]) => (
+        <meta name={k} content={v} key={k} />
+      ))}
+    </>
+  );
+}
+
 export default function RootLayout({
  children,
 }: {
@@ -19,7 +52,15 @@ export default function RootLayout({
          name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
        />
+        <Meta />
        <link rel="manifest" href="/site.webmanifest"></link>
+        <link rel="preconnect" href="https://fonts.googleapis.com"></link>
+        <link rel="preconnect" href="https://fonts.gstatic.com"></link>
+        <link
+          href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;700;900&display=swap"
+          rel="stylesheet"
+        ></link>
+        <script src="/serviceWorkerRegister.js" defer></script>
      </head>
      <body>{children}</body>
    </html>
--- a/app/locales/cn.ts
+++ b/app/locales/cn.ts
@@ -1,4 +1,10 @@
+import { SubmitKey } from "../store/app";
+
 const cn = {
+  WIP: "该功能仍在开发中……",
+  Error: {
+    Unauthorized: "现在是未授权状态，请在设置页填写授权码。",
+  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} 条对话`,
  },
@@ -8,9 +14,19 @@ const cn = {
      ChatList: "查看消息列表",
      CompressedHistory: "查看压缩后的历史 Prompt",
      Export: "导出聊天记录",
+      Copy: "复制",
+      Stop: "停止",
+      Retry: "重试",
    },
+    Rename: "重命名对话",
    Typing: "正在输入…",
-    Input: (submitKey: string) => `输入消息，${submitKey} 发送`,
+    Input: (submitKey: string) => {
+      var inputHints = `输入消息，${submitKey} 发送`;
+      if (submitKey === String(SubmitKey.Enter)) {
+        inputHints += "，Shift + Enter 换行";
+      }
+      return inputHints;
+    },
    Send: "发送",
  },
  Export: {
@@ -38,14 +54,38 @@ const cn = {
    Lang: {
      Name: "Language",
      Options: {
-        cn: "中文",
+        cn: "简体中文",
        en: "English",
+        tw: "繁體中文",
      },
    },
    Avatar: "头像",
+    FontSize: {
+      Title: "字体大小",
+      SubTitle: "聊天内容的字体大小",
+    },
+
+    Update: {
+      Version: (x: string) => `当前版本：${x}`,
+      IsLatest: "已是最新版本",
+      CheckUpdate: "检查更新",
+      IsChecking: "正在检查更新...",
+      FoundUpdate: (x: string) => `发现新版本：${x}`,
+      GoToUpdate: "前往更新",
+    },
    SendKey: "发送键",
    Theme: "主题",
    TightBorder: "紧凑边框",
+    Prompt: {
+      Disable: {
+        Title: "禁用提示词自动补全",
+        SubTitle: "在输入框开头输入 / 即可触发自动补全",
+      },
+      List: "自定义提示词列表",
+      ListCount: (builtin: number, custom: number) =>
+        `内置 ${builtin} 条，用户定义 ${custom} 条`,
+      Edit: "编辑",
+    },
    HistoryCount: {
      Title: "附带历史消息数",
      SubTitle: "每次请求携带的历史消息数",
@@ -54,6 +94,24 @@ const cn = {
      Title: "历史消息长度压缩阈值",
      SubTitle: "当未压缩的历史消息超过该值时，将进行压缩",
    },
+    Token: {
+      Title: "API Key",
+      SubTitle: "使用自己的 Key 可绕过受控访问限制",
+      Placeholder: "OpenAI API Key",
+    },
+    Usage: {
+      Title: "账户余额",
+      SubTitle(granted: any, used: any) {
+        return `总共 $${granted}，已使用 $${used}`;
+      },
+      IsChecking: "正在检查…",
+      Check: "重新检查",
+    },
+    AccessCode: {
+      Title: "访问码",
+      SubTitle: "现在是受控访问状态",
+      Placeholder: "请输入访问码",
+    },
    Model: "模型 (model)",
    Temperature: {
      Title: "随机性 (temperature)",
@@ -76,7 +134,7 @@ const cn = {
      History: (content: string) =>
        "这是 ai 和用户的历史聊天总结作为前情提要：" + content,
      Topic:
-        "直接返回这句话的简要主题，不要解释，如果没有主题，请直接返回“闲聊”",
+        "使用四到五个字直接返回这句话的简要主题，不要解释、不要标点、不要语气词、不要多余文本，如果没有主题，请直接返回“闲聊”",
      Summarize:
        "简要总结一下你和用户的对话，用作后续的上下文提示 prompt，控制在 50 字以内",
    },
--- a/app/locales/en.ts
+++ b/app/locales/en.ts
@@ -1,6 +1,12 @@
+import { SubmitKey } from "../store/app";
 import type { LocaleType } from "./index";

 const en: LocaleType = {
+  WIP: "WIP...",
+  Error: {
+    Unauthorized:
+      "Unauthorized access, please enter access code in settings page.",
+  },
  ChatItem: {
    ChatItemCount: (count: number) => `${count} messages`,
  },
@@ -10,10 +16,19 @@ const en: LocaleType = {
      ChatList: "Go To Chat List",
      CompressedHistory: "Compressed History Memory Prompt",
      Export: "Export All Messages as Markdown",
+      Copy: "Copy",
+      Stop: "Stop",
+      Retry: "Retry",
    },
+    Rename: "Rename Chat",
    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: {
@@ -41,14 +56,37 @@ const en: LocaleType = {
    Lang: {
      Name: "语言",
      Options: {
-        cn: "中文",
+        cn: "简体中文",
        en: "English",
+        tw: "繁體中文",
      },
    },
    Avatar: "Avatar",
+    FontSize: {
+      Title: "Font Size",
+      SubTitle: "Adjust font size of chat content",
+    },
+    Update: {
+      Version: (x: string) => `Version: ${x}`,
+      IsLatest: "Latest version",
+      CheckUpdate: "Check Update",
+      IsChecking: "Checking update...",
+      FoundUpdate: (x: string) => `Found new version: ${x}`,
+      GoToUpdate: "Update",
+    },
    SendKey: "Send Key",
    Theme: "Theme",
    TightBorder: "Tight Border",
+    Prompt: {
+      Disable: {
+        Title: "Disable auto-completion",
+        SubTitle: "Input / to trigger auto-completion",
+      },
+      List: "Prompt List",
+      ListCount: (builtin: number, custom: number) =>
+        `${builtin} built-in, ${custom} user-defined`,
+      Edit: "Edit",
+    },
    HistoryCount: {
      Title: "Attached Messages Count",
      SubTitle: "Number of sent messages attached per request",
@@ -58,6 +96,24 @@ const en: LocaleType = {
      SubTitle:
        "Will compress if uncompressed messages length exceeds the value",
    },
+    Token: {
+      Title: "API Key",
+      SubTitle: "Use your key to ignore access code limit",
+      Placeholder: "OpenAI API Key",
+    },
+    Usage: {
+      Title: "Account Balance",
+      SubTitle(granted: any, used: any) {
+        return `Total $${granted}, Used $${used}`;
+      },
+      IsChecking: "Checking...",
+      Check: "Check Again",
+    },
+    AccessCode: {
+      Title: "Access Code",
+      SubTitle: "Access control enabled",
+      Placeholder: "Need Access Code",
+    },
    Model: "Model",
    Temperature: {
      Title: "Temperature",
@@ -82,7 +138,7 @@ const en: LocaleType = {
        "This is a summary of the chat history between the AI and the user as a recap: " +
        content,
      Topic:
-        "Provide a brief topic of the sentence without explanation. If there is no topic, return 'Chitchat'.",
+        "Please generate a four to five word title summarizing our conversation without any lead-in, punctuation, quotation marks, periods, symbols, or additional text. Remove enclosing quotation marks.",
      Summarize:
        "Summarize our discussion briefly in 50 characters or less to use as a prompt for future context.",
    },
--- a/app/locales/index.ts
+++ b/app/locales/index.ts
@@ -1,53 +1,57 @@
-import CN from './cn'
-import EN from './en'
+import CN from "./cn";
+import EN from "./en";
+import TW from "./tw";

-export type { LocaleType } from './cn'
+export type { LocaleType } from "./cn";

-type Lang = 'en' | 'cn'
+export const AllLangs = ["en", "cn", "tw"] as const;
+type Lang = (typeof AllLangs)[number];

-const LANG_KEY = 'lang'
+const LANG_KEY = "lang";

 function getItem(key: string) {
-    try {
-        return localStorage.getItem(key)
-    } catch {
-        return null
-    }
+  try {
+    return localStorage.getItem(key);
+  } catch {
+    return null;
+  }
 }

 function setItem(key: string, value: string) {
-    try {
-        localStorage.setItem(key, value)
-    } catch { }
+  try {
+    localStorage.setItem(key, value);
+  } catch {}
 }

 function getLanguage() {
-    try {
-        return navigator.language.toLowerCase()
-    } catch {
-        return 'cn'
-    }
+  try {
+    return navigator.language.toLowerCase();
+  } catch {
+    return "cn";
+  }
 }

 export function getLang(): Lang {
-    const savedLang = getItem(LANG_KEY)
+  const savedLang = getItem(LANG_KEY);

-    if (['en', 'cn'].includes(savedLang ?? '')) {
-        return savedLang as Lang
-    }
+  if (AllLangs.includes((savedLang ?? "") as Lang)) {
+    return savedLang as Lang;
+  }

-    const lang = getLanguage()
+  const lang = getLanguage();

-    if (lang.includes('zh') || lang.includes('cn')) {
-        return 'cn'
-    } else {
-        return 'en'
-    }
+  if (lang.includes("zh") || lang.includes("cn")) {
+    return "cn";
+  } else if (lang.includes("tw")) {
+    return "tw";
+  } else {
+    return "en";
+  }
 }

 export function changeLang(lang: Lang) {
-    setItem(LANG_KEY, lang)
-    location.reload()
+  setItem(LANG_KEY, lang);
+  location.reload();
 }

-export default { en: EN, cn: CN }[getLang()]
+export default { en: EN, cn: CN, tw: TW }[getLang()];
--- a/app/locales/tw.ts
+++ b/app/locales/tw.ts
@@ -0,0 +1,148 @@
+import { SubmitKey } from "../store/app";
+import type { LocaleType } from "./index";
+
+const tw: LocaleType = {
+  WIP: "該功能仍在開發中……",
+  Error: {
+    Unauthorized: "目前您的狀態是未授權，請前往設定頁面填寫授權碼。",
+  },
+  ChatItem: {
+    ChatItemCount: (count: number) => `${count} 條對話`,
+  },
+  Chat: {
+    SubTitle: (count: number) => `您已經與 ChatGPT 進行了 ${count} 條對話`,
+    Actions: {
+      ChatList: "查看消息列表",
+      CompressedHistory: "查看壓縮後的歷史 Prompt",
+      Export: "匯出聊天紀錄",
+      Copy: "複製",
+      Stop: "停止",
+      Retry: "重試",
+    },
+    Rename: "重命名對話",
+    Typing: "正在輸入…",
+    Input: (submitKey: string) => {
+      var inputHints = `輸入訊息後，按下 ${submitKey} 鍵即可發送`;
+      if (submitKey === String(SubmitKey.Enter)) {
+        inputHints += "，Shift + Enter 鍵換行";
+      }
+      return inputHints;
+    },
+    Send: "發送",
+  },
+  Export: {
+    Title: "匯出聊天記錄為 Markdown",
+    Copy: "複製全部",
+    Download: "下載檔案",
+  },
+  Memory: {
+    Title: "上下文記憶 Prompt",
+    EmptyContent: "尚未記憶",
+    Copy: "複製全部",
+  },
+  Home: {
+    NewChat: "新的對話",
+    DeleteChat: "確定要刪除選取的對話嗎？",
+  },
+  Settings: {
+    Title: "設定",
+    SubTitle: "設定選項",
+    Actions: {
+      ClearAll: "清除所有數據",
+      ResetAll: "重置所有設定",
+      Close: "關閉",
+    },
+    Lang: {
+      Name: "語言",
+      Options: {
+        cn: "简体中文",
+        en: "English",
+        tw: "繁體中文",
+      },
+    },
+    Avatar: "大頭貼",
+    FontSize: {
+      Title: "字型大小",
+      SubTitle: "聊天內容的字型大小",
+    },
+    Update: {
+      Version: (x: string) => `當前版本：${x}`,
+      IsLatest: "已是最新版本",
+      CheckUpdate: "檢查更新",
+      IsChecking: "正在檢查更新...",
+      FoundUpdate: (x: string) => `發現新版本：${x}`,
+      GoToUpdate: "前往更新",
+    },
+    SendKey: "發送鍵",
+    Theme: "主題",
+    TightBorder: "緊湊邊框",
+    Prompt: {
+      Disable: {
+        Title: "停用提示詞自動補全",
+        SubTitle: "在輸入框開頭輸入 / 即可觸發自動補全",
+      },
+      List: "自定義提示詞列表",
+      ListCount: (builtin: number, custom: number) =>
+        `內置 ${builtin} 條，用戶定義 ${custom} 條`,
+      Edit: "編輯",
+    },
+    HistoryCount: {
+      Title: "附帶歷史訊息數",
+      SubTitle: "每次請求附帶的歷史訊息數",
+    },
+    CompressThreshold: {
+      Title: "歷史訊息長度壓縮閾值",
+      SubTitle: "當未壓縮的歷史訊息超過該值時，將進行壓縮",
+    },
+    Token: {
+      Title: "API Key",
+      SubTitle: "使用自己的 Key 可規避受控訪問限制",
+      Placeholder: "OpenAI API Key",
+    },
+    Usage: {
+      Title: "帳戶餘額",
+      SubTitle(granted: any, used: any) {
+        return `總共 $${granted}，已使用 $${used}`;
+      },
+      IsChecking: "正在檢查…",
+      Check: "重新檢查",
+    },
+    AccessCode: {
+      Title: "訪問碼",
+      SubTitle: "現在是受控訪問狀態",
+      Placeholder: "請輸入訪問碼",
+    },
+    Model: "模型 (model)",
+    Temperature: {
+      Title: "隨機性 (temperature)",
+      SubTitle: "值越大，回復越隨機",
+    },
+    MaxTokens: {
+      Title: "單次回復限制 (max_tokens)",
+      SubTitle: "單次交互所用的最大 Token 數",
+    },
+    PresencePenlty: {
+      Title: "話題新穎度 (presence_penalty)",
+      SubTitle: "值越大，越有可能擴展到新話題",
+    },
+  },
+  Store: {
+    DefaultTopic: "新的對話",
+    BotHello: "請問需要我的協助嗎？",
+    Error: "出錯了，請稍後再嘗試",
+    Prompt: {
+      History: (content: string) =>
+        "這是 AI 與用戶的歷史聊天總結，作為前情提要：" + content,
+      Topic: "直接返回這句話的簡要主題，無須解釋，若無主題，請直接返回「閒聊」",
+      Summarize:
+        "簡要總結一下你和用戶的對話，作為後續的上下文提示 prompt，且字數控制在 50 字以內",
+    },
+    ConfirmClearAll: "確認清除所有對話、設定數據？",
+  },
+  Copy: {
+    Success: "已複製到剪貼簿中",
+    Failed: "複製失敗，請賦予剪貼簿權限",
+  },
+};
+
+export default tw;
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,5 +1,5 @@
 import { Analytics } from "@vercel/analytics/react";
-import { Home } from './components/home'
+import { Home } from "./components/home";

 export default function App() {
  return (
--- a/app/requests.ts
+++ b/app/requests.ts
@@ -1,5 +1,6 @@
-import type { ChatRequest, ChatReponse } from "./api/chat/typing";
-import { filterConfig, isValidModel, Message, ModelConfig } from "./store";
+import type { ChatRequest, ChatReponse } from "./api/openai/typing";
+import { filterConfig, Message, ModelConfig, useAccessStore } from "./store";
+import Locale from "./locales";

 const TIME_OUT_MS = 30000;

@@ -8,7 +9,7 @@ const makeRequestParam = (
  options?: {
    filterBot?: boolean;
    stream?: boolean;
-  }
+  },
 ): ChatRequest => {
  let sendMessages = messages.map((v) => ({
    role: v.role,
@@ -26,18 +27,63 @@ const makeRequestParam = (
  };
 };

+function getHeaders() {
+  const accessStore = useAccessStore.getState();
+  let headers: Record<string, string> = {};
+
+  if (accessStore.enabledAccessControl()) {
+    headers["access-code"] = accessStore.accessCode;
+  }
+
+  if (accessStore.token && accessStore.token.length > 0) {
+    headers["token"] = accessStore.token;
+  }
+
+  return headers;
+}
+
+export function requestOpenaiClient(path: string) {
+  return (body: any, method = "POST") =>
+    fetch("/api/openai", {
+      method,
+      headers: {
+        "Content-Type": "application/json",
+        path,
+        ...getHeaders(),
+      },
+      body: body && JSON.stringify(body),
+    });
+}
+
 export async function requestChat(messages: Message[]) {
  const req: ChatRequest = makeRequestParam(messages, { filterBot: true });

-  const res = await fetch("/api/chat", {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-    },
-    body: JSON.stringify(req),
-  });
+  const res = await requestOpenaiClient("v1/chat/completions")(req);

-  return (await res.json()) as ChatReponse;
+  try {
+    const response = (await res.json()) as ChatReponse;
+    return response;
+  } catch (error) {
+    console.error("[Request Chat] ", error, res.body);
+  }
+}
+
+export async function requestUsage() {
+  const res = await requestOpenaiClient("dashboard/billing/credit_grants")(
+    null,
+    "GET",
+  );
+
+  try {
+    const response = (await res.json()) as {
+      total_available: number;
+      total_granted: number;
+      total_used: number;
+    };
+    return response;
+  } catch (error) {
+    console.error("[Request usage] ", error, res.body);
+  }
 }

 export async function requestChatStream(
@@ -47,7 +93,8 @@ export async function requestChatStream(
    modelConfig?: ModelConfig;
    onMessage: (message: string, done: boolean) => void;
    onError: (error: Error) => void;
-  }
+    onController?: (controller: AbortController) => void;
+  },
 ) {
  const req = makeRequestParam(messages, {
    stream: true,
@@ -69,6 +116,8 @@ export async function requestChatStream(
      method: "POST",
      headers: {
        "Content-Type": "application/json",
+        path: "v1/chat/completions",
+        ...getHeaders(),
      },
      body: JSON.stringify(req),
      signal: controller.signal,
@@ -86,6 +135,8 @@ export async function requestChatStream(
      const reader = res.body?.getReader();
      const decoder = new TextDecoder();

+      options?.onController?.(controller);
+
      while (true) {
        // handle time out, will stop if no response in 10 secs
        const resTimeoutId = setTimeout(() => finish(), TIME_OUT_MS);
@@ -102,14 +153,18 @@ export async function requestChatStream(
        }
      }

+      finish();
+    } else if (res.status === 401) {
+      console.error("Anauthorized");
+      responseText = Locale.Error.Unauthorized;
      finish();
    } else {
-      console.error("Stream Error");
+      console.error("Stream Error", res.body);
      options?.onError(new Error("Stream Error"));
    }
  } catch (err) {
-    console.error("NetWork Error");
-    options?.onError(new Error("NetWork Error"));
+    console.error("NetWork Error", err);
+    options?.onError(err as Error);
  }
 }

@@ -124,5 +179,36 @@ export async function requestWithPrompt(messages: Message[], prompt: string) {

  const res = await requestChat(messages);

-  return res.choices.at(0)?.message?.content ?? "";
+  return res?.choices?.at(0)?.message?.content ?? "";
 }
+
+// To store message streaming controller
+export const ControllerPool = {
+  controllers: {} as Record<string, AbortController>,
+
+  addController(
+    sessionIndex: number,
+    messageIndex: number,
+    controller: AbortController,
+  ) {
+    const key = this.key(sessionIndex, messageIndex);
+    this.controllers[key] = controller;
+    return key;
+  },
+
+  stop(sessionIndex: number, messageIndex: number) {
+    const key = this.key(sessionIndex, messageIndex);
+    const controller = this.controllers[key];
+    console.log(controller);
+    controller?.abort();
+  },
+
+  remove(sessionIndex: number, messageIndex: number) {
+    const key = this.key(sessionIndex, messageIndex);
+    delete this.controllers[key];
+  },
+
+  key(sessionIndex: number, messageIndex: number) {
+    return `${sessionIndex},${messageIndex}`;
+  },
+};
--- a/app/store/access.ts
+++ b/app/store/access.ts
@@ -0,0 +1,36 @@
+import { create } from "zustand";
+import { persist } from "zustand/middleware";
+import { queryMeta } from "../utils";
+
+export interface AccessControlStore {
+  accessCode: string;
+  token: string;
+
+  updateToken: (_: string) => void;
+  updateCode: (_: string) => void;
+  enabledAccessControl: () => boolean;
+}
+
+export const ACCESS_KEY = "access-control";
+
+export const useAccessStore = create<AccessControlStore>()(
+  persist(
+    (set, get) => ({
+      token: "",
+      accessCode: "",
+      enabledAccessControl() {
+        return queryMeta("access") === "enabled";
+      },
+      updateCode(code: string) {
+        set((state) => ({ accessCode: code }));
+      },
+      updateToken(token: string) {
+        set((state) => ({ token }));
+      },
+    }),
+    {
+      name: ACCESS_KEY,
+      version: 1,
+    }
+  )
+);
--- a/app/store/app.ts
+++ b/app/store/app.ts
@@ -2,10 +2,14 @@ import { create } from "zustand";
 import { persist } from "zustand/middleware";

 import { type ChatCompletionResponseMessage } from "openai";
-import { requestChatStream, requestWithPrompt } from "./requests";
-import { trimTopic } from "./utils";
+import {
+  ControllerPool,
+  requestChatStream,
+  requestWithPrompt,
+} from "../requests";
+import { trimTopic } from "../utils";

-import Locale from "./locales";
+import Locale from "../locales";

 export type Message = ChatCompletionResponseMessage & {
  date: string;
@@ -17,6 +21,7 @@ export enum SubmitKey {
  CtrlEnter = "Ctrl + Enter",
  ShiftEnter = "Shift + Enter",
  AltEnter = "Alt + Enter",
+  MetaEnter = "Meta + Enter",
 }

 export enum Theme {
@@ -26,15 +31,17 @@ 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;

+  disablePromptHint: boolean;
+
  modelConfig: {
    model: string;
    temperature: number;
@@ -45,22 +52,24 @@ export interface ChatConfig {

 export type ModelConfig = ChatConfig["modelConfig"];

+const ENABLE_GPT4 = true;
+
 export const ALL_MODELS = [
  {
    name: "gpt-4",
-    available: false,
+    available: ENABLE_GPT4,
  },
  {
    name: "gpt-4-0314",
-    available: false,
+    available: ENABLE_GPT4,
  },
  {
    name: "gpt-4-32k",
-    available: false,
+    available: ENABLE_GPT4,
  },
  {
    name: "gpt-4-32k-0314",
-    available: false,
+    available: ENABLE_GPT4,
  },
  {
    name: "gpt-3.5-turbo",
@@ -114,9 +123,12 @@ const DEFAULT_CONFIG: ChatConfig = {
  sendBotMessages: true as boolean,
  submitKey: SubmitKey.CtrlEnter as SubmitKey,
  avatar: "1f603",
+  fontSize: 14,
  theme: Theme.Auto as Theme,
  tightBorder: false,

+  disablePromptHint: false,
+
  modelConfig: {
    model: "gpt-3.5-turbo",
    temperature: 1,
@@ -183,7 +195,7 @@ interface ChatStore {
  updateMessage: (
    sessionIndex: number,
    messageIndex: number,
-    updater: (message?: Message) => void
+    updater: (message?: Message) => void,
  ) => void;
  getMessagesWithMemory: () => Message[];
  getMemoryPrompt: () => Message;
@@ -194,6 +206,10 @@ interface ChatStore {
  clearAllData: () => void;
 }

+function countMessages(msgs: Message[]) {
+  return msgs.reduce((pre, cur) => pre + cur.content.length, 0);
+}
+
 const LOCAL_KEY = "chat-next-web-store";

 export const useChatStore = create<ChatStore>()(
@@ -296,6 +312,8 @@ export const useChatStore = create<ChatStore>()(
        // get recent messages
        const recentMessages = get().getMessagesWithMemory();
        const sendMessages = recentMessages.concat(userMessage);
+        const sessionIndex = get().currentSessionIndex;
+        const messageIndex = get().currentSession().messages.length + 1;

        // save user's and bot's message
        get().updateCurrentSession((session) => {
@@ -303,12 +321,16 @@ export const useChatStore = create<ChatStore>()(
          session.messages.push(botMessage);
        });

+        // make request
        console.log("[User Input] ", sendMessages);
        requestChatStream(sendMessages, {
          onMessage(content, done) {
+            // stream response
            if (done) {
              botMessage.streaming = false;
+              botMessage.content = content;
              get().onNewMessage(botMessage);
+              ControllerPool.remove(sessionIndex, messageIndex);
            } else {
              botMessage.content = content;
              set(() => ({}));
@@ -318,6 +340,15 @@ export const useChatStore = create<ChatStore>()(
            botMessage.content += "\n\n" + Locale.Store.Error;
            botMessage.streaming = false;
            set(() => ({}));
+            ControllerPool.remove(sessionIndex, messageIndex);
+          },
+          onController(controller) {
+            // collect controller for stop/retry
+            ControllerPool.addController(
+              sessionIndex,
+              messageIndex,
+              controller,
+            );
          },
          filterBot: !get().config.sendBotMessages,
          modelConfig: get().config.modelConfig,
@@ -339,7 +370,7 @@ export const useChatStore = create<ChatStore>()(
        const config = get().config;
        const n = session.messages.length;
        const recentMessages = session.messages.slice(
-          n - config.historyMessageCount
+          n - config.historyMessageCount,
        );

        const memoryPrompt = get().getMemoryPrompt();
@@ -354,7 +385,7 @@ export const useChatStore = create<ChatStore>()(
      updateMessage(
        sessionIndex: number,
        messageIndex: number,
-        updater: (message?: Message) => void
+        updater: (message?: Message) => void,
      ) {
        const sessions = get().sessions;
        const session = sessions.at(sessionIndex);
@@ -366,29 +397,30 @@ export const useChatStore = create<ChatStore>()(
      summarizeSession() {
        const session = get().currentSession();

-        if (session.topic === DEFAULT_TOPIC && session.messages.length >= 3) {
-          // should summarize topic
+        // should summarize topic after chating more than 50 words
+        const SUMMARIZE_MIN_LEN = 50;
+        if (
+          session.topic === DEFAULT_TOPIC &&
+          countMessages(session.messages) >= SUMMARIZE_MIN_LEN
+        ) {
          requestWithPrompt(session.messages, Locale.Store.Prompt.Topic).then(
            (res) => {
              get().updateCurrentSession(
-                (session) => (session.topic = trimTopic(res))
+                (session) => (session.topic = trimTopic(res)),
              );
-            }
+            },
          );
        }

        const config = get().config;
        let toBeSummarizedMsgs = session.messages.slice(
-          session.lastSummarizeIndex
-        );
-        const historyMsgLength = toBeSummarizedMsgs.reduce(
-          (pre, cur) => pre + cur.content.length,
-          0
+          session.lastSummarizeIndex,
        );
+        const historyMsgLength = countMessages(toBeSummarizedMsgs);

        if (historyMsgLength > 4000) {
          toBeSummarizedMsgs = toBeSummarizedMsgs.slice(
-            -config.historyMessageCount
+            -config.historyMessageCount,
          );
        }

@@ -401,7 +433,7 @@ export const useChatStore = create<ChatStore>()(
          "[Chat History] ",
          toBeSummarizedMsgs,
          historyMsgLength,
-          config.compressMessageLengthThreshold
+          config.compressMessageLengthThreshold,
        );

        if (historyMsgLength > config.compressMessageLengthThreshold) {
@@ -423,7 +455,7 @@ export const useChatStore = create<ChatStore>()(
              onError(error) {
                console.error("[Summarize] ", error);
              },
-            }
+            },
          );
        }
      },
@@ -452,6 +484,6 @@ export const useChatStore = create<ChatStore>()(
    {
      name: LOCAL_KEY,
      version: 1,
-    }
-  )
+    },
+  ),
 );
--- a/app/store/index.ts
+++ b/app/store/index.ts
@@ -0,0 +1,3 @@
+export * from "./app";
+export * from "./update";
+export * from "./access";
--- a/app/store/prompt.ts
+++ b/app/store/prompt.ts
@@ -0,0 +1,117 @@
+import { create } from "zustand";
+import { persist } from "zustand/middleware";
+import Fuse from "fuse.js";
+
+export interface Prompt {
+  id?: number;
+  title: string;
+  content: string;
+}
+
+export interface PromptStore {
+  latestId: number;
+  prompts: Map<number, Prompt>;
+
+  add: (prompt: Prompt) => number;
+  remove: (id: number) => void;
+  search: (text: string) => Prompt[];
+}
+
+export const PROMPT_KEY = "prompt-store";
+
+export const SearchService = {
+  ready: false,
+  engine: new Fuse<Prompt>([], { keys: ["title"] }),
+  count: {
+    builtin: 0,
+  },
+
+  init(prompts: Prompt[]) {
+    if (this.ready) {
+      return;
+    }
+    this.engine.setCollection(prompts);
+    this.ready = true;
+  },
+
+  remove(id: number) {
+    this.engine.remove((doc) => doc.id === id);
+  },
+
+  add(prompt: Prompt) {
+    this.engine.add(prompt);
+  },
+
+  search(text: string) {
+    const results = this.engine.search(text);
+    return results.map((v) => v.item);
+  },
+};
+
+export const usePromptStore = create<PromptStore>()(
+  persist(
+    (set, get) => ({
+      latestId: 0,
+      prompts: new Map(),
+
+      add(prompt) {
+        const prompts = get().prompts;
+        prompt.id = get().latestId + 1;
+        prompts.set(prompt.id, prompt);
+
+        set(() => ({
+          latestId: prompt.id!,
+          prompts: prompts,
+        }));
+
+        return prompt.id!;
+      },
+
+      remove(id) {
+        const prompts = get().prompts;
+        prompts.delete(id);
+        SearchService.remove(id);
+
+        set(() => ({
+          prompts,
+        }));
+      },
+
+      search(text) {
+        return SearchService.search(text) as Prompt[];
+      },
+    }),
+    {
+      name: PROMPT_KEY,
+      version: 1,
+      onRehydrateStorage(state) {
+        const PROMPT_URL = "./prompts.json";
+
+        type PromptList = Array<[string, string]>;
+
+        fetch(PROMPT_URL)
+          .then((res) => res.json())
+          .then((res) => {
+            const builtinPrompts = [res.en, res.cn]
+              .map((promptList: PromptList) => {
+                return promptList.map(
+                  ([title, content]) =>
+                    ({
+                      title,
+                      content,
+                    } as Prompt)
+                );
+              })
+              .concat([...(state?.prompts?.values() ?? [])]);
+
+            const allPromptsForSearch = builtinPrompts.reduce(
+              (pre, cur) => pre.concat(cur),
+              []
+            );
+            SearchService.count.builtin = res.en.length + res.cn.length;
+            SearchService.init(allPromptsForSearch);
+          });
+      },
+    }
+  )
+);
--- a/app/store/update.ts
+++ b/app/store/update.ts
@@ -0,0 +1,49 @@
+import { create } from "zustand";
+import { persist } from "zustand/middleware";
+import { FETCH_COMMIT_URL } from "../constant";
+import { getCurrentCommitId } from "../utils";
+
+export interface UpdateStore {
+  lastUpdate: number;
+  remoteId: string;
+
+  getLatestCommitId: (force: boolean) => Promise<string>;
+}
+
+export const UPDATE_KEY = "chat-update";
+
+export const useUpdateStore = create<UpdateStore>()(
+  persist(
+    (set, get) => ({
+      lastUpdate: 0,
+      remoteId: "",
+
+      async getLatestCommitId(force = false) {
+        const overOneHour = Date.now() - get().lastUpdate > 3600 * 1000;
+        const shouldFetch = force || overOneHour;
+        if (!shouldFetch) {
+          return getCurrentCommitId();
+        }
+
+        try {
+          const data = await (await fetch(FETCH_COMMIT_URL)).json();
+          const sha = data[0].sha as string;
+          const remoteId = sha.substring(0, 7);
+          set(() => ({
+            lastUpdate: Date.now(),
+            remoteId,
+          }));
+          console.log("[Got Upstream] ", remoteId);
+          return remoteId;
+        } catch (error) {
+          console.error("[Fetch Upstream Commit Id]", error);
+          return getCurrentCommitId();
+        }
+      },
+    }),
+    {
+      name: UPDATE_KEY,
+      version: 1,
+    }
+  )
+);
--- a/app/styles/globals.scss
+++ b/app/styles/globals.scss
@@ -7,6 +7,7 @@
  --second: rgb(231, 248, 255);
  --hover-color: #f3f3f3;
  --bar-color: rgba(0, 0, 0, 0.1);
+  --theme-color: var(--gray);

  /* shadow */
  --shadow: 50px 50px 100px 10px rgb(0, 0, 0, 0.1);
@@ -28,6 +29,8 @@
  --bar-color: rgba(255, 255, 255, 0.1);

  --border-in-light: 1px solid rgba(255, 255, 255, 0.192);
+
+  --theme-color: var(--gray);
 }

 .light {
@@ -83,6 +86,12 @@ body {
  justify-content: center;
  align-items: center;
  user-select: none;
+  font-family: "Noto Sans SC", "SF Pro SC", "SF Pro Text", "SF Pro Icons",
+  "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+
+  @media only screen and (max-width: 600px) {
+    background-color: var(--second);
+  }
 }

 ::-webkit-scrollbar {
@@ -165,7 +174,8 @@ input[type="range"]::-webkit-slider-thumb:hover {
  width: 24px;
 }

-input[type="number"] {
+input[type="number"],
+input[type="text"] {
  appearance: none;
  border-radius: 10px;
  border: var(--border-in-light);
@@ -174,6 +184,7 @@ input[type="number"] {
  background: var(--white);
  color: var(--black);
  padding: 0 10px;
+  max-width: 50%;
 }

 div.math {
@@ -192,3 +203,46 @@ div.math {
  align-items: center;
  justify-content: center;
 }
+
+.link {
+  font-size: 12px;
+  color: var(--primary);
+  text-decoration: none;
+
+  &:hover {
+    text-decoration: underline;
+  }
+}
+
+pre {
+  position: relative;
+
+  &:hover .copy-code-button {
+    pointer-events: all;
+    transform: translateX(0px);
+    opacity: 0.5;
+  }
+
+  .copy-code-button {
+    position: absolute;
+    right: 10px;
+    cursor: pointer;
+    padding: 0px 5px;
+    background-color: var(--black);
+    color: var(--white);
+    border: var(--border-in-light);
+    border-radius: 10px;
+    transform: translateX(10px);
+    pointer-events: none;
+    opacity: 0;
+    transition: all ease 0.3s;
+
+    &:after {
+      content: "copy";
+    }
+
+    &:hover {
+      opacity: 1;
+    }
+  }
+}
--- a/app/styles/markdown.scss
+++ b/app/styles/markdown.scss
@@ -96,8 +96,6 @@
  margin: 0;
  color: var(--color-fg-default);
  background-color: var(--color-canvas-default);
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans",
-    Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  font-size: 14px;
  line-height: 1.5;
  word-wrap: break-word;
@@ -319,7 +317,7 @@
  cursor: pointer;
 }

-.markdown-body details:not([open])>*:not(summary) {
+.markdown-body details:not([open]) > *:not(summary) {
  display: none !important;
 }

@@ -489,11 +487,11 @@
  content: "";
 }

-.markdown-body>*:first-child {
+.markdown-body > *:first-child {
  margin-top: 0 !important;
 }

-.markdown-body>*:last-child {
+.markdown-body > *:last-child {
  margin-bottom: 0 !important;
 }

@@ -529,11 +527,11 @@
  margin-bottom: 16px;
 }

-.markdown-body blockquote> :first-child {
+.markdown-body blockquote > :first-child {
  margin-top: 0;
 }

-.markdown-body blockquote> :last-child {
+.markdown-body blockquote > :last-child {
  margin-bottom: 0;
 }

@@ -632,7 +630,7 @@
  list-style-type: decimal;
 }

-.markdown-body div>ol:not([type]) {
+.markdown-body div > ol:not([type]) {
  list-style-type: decimal;
 }

@@ -644,11 +642,11 @@
  margin-bottom: 0;
 }

-.markdown-body li>p {
+.markdown-body li > p {
  margin-top: 16px;
 }

-.markdown-body li+li {
+.markdown-body li + li {
  margin-top: 0.25em;
 }

@@ -711,7 +709,7 @@
  overflow: hidden;
 }

-.markdown-body span.frame>span {
+.markdown-body span.frame > span {
  display: block;
  float: left;
  width: auto;
@@ -739,7 +737,7 @@
  clear: both;
 }

-.markdown-body span.align-center>span {
+.markdown-body span.align-center > span {
  display: block;
  margin: 13px auto 0;
  overflow: hidden;
@@ -757,7 +755,7 @@
  clear: both;
 }

-.markdown-body span.align-right>span {
+.markdown-body span.align-right > span {
  display: block;
  margin: 13px 0 0;
  overflow: hidden;
@@ -787,7 +785,7 @@
  overflow: hidden;
 }

-.markdown-body span.float-right>span {
+.markdown-body span.float-right > span {
  display: block;
  margin: 13px auto 0;
  overflow: hidden;
@@ -821,7 +819,7 @@
  font-size: 100%;
 }

-.markdown-body pre>code {
+.markdown-body pre > code {
  padding: 0;
  margin: 0;
  word-break: normal;
@@ -841,21 +839,20 @@

 .markdown-body .highlight pre,
 .markdown-body pre {
-  padding: 16px;
+  padding: 16px 16px 8px 16px;
  overflow: auto;
  font-size: 85%;
  line-height: 1.45;
-  background-color: var(--color-canvas-subtle);
  border-radius: 6px;
 }

 .markdown-body pre code,
 .markdown-body pre tt {
-  display: inline;
-  max-width: auto;
+  display: inline-block;
+  max-width: 100%;
  padding: 0;
  margin: 0;
-  overflow: visible;
+  overflow-x: scroll;
  line-height: inherit;
  word-wrap: normal;
  background-color: transparent;
@@ -1085,7 +1082,7 @@
  cursor: pointer;
 }

-.markdown-body .task-list-item+.task-list-item {
+.markdown-body .task-list-item + .task-list-item {
  margin-top: 4px;
 }

@@ -1107,7 +1104,9 @@
 }

 .markdown-body .contains-task-list:hover .task-list-item-convert-container,
-.markdown-body .contains-task-list:focus-within .task-list-item-convert-container {
+.markdown-body
+  .contains-task-list:focus-within
+  .task-list-item-convert-container {
  display: block;
  width: auto;
  height: 24px;
--- a/app/styles/prism.scss
+++ b/app/styles/prism.scss
@@ -1,9 +1,15 @@
-code[class*="language-"],
-pre[class*="language-"] {
+.markdown-body {
+  pre {
+    background: #282a36;
+    color: #f8f8f2;
+  }
+
+  code[class*="language-"],
+  pre[class*="language-"] {
    color: #f8f8f2;
    background: none;
    text-shadow: 0 1px rgba(0, 0, 0, 0.3);
-    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+    font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
    text-align: left;
    white-space: pre;
    word-spacing: normal;
@@ -17,131 +23,130 @@ pre[class*="language-"] {
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
-}
+  }

-/* Code blocks */
-pre[class*="language-"] {
+  /* Code blocks */
+  pre[class*="language-"] {
    padding: 1em;
-    margin: .5em 0;
+    margin: 0.5em 0;
    overflow: auto;
    border-radius: 0.3em;
-}
+  }

-:not(pre)>code[class*="language-"],
-pre[class*="language-"] {
+  :not(pre) > code[class*="language-"],
+  pre[class*="language-"] {
    background: #282a36;
-}
+  }

-/* Inline code */
-:not(pre)>code[class*="language-"] {
-    padding: .1em;
-    border-radius: .3em;
+  /* Inline code */
+  :not(pre) > code[class*="language-"] {
+    padding: 0.1em;
+    border-radius: 0.3em;
    white-space: normal;
-}
+  }

-.token.comment,
-.token.prolog,
-.token.doctype,
-.token.cdata {
+  .token.comment,
+  .token.prolog,
+  .token.doctype,
+  .token.cdata {
    color: #6272a4;
-}
+  }

-.token.punctuation {
+  .token.punctuation {
    color: #f8f8f2;
-}
+  }

-.namespace {
-    opacity: .7;
-}
+  .namespace {
+    opacity: 0.7;
+  }

-.token.property,
-.token.tag,
-.token.constant,
-.token.symbol,
-.token.deleted {
+  .token.property,
+  .token.tag,
+  .token.constant,
+  .token.symbol,
+  .token.deleted {
    color: #ff79c6;
-}
+  }

-.token.boolean,
-.token.number {
+  .token.boolean,
+  .token.number {
    color: #bd93f9;
-}
+  }

-.token.selector,
-.token.attr-name,
-.token.string,
-.token.char,
-.token.builtin,
-.token.inserted {
+  .token.selector,
+  .token.attr-name,
+  .token.string,
+  .token.char,
+  .token.builtin,
+  .token.inserted {
    color: #50fa7b;
-}
+  }

-.token.operator,
-.token.entity,
-.token.url,
-.language-css .token.string,
-.style .token.string,
-.token.variable {
+  .token.operator,
+  .token.entity,
+  .token.url,
+  .language-css .token.string,
+  .style .token.string,
+  .token.variable {
    color: #f8f8f2;
-}
+  }

-.token.atrule,
-.token.attr-value,
-.token.function,
-.token.class-name {
+  .token.atrule,
+  .token.attr-value,
+  .token.function,
+  .token.class-name {
    color: #f1fa8c;
-}
+  }

-.token.keyword {
+  .token.keyword {
    color: #8be9fd;
-}
+  }

-.token.regex,
-.token.important {
+  .token.regex,
+  .token.important {
    color: #ffb86c;
-}
+  }

-.token.important,
-.token.bold {
+  .token.important,
+  .token.bold {
    font-weight: bold;
-}
+  }

-.token.italic {
+  .token.italic {
    font-style: italic;
-}
+  }

-.token.entity {
+  .token.entity {
    cursor: help;
+  }
 }

@mixin light {
-    .markdown-body pre {
-        filter: invert(1) hue-rotate(50deg) brightness(1.3);
-    }
+  .markdown-body pre {
+    filter: invert(1) hue-rotate(90deg) brightness(1.3);
+  }
 }

@mixin dark {
-    .markdown-body pre {
-        filter: none;
-    }
+  .markdown-body pre {
+    filter: none;
+  }
 }

-
 :root {
-    @include light();
+  @include light();
 }

 .light {
-    @include light();
+  @include light();
 }

 .dark {
-    @include dark();
+  @include dark();
 }

-
@media (prefers-color-scheme: dark) {
-    :root {
-        @include dark();
-    }
-}
+  :root {
+    @include dark();
+  }
+}
--- a/app/utils.ts
+++ b/app/utils.ts
@@ -4,7 +4,7 @@ import Locale from "./locales";
 export function trimTopic(topic: string) {
  const s = topic.split("");
  let lastChar = s.at(-1); // 获取 s 的最后一个字符
-  let pattern = /[，。！？、]/; // 定义匹配中文标点符号的正则表达式
+  let pattern = /[，。！？、,.!?]/; // 定义匹配中文和英文标点符号的正则表达式
  while (lastChar && pattern.test(lastChar!)) {
    s.pop();
    lastChar = s.at(-1);
@@ -28,7 +28,7 @@ export function downloadAs(text: string, filename: string) {
  const element = document.createElement("a");
  element.setAttribute(
    "href",
-    "data:text/plain;charset=utf-8," + encodeURIComponent(text)
+    "data:text/plain;charset=utf-8," + encodeURIComponent(text),
  );
  element.setAttribute("download", filename);

@@ -56,3 +56,28 @@ export function selectOrCopy(el: HTMLElement, content: string) {

  return true;
 }
+
+export function queryMeta(key: string, defaultValue?: string): string {
+  let ret: string;
+  if (document) {
+    const meta = document.head.querySelector(
+      `meta[name='${key}']`,
+    ) as HTMLMetaElement;
+    ret = meta?.content ?? "";
+  } else {
+    ret = defaultValue ?? "";
+  }
+
+  return ret;
+}
+
+let currentId: string;
+export function getCurrentCommitId() {
+  if (currentId) {
+    return currentId;
+  }
+
+  currentId = queryMeta("version");
+
+  return currentId;
+}
--- a/middleware.ts
+++ b/middleware.ts
@@ -0,0 +1,57 @@
+import { NextRequest, NextResponse } from "next/server";
+import { ACCESS_CODES } from "./app/api/access";
+import md5 from "spark-md5";
+
+export const config = {
+  matcher: ["/api/openai", "/api/chat-stream"],
+};
+
+export function middleware(req: NextRequest) {
+  const accessCode = req.headers.get("access-code");
+  const token = req.headers.get("token");
+  const hashedCode = md5.hash(accessCode ?? "").trim();
+
+  console.log("[Auth] allowed hashed codes: ", [...ACCESS_CODES]);
+  console.log("[Auth] got access code:", accessCode);
+  console.log("[Auth] hashed access code:", hashedCode);
+
+  if (ACCESS_CODES.size > 0 && !ACCESS_CODES.has(hashedCode) && !token) {
+    return NextResponse.json(
+      {
+        error: true,
+        needAccessCode: true,
+        msg: "Please go settings page and fill your access code.",
+      },
+      {
+        status: 401,
+      },
+    );
+  }
+
+  // inject api key
+  if (!token) {
+    const apiKey = process.env.OPENAI_API_KEY;
+    if (apiKey) {
+      console.log("[Auth] set system token");
+      req.headers.set("token", apiKey);
+    } else {
+      return NextResponse.json(
+        {
+          error: true,
+          msg: "Empty Api Key",
+        },
+        {
+          status: 401,
+        },
+      );
+    }
+  } else {
+    console.log("[Auth] set user token");
+  }
+
+  return NextResponse.next({
+    request: {
+      headers: req.headers,
+    },
+  });
+}
--- a/next.config.js
+++ b/next.config.js
@@ -11,7 +11,11 @@ const nextConfig = {
    }); // 针对 SVG 的处理规则

    return config;
-  },
+  }
 };

+if (process.env.DOCKER) {
+  nextConfig.output = 'standalone'
+}
+
 module.exports = nextConfig;
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -1,37 +1,52 @@
 {
  "name": "chatgpt-next-web",
-  "version": "0.1.0",
-  "private": true,
+  "version": "1.1",
+  "private": false,
+  "license": "Anti 996",
  "scripts": {
-    "dev": "next dev",
-    "local:dev": "./dev/proxychains.exe -f ./scripts/proxychains.conf yarn dev",
-    "local:start": "./dev/proxychains.exe -f ./scripts/proxychains.conf yarn start",
-    "build": "next build",
+    "dev": "yarn fetch && next dev",
+    "build": "yarn fetch && next build",
    "start": "next start",
-    "lint": "next lint"
+    "lint": "next lint",
+    "fetch": "node ./scripts/fetch-prompts.mjs",
+    "prepare": "husky install"
  },
  "dependencies": {
    "@svgr/webpack": "^6.5.1",
-    "@types/node": "^18.14.6",
-    "@types/react": "^18.0.28",
-    "@types/react-dom": "^18.0.11",
-    "@types/react-katex": "^3.0.0",
    "@vercel/analytics": "^0.1.11",
    "emoji-picker-react": "^4.4.7",
-    "eslint": "8.35.0",
-    "eslint-config-next": "13.2.3",
    "eventsource-parser": "^0.1.0",
+    "fuse.js": "^6.6.2",
    "next": "^13.2.3",
+    "node-fetch": "^3.3.1",
    "openai": "^3.2.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-markdown": "^8.0.5",
+    "remark-breaks": "^3.0.2",
    "rehype-katex": "^6.0.2",
    "rehype-prism-plus": "^1.5.1",
    "remark-gfm": "^3.0.1",
    "remark-math": "^5.1.1",
    "sass": "^1.59.2",
-    "typescript": "4.9.5",
+    "spark-md5": "^3.0.2",
+    "use-debounce": "^9.0.3",
    "zustand": "^4.3.6"
+  },
+  "devDependencies": {
+    "@types/node": "^18.14.6",
+    "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.0.11",
+    "@types/react-katex": "^3.0.0",
+    "@types/spark-md5": "^3.0.2",
+    "cross-env": "^7.0.3",
+    "eslint": "^8.36.0",
+    "eslint-config-next": "13.2.3",
+    "eslint-config-prettier": "^8.8.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "husky": "^8.0.0",
+    "lint-staged": "^13.2.0",
+    "prettier": "^2.8.7",
+    "typescript": "4.9.5"
  }
 }
--- a/public/android-chrome-192x192.png
+++ b/public/android-chrome-192x192.png
--- a/public/android-chrome-512x512.png
+++ b/public/android-chrome-512x512.png
--- a/public/apple-touch-icon.png
+++ b/public/apple-touch-icon.png
--- a/public/favicon-16x16.png
+++ b/public/favicon-16x16.png
--- a/public/favicon-32x32.png
+++ b/public/favicon-32x32.png
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/robots.txt
+++ b/public/robots.txt
@@ -0,0 +1,4 @@
+User-agent: *
+Disallow: /
+User-agent: vitals.vercel-insights.com
+Allow: /
--- a/public/serviceWorker.js
+++ b/public/serviceWorker.js
@@ -0,0 +1,13 @@
+const CHATGPT_NEXT_WEB_CACHE = "chatgpt-next-web-cache";
+
+self.addEventListener("activate", function (event) {
+  console.log("ServiceWorker activated.");
+});
+
+self.addEventListener("install", function (event) {
+  event.waitUntil(
+    caches.open(CHATGPT_NEXT_WEB_CACHE).then(function (cache) {
+      return cache.addAll([]);
+    }),
+  );
+});
--- a/public/serviceWorkerRegister.js
+++ b/public/serviceWorkerRegister.js
@@ -0,0 +1,9 @@
+if ('serviceWorker' in navigator) {
+  window.addEventListener('load', function () {
+    navigator.serviceWorker.register('/serviceWorker.js').then(function (registration) {
+      console.log('ServiceWorker registration successful with scope: ', registration.scope);
+    }, function (err) {
+      console.error('ServiceWorker registration failed: ', err);
+    });
+  });
+}
--- a/public/site.webmanifest
+++ b/public/site.webmanifest
@@ -1 +1,21 @@
-{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
+{
+    "name": "ChatGPT Next Web",
+    "short_name": "ChatGPT",
+    "icons": [
+      {
+        "src": "/android-chrome-192x192.png",
+        "sizes": "192x192",
+        "type": "image/png"
+      },
+      {
+        "src": "/android-chrome-512x512.png",
+        "sizes": "512x512",
+        "type": "image/png"
+      }
+    ],
+    "start_url": "/",
+    "theme_color": "#ffffff",
+    "background_color": "#ffffff",
+    "display": "standalone"
+  }
+  
--- a/scripts/fetch-prompts.mjs
+++ b/scripts/fetch-prompts.mjs
@@ -0,0 +1,49 @@
+import fetch from "node-fetch";
+import fs from "fs/promises";
+
+const CN_URL =
+  "https://raw.githubusercontent.com/PlexPt/awesome-chatgpt-prompts-zh/main/prompts-zh.json";
+const EN_URL =
+  "https://raw.githubusercontent.com/f/awesome-chatgpt-prompts/main/prompts.csv";
+const FILE = "./public/prompts.json";
+
+async function fetchCN() {
+  console.log("[Fetch] fetching cn prompts...");
+  try {
+    const raw = await (await fetch(CN_URL)).json();
+    return raw.map((v) => [v.act, v.prompt]);
+  } catch (error) {
+    console.error("[Fetch] failed to fetch cn prompts", error);
+    return [];
+  }
+}
+
+async function fetchEN() {
+  console.log("[Fetch] fetching en prompts...");
+  try {
+    const raw = await (await fetch(EN_URL)).text();
+    return raw
+      .split("\n")
+      .slice(1)
+      .map((v) => v.split('","').map((v) => v.replace('"', "")));
+  } catch (error) {
+    console.error("[Fetch] failed to fetch cn prompts", error);
+    return [];
+  }
+}
+
+async function main() {
+  Promise.all([fetchCN(), fetchEN()])
+    .then(([cn, en]) => {
+      fs.writeFile(FILE, JSON.stringify({ cn, en }));
+    })
+    .catch((e) => {
+      console.error("[Fetch] failed to fetch prompts");
+      fs.writeFile(FILE, JSON.stringify({ cn: [], en: [] }));
+    })
+    .finally(() => {
+      console.log("[Fetch] saved to " + FILE);
+    });
+}
+
+main();
--- a/scripts/setup.sh
+++ b/scripts/setup.sh
@@ -0,0 +1,64 @@
+#!/bin/bash
+
+# Check if running on a supported system
+case "$(uname -s)" in
+  Linux)
+    if [[ -f "/etc/lsb-release" ]]; then
+      . /etc/lsb-release
+      if [[ "$DISTRIB_ID" != "Ubuntu" ]]; then
+        echo "This script only works on Ubuntu, not $DISTRIB_ID."
+        exit 1
+      fi
+    else
+      if [[ ! "$(cat /etc/*-release | grep '^ID=')" =~ ^(ID=\"ubuntu\")|(ID=\"centos\")|(ID=\"arch\")$ ]]; then
+        echo "Unsupported Linux distribution."
+        exit 1
+      fi
+    fi
+    ;;
+  Darwin)
+    echo "Running on MacOS."
+    ;;
+  *)
+    echo "Unsupported operating system."
+    exit 1
+    ;;
+esac
+
+# Check if needed dependencies are installed and install if necessary
+if ! command -v node >/dev/null || ! command -v git >/dev/null || ! command -v yarn >/dev/null; then
+  case "$(uname -s)" in
+    Linux)
+      if [[ "$(cat /etc/*-release | grep '^ID=')" = "ID=\"ubuntu\"" ]]; then
+        sudo apt-get update
+        sudo apt-get -y install nodejs git yarn
+      elif [[ "$(cat /etc/*-release | grep '^ID=')" = "ID=\"centos\"" ]]; then
+        sudo yum -y install epel-release
+        sudo yum -y install nodejs git yarn
+      elif [[ "$(cat /etc/*-release | grep '^ID=')" = "ID=\"arch\"" ]]; then
+        sudo pacman -Syu -y
+        sudo pacman -S -y nodejs git yarn
+      else
+        echo "Unsupported Linux distribution"
+        exit 1
+      fi
+      ;;
+    Darwin)
+      /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
+      brew install node git yarn
+      ;;
+  esac
+fi
+
+# Clone the repository and install dependencies
+git clone https://github.com/Yidadaa/ChatGPT-Next-Web
+cd ChatGPT-Next-Web
+yarn install
+
+# Prompt user for environment variables
+read -p "Enter OPENAI_API_KEY: " OPENAI_API_KEY
+read -p "Enter CODE: " CODE
+read -p "Enter PORT: " PORT
+
+# Build and run the project using the environment variables
+OPENAI_API_KEY=$OPENAI_API_KEY CODE=$CODE PORT=$PORT yarn build && OPENAI_API_KEY=$OPENAI_API_KEY CODE=$CODE PORT=$PORT yarn start
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,6 +1,6 @@
 {
  "compilerOptions": {
-    "target": "es5",
+    "target": "ES2015",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
--- a/yarn.lock
+++ b/yarn.lock
Author	SHA1	Message	Date
Yifei Zhang	9eb77207fb	Merge pull request #226 from jack0pan/fix/deps fix: update yarn.lock file	2023-03-30 19:01:04 +08:00
Yifei Zhang	164d3fb4fe	Merge pull request #228 from yanglyu902/fix-title fix: remove English punctuation in generated title	2023-03-30 19:00:05 +08:00
Jack	166329abee	fix: update yarn.lock file	2023-03-30 09:55:41 +00:00
Leotrinos	7d7abca2c4	fix trimTopic	2023-03-30 02:55:19 -07:00
Yifei Zhang	dab69c7507	Merge pull request #215 from hibobmaster/multi-arch-docker-build CI: Multi Arch docker builds	2023-03-30 16:06:22 +08:00
hibobmaster	852f8b8aa5	Merge branch 'main' of https://github.com/Yidadaa/ChatGPT-Next-Web into multi-arch-docker-build	2023-03-30 15:53:44 +08:00
Yifei Zhang	fe858621f2	Merge pull request #213 from leedom92/copy-content-in-mobile feat: setUserInput with onDoubleClickCapture in mobile phone	2023-03-30 15:38:54 +08:00
Leedom	6e4e804af8	Update home.tsx	2023-03-30 15:32:03 +08:00
leedom	e68aaf24f1	feat: setUserInput with onDoubleClickCapture in mobile phone	2023-03-30 15:22:10 +08:00
Yifei Zhang	29c20a3d5c	Merge pull request #202 from RugerMcCarthy/feat/display_line_break feat: import remark-breaks plugin	2023-03-30 14:56:21 +08:00
hibobmaster	6ed61f533a	Merge branch 'main' of https://github.com/Yidadaa/ChatGPT-Next-Web into multi-arch-docker-build	2023-03-30 13:48:06 +08:00
hibobmaster	ad7a365f32	Support multi-arch docker build	2023-03-30 13:19:32 +08:00
RugerMc	2c5420ab9e	feat: import ramarkBreaks plugin	2023-03-30 12:48:38 +08:00
Yifei Zhang	8d6d6bbf5d	Update README.md	2023-03-30 11:22:27 +08:00
Yifei Zhang	d5235c81d0	Update README.md	2023-03-30 11:21:44 +08:00
Yifei Zhang	9e5b119e92	Merge pull request #197 from angular-moon/patch-1 onUserSubmit hide promptHints	2023-03-30 10:53:54 +08:00
angular-moon	d9fc9cd198	onUserSubmit hide promptHints	2023-03-30 10:16:00 +08:00
Yifei Zhang	8b4db412d8	Update home.tsx	2023-03-30 02:30:38 +08:00
Yifei Zhang	9c6f3ebb54	Merge pull request #179 from Yidadaa/prompt fix: middleware match error	2023-03-30 02:11:11 +08:00
Yifei Zhang	53e30e20db	fix: middleware match error	2023-03-29 18:09:15 +00:00
Yifei Zhang	d908099798	Merge pull request #172 from Yidadaa/prompt feat: improve prompts ux	2023-03-30 02:01:55 +08:00
Yifei Zhang	469c8e9b00	fixup	2023-03-29 17:53:46 +00:00
Yifei Zhang	cd9799588d	fixup	2023-03-29 17:53:36 +00:00
Yifei Zhang	447dec9444	feat: close #2 add check account balance	2023-03-29 17:45:26 +00:00
Yifei Zhang	45088a3e06	feat: #112 add edit chat title	2023-03-29 16:02:50 +00:00
Yifei Zhang	08f3c7026d	feat: #170 auto scroll after retrying	2023-03-29 15:40:37 +00:00
Yifei Zhang	e606810581	refactor: #121 trigger auto-cmp with / prefix	2023-03-29 15:31:55 +00:00
Yifei Zhang	73b2ede53a	Merge pull request #162 from HimiCos/main fix: dialog height	2023-03-29 22:12:05 +08:00
Yifei Zhang	f1b2f895b4	Merge pull request #163 from GOWxx/bugfix_send_button_cover_text fix: send button covering the text in the textarea	2023-03-29 22:11:34 +08:00
Yifei Zhang	9724308008	Merge pull request #164 from gtang8/patch-2 Update README.md	2023-03-29 22:05:22 +08:00
gtang8	be4706d02d	Update README.md	2023-03-29 21:18:31 +08:00
HimiCos	752c083905	fix: dialog height	2023-03-29 20:53:23 +08:00
GOWxx	c47e90004a	fix: send button covering the text in the textarea	2023-03-29 20:37:21 +08:00
Yifei Zhang	380f818285	fix: #159 temperature should range 0 - 2	2023-03-29 20:00:23 +08:00
Yifei Zhang	f893f53b1c	Merge pull request #158 from HimiCos/main chore: standardize input box punctuation	2023-03-29 19:45:22 +08:00
HimiCos	cac604aee3	chore: standardize input box punctuation	2023-03-29 19:31:34 +08:00
Yifei Zhang	525b5b8ee6	Merge pull request #148 from RugerMcCarthy/dev supports the display of line breaks in Markdown	2023-03-29 18:05:52 +08:00
RugerMc	974c455bf9	feat: display line break hints in enter mode	2023-03-29 17:53:52 +08:00
RugerMc	b94607f636	feat: supports the display of line breaks in Markdown	2023-03-29 17:19:30 +08:00
Yifei Zhang	8a05f84838	Merge pull request #147 from Yidadaa/Yidadaa-patch-1 fix: #140 crash while hydrating store from old version	2023-03-29 16:09:06 +08:00
Yifei Zhang	ca0082856a	Update settings.tsx	2023-03-29 16:06:22 +08:00
Yifei Zhang	e12238ba8b	Merge pull request #146 from iSource/fix-mobile-autofocus fix: mobile textarea autofocus ui error	2023-03-29 16:00:21 +08:00
iSource	71f119c9e8	fix: mobile textarea autofocus ui error	2023-03-29 15:45:31 +08:00
Yifei Zhang	067121d968	Merge pull request #89 from iFwu/main feat: add font size config	2023-03-29 14:49:05 +08:00
Yifei Zhang	f5d775c055	Merge pull request #127 from stonega/main fix: message top action style issue	2023-03-29 14:48:20 +08:00
伏晓	f979822508	feat: add font size setting	2023-03-29 13:15:32 +08:00
Yifei Zhang	cfbe6d77b5	Merge pull request #129 from HimiCos/main Update app/locales/tw.ts	2023-03-29 12:36:30 +08:00
HimiCos	dee7950601	Update app/locales/tw.ts	2023-03-29 12:27:32 +08:00
Yifei Zhang	18d8eb4767	Merge pull request #125 from basefas/main chore: move some dependencies to devDependencies	2023-03-29 11:04:28 +08:00
basefas	f2d019ff97	chore: move some dependencies to devDependencies	2023-03-29 10:53:13 +08:00
Yifei Zhang	3a170d50cb	Update README.md	2023-03-29 02:26:14 +08:00
Yifei Zhang	17ee2ee135	Update home.tsx	2023-03-29 02:19:20 +08:00
Yifei Zhang	07956486b5	Merge pull request #74 from Yidadaa/prompt feat: #2 add prompt list	2023-03-29 02:13:02 +08:00
Yifei Zhang	e648a59b1f	feat: add lint-staged	2023-03-28 18:09:05 +00:00
Yifei Zhang	83400093a2	fixup: i18n for prompts	2023-03-28 17:45:23 +00:00
Yifei Zhang	6782e65fdf	feat: #2 add prompt hints	2023-03-28 17:45:23 +00:00
Yifei Zhang	7d5e742ea6	feat: #2 add prompt list	2023-03-28 17:45:23 +00:00
Yifei Zhang	19b511e3f8	Update README.md	2023-03-28 23:13:30 +08:00
Yifei Zhang	cde3cbed21	Merge pull request #109 from HimiCos/main feat: language support traditional chinese	2023-03-28 23:00:16 +08:00
HimiCos	307be405ac	feat: language support traditional chinese	2023-03-28 21:29:30 +08:00
石门	1c017b8ee9	fix: minor fix	2023-03-28 20:14:44 +08:00
石门	48dc2c2295	fix: minor fix	2023-03-28 19:38:18 +08:00
石门	3a3999d73a	fix: hide actions when loading	2023-03-28 18:59:03 +08:00
Yifei Zhang	7f3cbaa064	Merge pull request #100 from iSource/fix-docker-access-code fix: docker access code setting missing	2023-03-28 18:52:46 +08:00
石门	7a5c35baf3	fix: hide actions when loading	2023-03-28 18:48:03 +08:00
iSource	eb72c83b7e	fix: docker access code setting missing	2023-03-28 17:55:03 +08:00
Yifei Zhang	e93ea0fa97	Update README.md	2023-03-28 17:21:27 +08:00
Yifei Zhang	3b6f93afdf	feat: add one-key setup script	2023-03-28 16:51:23 +08:00
Yifei Zhang	4597a2286a	Update README.md	2023-03-28 14:53:07 +08:00
Yifei Zhang	780968979d	Update README.md	2023-03-28 13:36:08 +08:00
Yifei Zhang	adc0db4c74	Merge pull request #76 from xiaotianxt/main feat: CmdEnter config for submitkey, bug fix for auto scrolling	2023-03-28 13:35:36 +08:00
Yifei Zhang	f0dd95a2a3	Merge pull request #87 from Yidadaa/bugfix-0328 fix: light theme code highlight	2023-03-28 13:34:39 +08:00
Yifei Zhang	6155a190ac	fix: light theme code highlight	2023-03-28 05:24:51 +00:00
xiaotianxt	493aa8c591	refactor: refocus textarea after btn clicked	2023-03-28 13:02:49 +08:00
xiaotianxt	6c82f804ae	fix: Enter key bug	2023-03-28 12:56:36 +08:00
xiaotianxt	a2807c9815	fix(scroll): scroll after click submit button The behavior of SubmitKey and SubmitButton should be the same	2023-03-28 12:56:36 +08:00
xiaotianxt	d822f333c2	feat(SubmitKey): add MetaEnter option Add another option for MacOS user who prefer Cmd+Enter or Linux user who prefer Meta+Enter.	2023-03-28 12:56:36 +08:00
Yifei Zhang	8f498075b9	Merge pull request #81 from iSource/fix-code-copy-button fix: code copy button position	2023-03-28 11:57:03 +08:00
Yifei Zhang	c4bf6a6383	Merge pull request #84 from iSource/add-robots-txt feat: add robots.txt	2023-03-28 11:56:47 +08:00
Yifei Zhang	939402b2d9	Merge pull request #85 from AprilNEA/fix-mobile fix: fix #82, close sidebar after new session	2023-03-28 11:56:29 +08:00
AprilNEA	684a3c41ef	fix: fix #82 , close sidebar after new session	2023-03-28 11:51:36 +08:00
iSource	306f0850e9	feat: add robots.txt	2023-03-28 11:25:47 +08:00
iSource	55f37248f7	fix: code copy button position	2023-03-28 10:50:50 +08:00
Yifei Zhang	c93a46a02f	Update README.md	2023-03-28 02:15:52 +08:00
Yifei Zhang	77a3fdea5f	Update README.md	2023-03-27 23:02:39 +08:00
Yifei Zhang	cc1a1d4f3c	feat: #27 add docker image publish actions	2023-03-27 14:46:30 +00:00
Yifei Zhang	0463b350d8	feat: #24 docker publish actions	2023-03-27 22:44:09 +08:00
Yifei Zhang	8f87a68f72	Merge pull request #39 from AprilNEA/docker feat: add docker deployment support	2023-03-27 22:41:20 +08:00
Yifei Zhang	60f27fdfbb	Merge pull request #68 from AprilNEA/main fix(#65): fix unknown git commit id	2023-03-27 22:01:19 +08:00
Yifei Zhang	d17706636b	Merge pull request #66 from iFwu/main fix: resolve hydration error	2023-03-27 21:59:19 +08:00
Yifei Zhang	9570691d5b	Delete userRole.tsx	2023-03-27 21:52:50 +08:00
AprilNEA	efe4fcc188	Merge branch 'Yidadaa:main' into main	2023-03-27 18:31:47 +08:00
AprilNEA	efaf6590ef	fix(#65 ): fix unknown git commit id	2023-03-27 18:31:04 +08:00
伏晓	fb06fb8c38	fix: resolve hydration error	2023-03-27 18:22:55 +08:00
Yifei Zhang	f188841188	Merge pull request #67 from iSource/pwa-support feat: add PWA support	2023-03-27 18:19:49 +08:00
jianjian.ma	5593c067c4	feat: add PWA support	2023-03-27 18:02:35 +08:00
jianjian.ma	689b7bab26	feat: add PWA support	2023-03-27 17:53:32 +08:00
Yifei Zhang	a81e7394f0	Update README.md	2023-03-27 17:45:36 +08:00
Yifei Zhang	492fed6802	Merge pull request #64 from AprilNEA/fix-theme Fix broswer tasklist and support safari webapp #54	2023-03-27 17:44:21 +08:00
jianjian.ma	bdf17fafff	feat: add PWA support	2023-03-27 17:41:44 +08:00
AprilNEA	58baa23199	Merge branch 'fix-theme' of https://github.com/AprilNEA/ChatGPT-Next-Web into fix-theme	2023-03-27 17:05:15 +08:00
AprilNEA	dd80c4563d	feat: adding iOS Webapp support - fix media query about background-color - Use colors from CSS files instead of fixed values	2023-03-27 17:04:11 +08:00
AprilNEA	785372ad73	fix: fix the different colors on mobile	2023-03-27 15:47:46 +08:00
AprilNEA	d8e4808316	Merge branch 'Yidadaa:main' into fix-theme	2023-03-27 15:10:10 +08:00
AprilNEA	6446692db0	feat: support safari appleWebApp	2023-03-27 15:02:12 +08:00
AprilNEA	cd73c3a7cb	fix: taskbar color follow(#54 )	2023-03-27 15:01:35 +08:00
AprilNEA	d0eee767fa	fix: resolve conflict	2023-03-27 14:01:03 +08:00
AprilNEA	e880df6db9	docs: add instructions for docker deployment	2023-03-27 13:59:23 +08:00
AprilNEA	96c4f5bbd9	Merge branch 'Yidadaa:main' into docker	2023-03-27 13:53:46 +08:00
AprilNEA	2645540721	perf: build in stages to reduce container size	2023-03-27 13:49:26 +08:00
Yifei Zhang	b1f27aaf93	Merge pull request #61 from Yidadaa/bugfix-0327 fix: #7 disable light code theme	2023-03-27 11:07:07 +08:00
Yifei Zhang	fb2d281aac	fix: #7 disable light code theme	2023-03-27 03:02:25 +00:00
Yifei Zhang	84d73fa1f2	Merge pull request #48 from Yidadaa/custom-token v1.4 Custom Api Key & Copy Code Button	2023-03-26 20:36:45 +08:00
Yifei Zhang	f858407f9a	fixup	2023-03-26 12:35:15 +00:00
Yifei Zhang	b57663bf02	feat: now support gpt-4 model	2023-03-26 12:32:22 +00:00
Yifei Zhang	e57bd51809	feat: #9 add copy code button	2023-03-26 12:29:02 +00:00
Yifei Zhang	df66eef919	feat: support using user api key	2023-03-26 11:58:25 +00:00
Yifei Zhang	f1b6641f19	Update README.md	2023-03-26 19:28:30 +08:00
Yifei Zhang	bb45c62a81	Merge pull request #45 from Yidadaa/bugfix-0326 v1.3 Stop and Retry Button	2023-03-26 19:16:02 +08:00
Yifei Zhang	1e89fe14ac	fix: #34 only auto scroll when textbox is focused	2023-03-26 11:10:34 +00:00
Yifei Zhang	86507fa569	feat: #2 #8 add stop and retry button	2023-03-26 10:59:09 +00:00
Yifei Zhang	4180363f58	Update README.md	2023-03-26 17:51:46 +08:00
Yifei Zhang	a5ec15236a	fix: #38 high resolution favicon	2023-03-26 09:32:47 +00:00
AprilNEA	8d0d08725d	feat: add Dockerfile for docker deployment support	2023-03-26 16:56:05 +08:00
Yifei Zhang	43b6835564	Update README.md	2023-03-26 16:52:00 +08:00
Yifei Zhang	3f865ffa1e	Update README.md	2023-03-26 15:18:34 +08:00
Yifei Zhang	5cdcaac35b	Merge pull request #29 from Yidadaa/bugfix-0325 v1.2 bug fix, ui improvement and access control by code	2023-03-26 15:12:46 +08:00
Yifei Zhang	d0d1673ccc	fixup: disable access control when CODE is empty	2023-03-26 07:06:06 +00:00
Yifei Zhang	3136d6d3fd	fix: #10 replace export icon	2023-03-26 06:57:13 +00:00
Yifei Zhang	2c899cf00e	feat: #2 add access control by access code	2023-03-26 06:53:40 +00:00
Yifei Zhang	15e49e8b46	Update README.md	2023-03-26 00:25:10 +08:00
Yidadaa	a5b3998304	fix: #23 errors when dev on windows	2023-03-25 22:24:52 +08:00
Yifei Zhang	9681fd8e14	Update README.md	2023-03-25 22:18:48 +08:00
Yifei Zhang	8399677350	Update README.md	2023-03-25 14:54:42 +08:00
Yifei Zhang	b1670b3558	chore: fix typos	2023-03-24 18:44:16 +08:00
Yifei Zhang	806e7b09c1	feat: #2 trying to add stop response button	2023-03-23 17:42:38 +00:00
Yifei Zhang	99b88f36fd	refactor: #6 check update over one hour and debound scroll	2023-03-23 17:00:33 +00:00
Yifei Zhang	29de957395	feat: add check update	2023-03-23 16:01:00 +00:00
Yifei Zhang	e55520e93c	fix: #5 crash if code block cannot be highlighted	2023-03-23 11:28:07 +00:00
Yifei Zhang	fa8667ec19	chore: update readme about dev config	2023-03-23 03:59:50 +00:00
Yifei Zhang	547ef5565e	fix: #2 use shift+enter to wrap lines when submit key is enter	2023-03-23 03:38:40 +00:00
Yifei Zhang	eb531d4524	fix: code highlight styles	2023-03-23 03:17:18 +00:00
				`@@ -0,0 +1 @@`
				<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16" viewBox="0 0 16 16" fill="none"><defs><rect id="path_0" x="0" y="0" width="16" height="16" /></defs><g opacity="1" transform="translate(0 0) rotate(0 8 8)"><mask id="bg-mask-0" fill="white"><use xlink:href="#path_0"></use></mask><g mask="url(#bg-mask-0)" ><path id="路径 1" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(10.5 11) rotate(0 1.4166666666666665 1.8333333333333333)" d="M2.83,0L2.83,3C2.83,3.37 2.53,3.67 2.17,3.67L0,3.67 " /><path id="路径 2" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(2.6666666666666665 1.3333333333333333) rotate(0 5.333333333333333 6.666666666666666)" d="M10.67,4L10.67,0.67C10.67,0.3 10.37,0 10,0L0.67,0C0.3,0 0,0.3 0,0.67L0,12.67C0,13.03 0.3,13.33 0.67,13.33L2.67,13.33 " /><path id="路径 3" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(5.333333333333333 5.333333333333333) rotate(0 2.333333333333333 0)" d="M0,0L4.67,0 " /><path id="路径 4" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(7.666666666666666 7.666666666666666) rotate(0 2.833333333333333 3.5)" d="M0,7L5.67,0 " /><path id="路径 5" style="stroke:#333333; stroke-width:1.3333333333333333; stroke-opacity:1; stroke-dasharray:0 0" transform="translate(5.333333333333333 8) rotate(0 1.3333333333333333 0)" d="M0,0L2.67,0 " /></g></g></svg>