Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-17 17:00:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 7

feat(chatgpt-browser): add support for multiple GPT models

Browse source 
This commit adds support for multiple GPT models in the chatGPT-browser
client. The available models are now stored in a Map object, which maps
the model label to its corresponding model.

The commit adds a new component, ChatGPTOptions, to the client
UI to allow the user to select the GPT model to use in the chat. The
component is only displayed when the chatGPT-browser endpoint is
selected.
This commit is contained in:
Daniel Avila 2023-04-02 14:34:12 -04:00
parent eef2303c8e
commit aa4fd57459
9 changed files with 69 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

50
client/src/components/Input/ChatGPTOptions/index.jsx Normal file
View file

@ -0,0 +1,50 @@
import React, { useEffect } from 'react';
import { useRecoilState } from 'recoil';
import ModelDropDown from '../../ui/ModelDropDown.jsx';
import { cn } from '~/utils/';
import store from '~/store';
function ChatGPTOptions() {
const [conversation, setConversation] = useRecoilState(store.conversation) || {};
const { endpoint, conversationId } = conversation;
const { model } = conversation;
console.log('ChatGPTOptions', endpoint, model);
useEffect(() => {
if (endpoint !== 'chatGPTBrowser') return;
}, [conversation]);
if (endpoint !== 'chatGPTBrowser') return null;
if (conversationId !== 'new') return null;
const setOption = param => newValue => {
let update = {};
update[param] = newValue;
setConversation(prevState => ({
...prevState,
...update
}));
};
const cardStyle =
'transition-colors shadow-md rounded-md min-w-[75px] font-normal bg-white border-black/10 hover:border-black/10 focus:border-black/10 dark:border-black/10 dark:hover:border-black/10 dark:focus:border-black/10 border dark:bg-gray-700 text-black dark:text-white';
return (
<div className="openAIOptions-simple-container flex w-full items-center justify-center gap-2 show">
<ModelDropDown
model={model}
setModel={setOption('model')}
endpoint="chatGPTBrowser"
showAbove={true}
showLabel={false}
className={cn(
cardStyle,
'min-w-48 z-50 flex h-[40px] w-48 items-center justify-center px-4 ring-0 hover:cursor-pointer hover:bg-slate-50 focus:ring-0 focus:ring-offset-0 data-[state=open]:bg-slate-50 dark:bg-gray-700 dark:hover:bg-gray-600 dark:data-[state=open]:bg-gray-600'
)}
/>
</div>
);
}
export default ChatGPTOptions;