Feat redesign UI

.eslintrc.json

@@ -1,4 +1,12 @@
 {
   "extends": "next/core-web-vitals",
-  "plugins": ["prettier"]
+  "plugins": [
+    "prettier"
+  ],
+  "parserOptions": {
+    "ecmaFeatures": {
+      "legacyDecorators": true
+    }
+  },
+  "ignorePatterns": ["globals.css"]
 }

app/api/provider/[...path]/route.ts

@@ -0,0 +1,93 @@
+import * as ProviderTemplates from "@/app/client/providers";
+import { getServerSideConfig } from "@/app/config/server";
+import { NextRequest, NextResponse } from "next/server";
+import { cloneDeep } from "lodash-es";
+import {
+  disableSystemApiKey,
+  makeUrlsUsable,
+  modelNameRequestHeader,
+} from "@/app/client/common";
+import { collectModelTable } from "@/app/utils/model";
+
+async function handle(
+  req: NextRequest,
+  { params }: { params: { path: string[] } },
+) {
+  const [providerName] = params.path;
+  const { headers } = req;
+  const serverConfig = getServerSideConfig();
+  const modelName = headers.get(modelNameRequestHeader);
+
+  const ProviderTemplate = Object.values(ProviderTemplates).find(
+    (t) => t.prototype.name === providerName,
+  );
+
+  if (!ProviderTemplate) {
+    return NextResponse.json(
+      {
+        error: true,
+        message: "No provider found: " + providerName,
+      },
+      {
+        status: 404,
+      },
+    );
+  }
+
+  // #1815 try to refuse gpt4 request
+  if (modelName && serverConfig.customModels) {
+    try {
+      const modelTable = collectModelTable([], serverConfig.customModels);
+
+      // not undefined and is false
+      if (modelTable[modelName]?.available === false) {
+        return NextResponse.json(
+          {
+            error: true,
+            message: `you are not allowed to use ${modelName} model`,
+          },
+          {
+            status: 403,
+          },
+        );
+      }
+    } catch (e) {
+      console.error("models filter", e);
+    }
+  }
+
+  const config = disableSystemApiKey(
+    makeUrlsUsable(cloneDeep(serverConfig), [
+      "anthropicUrl",
+      "azureUrl",
+      "googleUrl",
+      "baseUrl",
+    ]),
+    ["anthropicApiKey", "azureApiKey", "googleApiKey", "apiKey"],
+    serverConfig.needCode &&
+      ProviderTemplate !== ProviderTemplates.NextChatProvider, // if it must take a access code in the req, do not provide system-keys for Non-nextchat providers
+  );
+
+  const request = Object.assign({}, req, {
+    subpath: params.path.join("/"),
+  });
+
+  return new ProviderTemplate().serverSideRequestHandler(request, config);
+}
+
+export const GET = handle;
+export const POST = handle;
+export const PUT = handle;
+export const PATCH = handle;
+export const DELETE = handle;
+export const OPTIONS = handle;
+
+export const runtime = "edge";
+export const preferredRegion = Array.from(
+  new Set(
+    Object.values(ProviderTemplates).reduce(
+      (arr, t) => [...arr, ...(t.prototype.preferredRegion ?? [])],
+      [] as string[],
+    ),
+  ),
+);

app/client/common/index.ts

@@ -0,0 +1,7 @@
+export * from "./types";
+
+export * from "./locale";
+
+export * from "./utils";
+
+export const modelNameRequestHeader = "x-nextchat-model-name";

app/client/common/locale.ts

@@ -0,0 +1,19 @@
+import { Lang, getLang } from "@/app/locales";
+
+interface PlainConfig {
+  [k: string]: PlainConfig | string;
+}
+
+export type LocaleMap<
+  TextPlainConfig extends PlainConfig,
+  Default extends Lang,
+> = Partial<Record<Lang, TextPlainConfig>> & {
+  [name in Default]: TextPlainConfig;
+};
+
+export function getLocaleText<
+  TextPlainConfig extends PlainConfig,
+  DefaultLang extends Lang,
+>(textMap: LocaleMap<TextPlainConfig, DefaultLang>, defaultLang: DefaultLang) {
+  return textMap[getLang()] || textMap[defaultLang];
+}

app/client/common/types.ts

