Skip to content

Commit 4686290

Browse files
blrchenblrchen
authored
Improve prompt store experience (#25)
1 parent afb4805 commit 4686290

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

75 files changed

+4432
-4316
lines changed

‎.dockerignore

+4-5
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
1-
Dockerfile
21
.dockerignore
3-
node_modules
4-
npm-debug.log
5-
README.md
6-
.next
72
.git
3+
.next
4+
Dockerfile
5+
README.md
6+
node_modules

‎.editorconfig

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
# https://editorconfig.org
2+
root = true
3+
4+
[*]
5+
charset=utf-8
6+
end_of_line=lf
7+
insert_final_newline=false
8+
indent_style=space
9+
indent_size=2

‎.env.example

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
# For more details, visit the following link: https://github.com/blrchen/chatgpt-lite#environment-variables
2+
3+
# OpenAI API credentials. These are necessary if you intend to utilize the OpenAI API.
4+
OPENAI_API_KEY=
5+
OPENAI_API_BASE_URL="https://api.openai.com"
6+
7+
# Azure OpenAI API credentials. These are necessary if you intend to utilize the Azure OpenAI API.
8+
# AZURE_OPENAI_API_BASE_URL=
9+
# AZURE_OPENAI_API_KEY=
10+
# AZURE_OPENAI_DEPLOYMENT=

‎.eslintrc.json

+20-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,22 @@
11
{
2-
"extends": "next/core-web-vitals"
2+
"extends": "next/core-web-vitals",
3+
"rules": {
4+
"react/react-in-jsx-scope": 0,
5+
"import/no-extraneous-dependencies": 0,
6+
"no-sparse-arrays": 1,
7+
"import/extensions": 0,
8+
"no-shadow": 0,
9+
"no-nested-ternary": 0,
10+
"no-restricted-globals": 0,
11+
"@typescript-eslint/ban-types": 0,
12+
"react/static-property-placement": [
13+
"warn",
14+
"property assignment",
15+
{
16+
"contextTypes": "static public field",
17+
"contextType": "static public field",
18+
"displayName": "static public field"
19+
}
20+
]
21+
}
322
}

‎.prettierignore

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
1-
node_modules
2-
.next
1+
.next
2+
node_modules

‎.vscode/launch.json

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"version": "0.2.0",
3+
"configurations": [
4+
{
5+
"type": "node",
6+
"request": "launch",
7+
"name": "website",
8+
"cwd": "${workspaceFolder}",
9+
"runtimeExecutable": "npm",
10+
"runtimeArgs": ["run", "dev"],
11+
"autoAttachChildProcesses": true,
12+
"stopOnEntry": true,
13+
"skipFiles": ["<node_internals>/**"]
14+
}
15+
]
16+
}

‎README.md

+18-14
Original file line numberDiff line numberDiff line change
@@ -2,30 +2,30 @@
22

33
English | [简体中文](./README.zh-CN.md)
44

5-
ChatGPT Lite is a fast ChatGPT UI application built using Next.js and And Design. It supports both OpenAI and Azure OpenAI accounts.
5+
ChatGPT Lite is a fast ChatGPT UI application developed using Next.js. It supports both OpenAI and Azure OpenAI accounts.
66

77
Example use cases for GPT Lite include:
88

99
- A cost-effective alternative to ChatGPT's free version or Plus subscription ($20/month) by deploying a custom webchat UI with API integration.
1010
- Deploying a custom ChatGPT web app to explore OpenAI's ChatGPT completion API and prompting capabilities.
1111
- Creating a private web-based ChatGPT for exclusive use among friends without sharing an API key.
12-
- Learning web application development using OpenAI's API.
12+
- A high-quality code base that serves as an excellent starting point for your next AI Next.js project.
1313

