Rewrite the entire code base using Next.js (#12)

Author: blrchen

.deployment

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

.dockerignore

@@ -1,35 +1,38 @@
-# compiled output
-/dist
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
 /node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
 
-# Logs
-logs
-*.log
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
 npm-debug.log*
-pnpm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-lerna-debug.log*
 
-# OS
-.DS_Store
+# local env files
+.env*.local
 
-# Tests
-/coverage
-/.nyc_output
-
-# IDEs and editors
-/.idea
-.project
-.classpath
-.c9/
-*.launch
-.settings/
-*.sublime-workspace
-
-# IDE - VSCode
-.vscode/*
-!.vscode/settings.json
-!.vscode/tasks.json
-!.vscode/launch.json
-!.vscode/extensions.json
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+# JetBrains
+.idea/

.eslintrc.js

@@ -1,5 +1,19 @@
 {
-  "printWidth": 120,
+  "printWidth": 100,
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": false,
   "singleQuote": true,
-  "trailingComma": "all"
+  "quoteProps": "as-needed",
+  "jsxSingleQuote": false,
+  "trailingComma": "none",
+  "bracketSpacing": true,
+  "bracketSameLine": false,
+  "arrowParens": "always",
+  "rangeStart": 0,
+  "requirePragma": false,
+  "insertPragma": false,
+  "proseWrap": "preserve",
+  "htmlWhitespaceSensitivity": "css",
+  "endOfLine": "lf"
 }

.eslintrc.json

@@ -1,35 +1,44 @@
-# Building layer
-FROM node:18-alpine as development
+# This Dockerfile is generated based on sample in the following document
+# https://github.com/vercel/next.js/blob/canary/examples/with-docker/Dockerfile
+FROM node:18-alpine AS base
+
+# Install dependencies only when needed
+FROM base AS deps
+# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
+RUN apk add --no-cache libc6-compat
 WORKDIR /app
 
-# Copy configuration files
-COPY tsconfig*.json ./
-COPY package*.json ./
-
-# Install dependencies from package-lock.json
+# Install dependencies based on the preferred package manager
+COPY package.json package-lock.json* ./
 RUN npm ci
 
-# Copy application sources (.ts, .tsx, js)
-COPY src/ src/
-
-# Build application (produces dist/ folder)
+# Rebuild the source code only when needed
+FROM base AS builder
+WORKDIR /app
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
 RUN npm run build
 
-# Runtime (production) layer
-FROM node:18-alpine as production
+# Production image, copy all the files and run next
+FROM base AS runner
 WORKDIR /app
 
-# Copy dependencies files
-COPY package*.json ./
+ENV NODE_ENV production
 
-# Install runtime dependencies (without dev/test dependencies)
-RUN npm ci --only=production
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
 
-# Copy production build
-COPY --from=development /app/dist/ ./dist/
+COPY --from=builder /app/public ./public
+
+# Automatically leverage output traces to reduce image size
+# https://nextjs.org/docs/advanced-features/output-file-tracing
+COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
+COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
+
+USER nextjs
 
-# Expose application port
 EXPOSE 3000
 
-# Start application
-CMD [ "node", "dist/main.js" ]
+ENV PORT 3000
+
+CMD ["node", "server.js"]

.gitignore

@@ -22,10 +22,10 @@ You must have an Azure OpenAI account to use the Azure OpenAI Proxy.
 2. Clone the code in the command line window.
 3. Run `npm install` to install dependencies.
 4. Run `npm start` to start the application.
-5. Run the script below for testing, replacing `YOUR_RESOURCE_ID`, `YOUR_MODEL_DEPLOYMENT`, and `YOUR_API_KEY` before running it, `AZURE_API_VERSION` is optional and the default value is `2023-03-15-preview`.
+5. Run the script below for testing, replacing `AZURE_RESOURCE_ID`, `AZURE_MODEL_DEPLOYMENT`, and `AZURE_API_KEY` before running it, `AZURE_API_VERSION` is optional and the default value is `2023-03-15-preview`.
 ```bash
 curl -X "POST" "http://localhost:3000/v1/chat/completions" \
--H 'Authorization: YOUR_RESOURCE_ID:YOUR_MODEL_DEPLOYMENT:YOUR_API_KEY:AZURE_API_VERSION' \
+-H 'Authorization: AZURE_RESOURCE_ID:AZURE_MODEL_DEPLOYMENT:AZURE_API_KEY:AZURE_API_VERSION' \
 -H 'Content-Type: application/json; charset=utf-8' \
 -d $'{
   "messages": [
@@ -51,21 +51,22 @@ The following apps have been tested and confirmed to work with the azure-openai-
 | App Name         | E2E Docker-compose file | 
 |------------------|-------------------------|
 | [chatbot-ui](https://github.com/mckaywrigley/chatbot-ui) | [docker-compose.yml](./e2e/chatbot-ui/docker-compose.yml) |
+| [chatgpt-next-web](https://github.com/Yidadaa/ChatGPT-Next-Web) | [docker-compose.yml](./e2e/chatgpt-next-web/docker-compose.yml) |
 | [chatgpt-web](https://github.com/Chanzhaoyu/chatgpt-web) | [docker-compose.yml](./e2e/chatgpt-web/docker-compose.yml) |
 | [gptlite](https://github.com/blrchen/gptlite)  | [docker-compose.yml](./e2e/gptlite/docker-compose.yml) |
 
 To run a test locally, please follow these steps:
 
 1. Clone the code in a command-line window.
-2. Update the environment variable `OPENAPI_API_KEY` with `YOUR_RESOURCE_ID:YOUR_MODEL_DEPLOYMENT:YOUR_API_KEY`. Alternatively, you can update the OPENAPI_API_KEY value directly in the docker-compose.yml file.
+2. Update the environment variable `OPENAPI_API_KEY` with `AZURE_RESOURCE_ID:AZURE_MODEL_DEPLOYMENT:AZURE_API_KEY`. Alternatively, you can update the OPENAPI_API_KEY value directly in the docker-compose.yml file.
 3. Navigate to the directory containing the `docker-compose.yml` file for the app you want to test.
 4. Execute the build command: `docker-compose build`.
 5. Start the service: `docker-compose up -d`.
 6. Based on the exposed port defined in the docker-compose.yml file, launch the app to test it locally. For example, visit http://localhost:3000.
 
 ## Frequently Asked Questions
 
-Q: What is `YOUR_RESOURCE_ID`,`YOUR_MODEL_DEPLOYMENT`,`YOUR_API_KEY`?
+Q: What is `AZURE_RESOURCE_ID`,`AZURE_MODEL_DEPLOYMENT`,`AZURE_API_KEY`?
 
 A: It can be found in azure management portal, see image below for details:
 
@@ -75,7 +76,7 @@ Q: How do I support GPT-4？
 
 A: To use GPT-4, please use key format as follows:
 
-`YOUR_RESOURCE_ID:gpt-3.5-turbo|YOUR_MODEL_DEPLOYMENT,gpt-4|YOUR_MODEL_DEPLOYMENT,gpt-4-32k|YOUR_MODEL_DEPLOYMENT:YOUR_API_KEY:AZURE_API_VERSION`
+`AZURE_RESOURCE_ID:gpt-3.5-turbo|AZURE_MODEL_DEPLOYMENT,gpt-4|AZURE_MODEL_DEPLOYMENT,gpt-4-32k|AZURE_MODEL_DEPLOYMENT:AZURE_API_KEY:AZURE_API_VERSION`
 
 # How To Contribute Code?
 

.prettierrc

@@ -22,10 +22,10 @@
 2. 克隆代码到命令行窗口。
 3. 运行 `npm install` 安装依赖项。
 4. 运行 `npm start` 启动应用程序。
-5. 运行下面脚本测试，运行前需要把`YOUR_RESOURCE_ID`，`YOUR_MODEL_DEPLOYMENT`，`YOUR_API_KEY`, `AZURE_API_VERSION`替换，`AZURE_API_VERSION`参数可选，目前默认是2023-03-15-preview。
+5. 运行下面脚本测试，运行前需要把`AZURE_RESOURCE_ID`，`AZURE_MODEL_DEPLOYMENT`，`AZURE_API_KEY`, `AZURE_API_VERSION`替换，`AZURE_API_VERSION`参数可选，目前默认是`2023-03-15-preview`。
 ```bash
 curl -X "POST" "http://localhost:3000/v1/chat/completions" \
--H 'Authorization: YOUR_RESOURCE_ID:YOUR_MODEL_DEPLOYMENT:YOUR_API_KEY:AZURE_API_VERSION' \
+-H 'Authorization: AZURE_RESOURCE_ID:AZURE_MODEL_DEPLOYMENT:AZURE_API_KEY:AZURE_API_VERSION' \
 -H 'Content-Type: application/json; charset=utf-8' \
 -d $'{
   "messages": [
@@ -51,21 +51,22 @@ curl -X "POST" "http://localhost:3000/v1/chat/completions" \
 | App Name         | E2E Docker-compose file | 
 |------------------|-------------------------|
 | [chatbot-ui](https://github.com/mckaywrigley/chatbot-ui) | [docker-compose.yml](./e2e/chatbot-ui/docker-compose.yml) |
+| [chatgpt-next-web](https://github.com/Yidadaa/ChatGPT-Next-Web) | [docker-compose.yml](./e2e/chatgpt-next-web/docker-compose.yml) |
 | [chatgpt-web](https://github.com/Chanzhaoyu/chatgpt-web) | [docker-compose.yml](./e2e/chatgpt-web/docker-compose.yml) |
 | [gptlite](https://github.com/blrchen/gptlite)  | [docker-compose.yml](./e2e/gptlite/docker-compose.yml) |
 
 要在本地运行测试，请按照以下步骤操作：
 
 1. 在命令行窗口中克隆代码。
-2. 更新环境变量`OPENAPI_API_KEY`的值为`YOUR_RESOURCE_ID:YOUR_MODEL_DEPLOYMENT:YOUR_API_KEY`。或者，直接在`docker-compose.yml`文件中更新`OPENAPI_API_KEY`值。
+2. 更新环境变量`OPENAPI_API_KEY`的值为`AZURE_RESOURCE_ID:AZURE_MODEL_DEPLOYMENT:AZURE_API_KEY`。或者，直接在`docker-compose.yml`文件中更新`OPENAPI_API_KEY`值。
 3. 导航到包含要测试的应用程序的`docker-compose.yml`文件所在的目录。
 3. 执行构建命令：`docker-compose build`。
 4. 启动服务：`docker-compose up -d`。
 5. 根据`docker-compose.yml`文件中定义的公开端口，启动应用以在本地进行测试。例如，访问 http://localhost:3000。
 
 ## 常见问题
 
-Q：什么是`YOUR_RESOURCE_ID`，`YOUR_MODEL_DEPLOYMENT`，`YOUR_API_KEY`
+Q：什么是`AZURE_RESOURCE_ID`，`AZURE_MODEL_DEPLOYMENT`，`AZURE_API_KEY`
 
 A: 可以在Azure的管理门户里查找，具体见下图标注
 
@@ -75,7 +76,7 @@ Q: 如何支持GPT-4
 
 A: 要使用GPT-4，请使用下列格式的key: 
 
-`YOUR_RESOURCE_ID:gpt-3.5-turbo|YOUR_MODEL_DEPLOYMENT,gpt-4|YOUR_MODEL_DEPLOYMENT,gpt-4-32k|YOUR_MODEL_DEPLOYMENT:YOUR_API_KEY:AZURE_API_VERSION`
+`AZURE_RESOURCE_ID:gpt-3.5-turbo|AZURE_MODEL_DEPLOYMENT,gpt-4|AZURE_MODEL_DEPLOYMENT,gpt-4-32k|AZURE_MODEL_DEPLOYMENT:AZURE_API_KEY:AZURE_API_VERSION`
 
 # 贡献代码方式
 

.vscode/settings.json

@@ -0,0 +1,14 @@
+const nextConfig = {
+  output: 'standalone',
+  reactStrictMode: true,
+  async rewrites() {
+    return [
+      {
+        source: '/v1/:path*',
+        destination: '/api/:path*'
+      }
+    ]
+  }
+}
+
+module.exports = nextConfig