(Admin UI) correctly render provider name in /models with wildcard routing (#7349)

* ui fix - allow searching model list + fix bug on filtering

* qa fix - use correct provider name for azure_text

* ui wrap content onto next line

* ui fix - allow selecting current UI session when logging in

* ui session budgets

* ui show provider models on wildcard models

* test provider name appears in model list

* ui fix auto scroll on chat ui tab
This commit is contained in:
Ishaan Jaff 2024-12-21 14:19:12 -08:00 committed by GitHub
parent a3e732de39
commit 56d9427fdb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 56 additions and 12 deletions

View file

@ -1,4 +1,4 @@
import React, { useState, useEffect } from "react";
import React, { useState, useEffect, useRef } from "react";
import ReactMarkdown from "react-markdown";
import {
Card,
@ -22,8 +22,6 @@ import {
Button,
} from "@tremor/react";
import { message, Select } from "antd";
import { modelAvailableCall } from "./networking";
import openai from "openai";
@ -81,7 +79,6 @@ async function generateModelResponse(
}
}
const ChatUI: React.FC<ChatUIProps> = ({
accessToken,
token,
@ -95,15 +92,15 @@ const ChatUI: React.FC<ChatUIProps> = ({
const [selectedModel, setSelectedModel] = useState<string | undefined>(
undefined
);
const [modelInfo, setModelInfo] = useState<any[]>([]);// Declare modelInfo at the component level
const [modelInfo, setModelInfo] = useState<any[]>([]);
const chatEndRef = useRef<HTMLDivElement>(null);
useEffect(() => {
if (!accessToken || !token || !userRole || !userID) {
return;
}
// Fetch model info and set the default selected model
const fetchModelInfo = async () => {
try {
@ -144,6 +141,13 @@ const ChatUI: React.FC<ChatUIProps> = ({
}, [accessToken, userID, userRole]);
useEffect(() => {
// Scroll to the bottom of the chat whenever chatHistory updates
if (chatEndRef.current) {
chatEndRef.current.scrollIntoView({ behavior: "smooth" });
}
}, [chatHistory]);
const updateUI = (role: string, chunk: string) => {
setChatHistory((prevHistory) => {
const lastMessage = prevHistory[prevHistory.length - 1];
@ -201,7 +205,7 @@ const ChatUI: React.FC<ChatUIProps> = ({
setInputMessage("");
};
if (userRole && userRole == "Admin Viewer") {
if (userRole && userRole === "Admin Viewer") {
const { Title, Paragraph } = Typography;
return (
<div>
@ -295,13 +299,18 @@ const ChatUI: React.FC<ChatUIProps> = ({
</TableCell>
</TableRow>
))}
<TableRow>
<TableCell>
<div ref={chatEndRef} />
</TableCell>
</TableRow>
</TableBody>
</Table>
<div
className="mt-3"
style={{ position: "absolute", bottom: 5, width: "95%" }}
>
<div className="flex">
<div className="flex" style={{ marginTop: "16px" }}>
<TextInput
type="text"
value={inputMessage}