@@ -0,0 +1,211 @@
+import { RequestMessage } from "../api";
+import { getServerSideConfig } from "@/app/config/server";
+import { NextRequest, NextResponse } from "next/server";
+
+export { type RequestMessage };
+
+// ===================================== LLM Types start ======================================
+
+export interface ModelConfig {
+  temperature: number;
+  top_p: number;
+  presence_penalty: number;
+  frequency_penalty: number;
+  max_tokens: number;
+}
+
+export interface ModelSettings extends Omit<ModelConfig, "max_tokens"> {
+  global_max_tokens: number;
+}
+
+export type ModelTemplate = {
+  name: string; // id of model in a provider
+  displayName: string;
+  isVisionModel?: boolean;
+  isDefaultActive: boolean; // model is initialized to be active
+  isDefaultSelected?: boolean; // model is initialized to be as default used model
+  max_tokens?: number;
+};
+
+export interface Model extends Omit<ModelTemplate, "isDefaultActive"> {
+  providerTemplateName: string;
+  isActive: boolean;
+  providerName: string;
+  available: boolean;
+  customized: boolean; // Only customized model is allowed to be modified
+}
+
+export interface ModelInfo extends Pick<ModelTemplate, "name"> {
+  [k: string]: any;
+}
+
+// ===================================== LLM Types end ======================================
+
+// ===================================== Chat Request Types start ======================================
+
+export interface ChatRequestPayload {
+  messages: RequestMessage[];
+  context: {
+    isApp: boolean;
+  };
+}
+
+export interface StandChatRequestPayload extends ChatRequestPayload {
+  modelConfig: ModelConfig;
+  model: string;
+}
+
+export interface InternalChatRequestPayload<SettingKeys extends string = "">
+  extends StandChatRequestPayload {
+  providerConfig: Partial<Record<SettingKeys, string>>;
+  isVisionModel: Model["isVisionModel"];
+  stream: boolean;
+}
+
+export interface ProviderRequestPayload {
+  headers: Record<string, string>;
+  body: string;
+  url: string;
+  method: string;
+}
+
+export interface InternalChatHandlers {
+  onProgress: (message: string, chunk: string) => void;
+  onFinish: (message: string) => void;
+  onError: (err: Error) => void;
+}
+
+export interface ChatHandlers extends InternalChatHandlers {
+  onProgress: (chunk: string) => void;
+  onFinish: () => void;
+  onFlash: (message: string) => void;
+}
+
+// ===================================== Chat Request Types end ======================================
+
+// ===================================== Chat Response Types start ======================================
+
+export interface StandChatReponseMessage {
+  message: string;
+}
+
+// ===================================== Chat Request Types end ======================================
+
+// ===================================== Provider Settings Types start ======================================
+
+type NumberRange = [number, number];
+
+export type Validator =
+  | "required"
+  | "number"
+  | "string"
+  | NumberRange
+  | NumberRange[]
+  | ((v: any) => Promise<string | void>);
+
+export type CommonSettingItem<SettingKeys extends string> = {
+  name: SettingKeys;
+  title?: string;
+  description?: string;
+  validators?: Validator[];
+};
+
+export type InputSettingItem = {
+  type: "input";
+  placeholder?: string;
+} & (
+  | {
+      inputType?: "password" | "normal";
+      defaultValue?: string;
+    }
+  | {
+      inputType?: "number";
+      defaultValue?: number;
+    }
+);
+
+export type SelectSettingItem = {
+  type: "select";
+  options: {
+    name: string;
+    value: "number" | "string" | "boolean";
+  }[];
+  placeholder?: string;
+};
+
+export type RangeSettingItem = {
+  type: "range";
+  range: NumberRange;
+};
+
+export type SwitchSettingItem = {
+  type: "switch";
+};
+
+export type SettingItem<SettingKeys extends string = ""> =
+  CommonSettingItem<SettingKeys> &
+    (
+      | InputSettingItem
+      | SelectSettingItem
+      | RangeSettingItem
+      | SwitchSettingItem
+    );
+
+// ===================================== Provider Settings Types end ======================================
+
+// ===================================== Provider Template Types start ======================================
+
+export type ServerConfig = ReturnType<typeof getServerSideConfig>;
+
+export interface IProviderTemplate<
+  SettingKeys extends string,
+  NAME extends string,
+  Meta extends Record<string, any>,
+> {
+  readonly name: NAME;
+
+  readonly apiRouteRootName: `/api/provider/${NAME}`;
+
+  readonly allowedApiMethods: Array<
+    "GET" | "POST" | "PUT" | "PATCH" | "DELETE" | "OPTIONS"
+  >;
+
+  readonly metas: Meta;
+
+  readonly providerMeta: {
+    displayName: string;
+    settingItems: SettingItem<SettingKeys>[];
+  };
+  readonly defaultModels: ModelTemplate[];
+
+  streamChat(
+    payload: InternalChatRequestPayload<SettingKeys>,
+    handlers: ChatHandlers,
+    fetch: typeof window.fetch,
+  ): AbortController;
+
+  chat(
+    payload: InternalChatRequestPayload<SettingKeys>,
+    fetch: typeof window.fetch,
+  ): Promise<StandChatReponseMessage>;
+
+  getAvailableModels?(
+    providerConfig: InternalChatRequestPayload<SettingKeys>["providerConfig"],
+  ): Promise<ModelInfo[]>;
+
+  readonly runtime: "edge";
+  readonly preferredRegion: "auto" | "global" | "home" | string | string[];
+
+  serverSideRequestHandler(
+    req: NextRequest & {
+      subpath: string;
+    },
+    serverConfig: ServerConfig,
+  ): Promise<NextResponse>;
+}
+
+export type ProviderTemplate = IProviderTemplate<any, any, any>;
+
+export interface Serializable<Snapshot> {
+  serialize(): Snapshot;
+}