14-
For a minimal ChatGPT UI, visit [ChatGPT Minimal](https://github.com/blrchen/chatgpt-minimal).
14+
Visit [ChatGPT Minimal](https://github.com/blrchen/chatgpt-minimal) for a beginner-friendly version of the ChatGPT UI code base.
1515

1616
[Live Demo](https://gptlite.vercel.app)
1717
![demo](./docs/images/demo.jpg)
1818

1919
## Prerequisites
2020

21-
You need either an OpenAI account or an Azure OpenAI account.
21+
You'll need either an OpenAI account or an Azure OpenAI account.
2222

2323
## Running Locally
2424

2525
1. Install NodeJS 18.
2626
2. Clone the repository.
2727
3. Install dependencies with `npm install`.
28-
4. Set the `OPENAI_API_KEY` environment variable.
28+
4. Copy `.env.example` file to `.env.local` and update environment variables.
2929
5. Start the application using `npm run dev`.
3030
6. Visit `http://localhost:3000` in your browser.
3131

@@ -43,23 +43,27 @@ Click the button below to deploy to Vercel:
4343

4444
## Environment Variables
4545

46+
You will need to use the environment variables defined in [`.env.example`](.env.example) to run the application. Below is an explanation of each environment variable:
47+
4648
For OpenAI-specific environments:
4749

48-
| Name | Description | Default Value |
49-
| ------------------- | -------------------------------------------------------------------------------------------------------------------------------- | --------------------- |
50-
| OPENAI_API_BASE_URL | Use only if you intend to use a reserved proxy for `api.openai.com`. | `https://api.openai.com` |
51-
| OPENAI_API_KEY | Obtain secret key string from the [Open AI API website](https://platform.openai.com/account/api-keys). |
50+
| Name | Description | Default Value |
51+
| ------------------- | ------------------------------------------------------------------------------------------------------ | ------------------------ |
52+
| OPENAI_API_BASE_URL | Use only if you intend to use a reserved proxy for `api.openai.com`. | `https://api.openai.com` |
53+
| OPENAI_API_KEY | Obtain secret key string from the [Open AI API website](https://platform.openai.com/account/api-keys). |
5254

5355
For Azure Open AI-specific environments:
5456

55-
| Name | Description |
56-
|----------------------------|------------------------------------------------|
57-
| AZURE_OPENAI_API_BASE_URL | Endpoint (e.g., https://xxx.openai.azure.com). |
58-
| AZURE_OPENAI_API_KEY | Key |
59-
| AZURE_OPENAI_DEPLOYMENT | Model deployment name |
57+
| Name | Description |
58+
| ------------------------- | ---------------------------------------------- |
59+
| AZURE_OPENAI_API_BASE_URL | Endpoint (e.g., https://xxx.openai.azure.com). |
60+
| AZURE_OPENAI_API_KEY | Key |
61+
| AZURE_OPENAI_DEPLOYMENT | Model deployment name |
6062

6163
## Contribution
64+
6265
We welcome PRs of any size.
6366

6467
## Disclaimers
68+
6569
This code is intended solely for demonstration and testing purposes.

‎README.zh-CN.md

+21-18
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,16 @@
22

33
[English](./README.md) | 简体中文
44

5-
ChatGPT Lite 是一个基于 Next.js 和 OpenAI Streaming API的 ChatGPT UI 应用，支持 OpenAI 和 Azure OpenAI 账户。
5+
ChatGPT Lite 是一个基于 Next.js 和 OpenAI Streaming API 的 ChatGPT UI 应用，支持 OpenAI 和 Azure OpenAI 账户。
6+
7+
ChatGPT Lite 的示例用例包括：
68

7-
GPT Lite 的用途包括：
89
- 作为官方网站的替代品，解决免费版连接不稳定和刷新问题，节省 Plus 订阅费用。
910
- 部署定制化 ChatGPT 程序，探索 OpenAI 的 ChatGPT、completion API 及 prompt 提示词等。
1011
- 创建便于家人朋友共享使用的 ChatGPT 程序，无需共享 API 密钥。
11-
- 学习如何使用 OpenAI API 开发 Web 应用程序。
12+
- 高质量的代码库，是您下一个 AI Next.js 项目的绝佳起点。
1213

13-
如需访问最小功能版本的 ChatGPT UI，请前往 [ChatGPT Lite](https://github.com/blrchen/chatgpt-minimal)。
14+
访问 [ChatGPT Minimal](https://github.com/blrchen/chatgpt-minimal)，这是一个对初学者更友好的 ChatGPT UI 代码库。
1415

1516
[在线演示](https://gptlite.vercel.app)
1617
![演示](./docs/images/demo.zh-CN.jpg)
@@ -24,15 +25,15 @@ GPT Lite 的用途包括：
2425
1. 安装 NodeJS 18。
2526
2. 克隆仓库。
2627
3. 使用 `npm install` 安装依赖。
27-
4. 设置 `OPENAI_API_KEY` 环境变量。
28-
5. 使用 `npm run dev` 启动应用。
28+
4. 将 `.env.example` 文件复制为 `.env.local` 然后更新环境变量。
29+
5. 使用 `npm run dev` 启动应用程序。
2930
6. 在浏览器中访问 `http://localhost:3000`。
3031

3132
## 使用 Docker 运行
3233

33-
1. 克隆仓库并进入根目录。
34-
2. 更新 `docker-compose.yml` 文件中的 `OPENAI_API_KEY` 环境变量。
35-
3. 使用 `docker-compose build .` 构建应用。
34+
1. 克隆仓库并导航到根目录。
35+
2. 在 `docker-compose.yml` 文件中更新 `OPENAI_API_KEY` 环境变量。
36+
3. 使用 `docker-compose build .` 构建应用程序。
3637
4. 运行 `docker-compose up -d` 启动。
3738

3839
## 在 Vercel 上一键部署
@@ -42,20 +43,22 @@ GPT Lite 的用途包括：
4243

4344
## 环境变量
4445

46+
您需要使用在 [`.env.example`](.env.example) 中定义的环境变量来运行应用程序。以下是每个环境变量的解释
47+
4548
OpenAI 相关环境变量：
4649

47-
| 名称 | 描述 | 默认值 |
48-
|---------------------|-------------------------------------------------------------------------------------------------------|------------------------|
49-
| OPENAI_API_BASE_URL | 仅在打算为 `api.openai.com` 使用反向代理时使用。 | `https://api.openai.com` |
50-
| OPENAI_API_KEY | 从 [OpenAI API 网站](https://platform.openai.com/account/api-keys) 获取密钥字符串。 |
50+
| 名称 | 描述 | 默认值 |
51+
| ------------------- | ----------------------------------------------------------------------------------- | ------------------------ |
52+
| OPENAI_API_BASE_URL | 仅在打算为 `api.openai.com` 使用反向代理时使用。 | `https://api.openai.com` |
53+
| OPENAI_API_KEY | 从 [OpenAI API 网站](https://platform.openai.com/account/api-keys) 获取密钥字符串。 |
5154

5255
Azure Open AI 相关环境变量：
5356

54-
| 名称 | 描述 |
55-
|----------------------------|----------------------------------------------|
56-
| AZURE_OPENAI_API_BASE_URL | 端点（如，https://xxx.openai.azure.com）。 |
57-
| AZURE_OPENAI_API_KEY | 密钥 |
58-
| AZURE_OPENAI_DEPLOYMENT | 模型部署名称 |
57+
| 名称 | 描述 |
58+
| ------------------------- | ------------------------------------------ |
59+
| AZURE_OPENAI_API_BASE_URL | 端点（如，https://xxx.openai.azure.com）。 |
60+
| AZURE_OPENAI_API_KEY | 密钥 |
61+
| AZURE_OPENAI_DEPLOYMENT | 模型部署名称 |
5962

6063
## 贡献
6164

‎app/(site)/page.tsx

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
'use client'
2+
3+
import { useState } from 'react'
4+
5+
import Sidebar from '@/components/sidebar'
6+
import Chat from '@/components/chat'
7+
import MobileNav from '@/components/mobileNav'
8+
import ChatContext from '@/contexts/chatContext'
9+
import useChatHook from '@/hooks/useChatHook'
10+
import PersonaModal from '@/components/personaModal'
11+
import PromptPanel from '@/components/personaPanel'
12+
13+
export default function Home() {
14+
const provider = useChatHook()
15+
16+
const [isComponentVisible, setIsComponentVisible] = useState(false)
17+
18+
const toggleComponentVisibility = () => {
19+
setIsComponentVisible(!isComponentVisible)
20+
}
21+
22+
return (
23+
<ChatContext.Provider value={provider}>
24+
<main className="overflow-hidden w-full h-screen relative flex">
25+
<MobileNav
26+
showMobileSiderbar={isComponentVisible}
27+
toggleComponentVisibility={toggleComponentVisibility}
28+
/>
29+
30+
<div className="dark hidden flex-shrink-0 bg-gray-900 md:flex md:w-[260px] md:flex-col">
31+
<Sidebar />
32+
</div>
33+
34+
<div className="relative max-w-full flex-1 h-full">
35+
<Chat ref={provider.chatRef} />
36+
<PromptPanel />
37+
</div>
38+
<PersonaModal />
39+
</main>
40+
</ChatContext.Provider>
41+
)
42+
}

0 commit comments

Comments
 (0)