用户页面增加使用token显示

This commit is contained in:
sijinhui 2024-03-01 15:45:12 +08:00
parent 3a5f0b2d0e
commit ae03aa7a23
6 changed files with 95 additions and 32 deletions

View File

@ -4,15 +4,16 @@ import { insertUser } from "@/lib/auth";
// import { getTokenLength } from "@/app/utils/token"; // import { getTokenLength } from "@/app/utils/token";
// import { Tiktoken } from "tiktoken/lite" // import { Tiktoken } from "tiktoken/lite"
// import cl100k_base from "tiktoken/encoders/cl100k_base.json" // import cl100k_base from "tiktoken/encoders/cl100k_base.json"
import "tiktoken"; // import "tiktoken";
import { get_encoding } from "tiktoken"; // import { get_encoding } from "tiktoken";
import { addHours, subMinutes } from "date-fns"; import { addHours, subMinutes } from "date-fns";
import { getTokenLength } from "@/lib/utils";
function getTokenLength(input: string): number { // function getTokenLength(input: string): number {
const encoding = get_encoding("cl100k_base"); // const encoding = get_encoding("cl100k_base");
// console.log('tokens: ', input, encoding.countTokens()) // // console.log('tokens: ', input, encoding.countTokens())
return encoding.encode(input).length; // return encoding.encode(input).length;
} // }
async function handle( async function handle(
req: NextRequest, req: NextRequest,

View File

@ -50,6 +50,7 @@ import {
useAppConfig, useAppConfig,
DEFAULT_TOPIC, DEFAULT_TOPIC,
ModelType, ModelType,
ChatSession,
} from "../store"; } from "../store";
import { import {
@ -101,6 +102,7 @@ import { Button } from "emoji-picker-react/src/components/atoms/Button";
import Image from "next/image"; import Image from "next/image";
import { useAllModels } from "../utils/hooks"; import { useAllModels } from "../utils/hooks";
import { MultimodalContent } from "../client/api"; import { MultimodalContent } from "../client/api";
import { getTokenLength } from "@/lib/utils";
const Markdown = dynamic(async () => (await import("./markdown")).Markdown, { const Markdown = dynamic(async () => (await import("./markdown")).Markdown, {
loading: () => <LoadingIcon />, loading: () => <LoadingIcon />,
@ -350,9 +352,10 @@ function ChatAction(props: {
icon: 16, icon: 16,
}); });
const allModels = useAllModels().map((item) => item.displayName); const allModels = useAllModels().map((item) => item.displayName);
const customModelClassName = allModels.includes(props.text) let customModelClassName = "";
? "chat-input-action-long-weight" if (props.text.includes("使用") || allModels.includes(props.text)) {
: ""; customModelClassName = "chat-input-action-long-weight";
}
function updateWidth() { function updateWidth() {
if (!iconRef.current || !textRef.current) return; if (!iconRef.current || !textRef.current) return;
@ -466,6 +469,7 @@ export function ChatActions(props: {
); );
const [showModelSelector, setShowModelSelector] = useState(false); const [showModelSelector, setShowModelSelector] = useState(false);
const [showUploadImage, setShowUploadImage] = useState(false); const [showUploadImage, setShowUploadImage] = useState(false);
const current_day_token = localStorage.getItem("current_day_token") ?? "";
useEffect(() => { useEffect(() => {
const show = isVisionModel(currentModel); const show = isVisionModel(currentModel);
@ -602,6 +606,22 @@ export function ChatActions(props: {
}} }}
/> />
)} )}
<ChatAction
onClick={() => false}
text={"使用 " + current_day_token}
icon={
<img
alt="😀"
loading="lazy"
width="20"
height="20"
decoding="async"
srcSet="/grinning-face.webp"
style={{ color: "transparent" }}
/>
}
/>
</div> </div>
); );
} }
@ -1643,8 +1663,45 @@ function _Chat() {
); );
} }
function getCurrentDayToken(sessions: ChatSession[]): number {
try {
const currentTime = new Date();
const startOfTheDayInTimeZone = new Date(
currentTime.getFullYear(),
currentTime.getMonth(),
currentTime.getDate(),
0,
0,
0,
);
const current_day_message = sessions
.reduce((acc, item) => {
// @ts-ignore
return acc.concat(item.messages);
}, [])
.filter((item1) => {
// @ts-ignore
const dateToCheck = new Date(item1.date);
return startOfTheDayInTimeZone < dateToCheck;
});
// @ts-ignore
const all_current_day_content = current_day_message
.map((item) => item.content)
.join(" ");
// 获取会话之后再整合content
return getTokenLength(all_current_day_content);
} catch (e) {
return 0;
}
}
export function Chat() { export function Chat() {
const chatStore = useChatStore(); const chatStore = useChatStore();
const sessionIndex = chatStore.currentSessionIndex; const sessionIndex = chatStore.currentSessionIndex;
// 这里计先计算一下当天总token数。
localStorage.setItem(
"current_day_token",
String(getCurrentDayToken(chatStore.sessions)),
);
return <_Chat key={sessionIndex}></_Chat>; return <_Chat key={sessionIndex}></_Chat>;
} }

View File

@ -23,19 +23,19 @@ export function estimateTokenLength(input: string): number {
// import { get_encoding } from "tiktoken"; // import { get_encoding } from "tiktoken";
export function getTokenLength(input: string): number { // export function getTokenLength(input: string): number {
// const { get_encoding } = require( "tiktoken" ); // // const { get_encoding } = require( "tiktoken" );
// const encoding = get_encoding("cl100k_base"); // // const encoding = get_encoding("cl100k_base");
//
const { Tiktoken } = require("tiktoken/lite"); // const { Tiktoken } = require("tiktoken/lite");
const cl100k_base = require("tiktoken/encoders/cl100k_base.json"); // const cl100k_base = require("tiktoken/encoders/cl100k_base.json");
const encoding = new Tiktoken( // const encoding = new Tiktoken(
cl100k_base.bpe_ranks, // cl100k_base.bpe_ranks,
cl100k_base.special_tokens, // cl100k_base.special_tokens,
cl100k_base.pat_str, // cl100k_base.pat_str,
); // );
const tokenLength = encoding.encode(input).length; // const tokenLength = encoding.encode(input).length;
// console.log('[TOKEN],=========', input, tokenLength) // // console.log('[TOKEN],=========', input, tokenLength)
//
return tokenLength; // return tokenLength;
} // }

View File

@ -4,7 +4,8 @@ export const DENY_LIST: string[] = [
] ]
export const ADMIN_LIST: string[] = [ export const ADMIN_LIST: string[] = [
"司金辉", "sijinhui", "sijinhui@qq.com", "司金辉", "sijinhui", "sijinhui@qq.com",
"yuchuan", "于川" "yuchuan", "于川",
"jujujujuju",
] ]

View File

@ -1,9 +1,13 @@
// import { clsx, type ClassValue } from "clsx";
import { twMerge } from "tailwind-merge";
// export function cn(...inputs: ClassValue[]) { import {get_encoding} from "tiktoken";
// return twMerge(clsx(inputs));
// }
export function getTokenLength(input: string): number {
const encoding = get_encoding("cl100k_base");
// console.log('tokens: ', input, encoding.countTokens())
return encoding.encode(input).length;
}
export async function fetcher<JSON = any>( export async function fetcher<JSON = any>(
input: RequestInfo, input: RequestInfo,
init?: RequestInit, init?: RequestInit,

BIN
public/grinning-face.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB