Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2026-02-09 11:04:23 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: show icon within model select menu

Browse source 
fix: use icon for gptCustom
This commit is contained in:
Wentao Lyu 2023-03-15 14:21:08 +08:00
parent 54aa9debb4
commit 5d0b849930
7 changed files with 80 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

57
client/src/utils/index.js
View file

@ -1,5 +1,8 @@
import { clsx } from 'clsx';
import React from 'react';
import { twMerge } from 'tailwind-merge';
import GPTIcon from '../components/svg/GPTIcon';
import BingIcon from '../components/svg/BingIcon';
export function cn(...inputs) {
return twMerge(clsx(inputs));
@ -42,3 +45,57 @@ export const wrapperRegex = {
languageMatch: /^```(\w+)/,
newLineMatch: /^```(\n+)/
};
export const getIconOfModel = ({ size=30, sender, isCreatedByUser, model, chatGptLabel, error, ...props }) => {
const bgColors = {
chatgpt: 'rgb(16, 163, 127)',
chatgptBrowser: 'rgb(25, 207, 207)',
bingai: 'transparent',
sydney: 'radial-gradient(circle at 90% 110%, #F0F0FA, #D0E0F9)',
chatgptCustom: 'rgb(0, 163, 255)',
};
if (isCreatedByUser)
return (
<div
title='User'
style={{ background: 'radial-gradient(circle at 90% 110%, rgb(1 43 128), rgb(17, 139, 161))', color: 'white', fontSize: 12 }}
className={`relative flex h-[${size}px] w-[${size}px] items-center justify-center rounded-sm p-1 text-white ` + props?.className}
>
User
</div>
)
else if (!isCreatedByUser) {
// TODO: use model from convo, rather than submit
// const { model, chatGptLabel, promptPrefix } = convo;
console.log(model, chatGptLabel)
let background = bgColors[model];
const isBing = model === 'bingai' || model === 'sydney';
return (
<div
title={chatGptLabel || model}
style={
{ background } || { background: 'radial-gradient(circle at 90% 110%, #F0F0FA, #D0E0F9)' }
}
className={`relative flex h-[${size}px] w-[${size}px] items-center justify-center rounded-sm p-1 text-white ` + props?.className}
>
{isBing ? <BingIcon size={size} /> : <GPTIcon size={size} />}
{error && (
<span className="absolute right-0 top-[20px] -mr-2 flex h-4 w-4 items-center justify-center rounded-full border border-white bg-red-500 text-[10px] text-white">
!
</span>
)}
</div>
);
} else
return (
<div
title='User'
style={{ background: 'radial-gradient(circle at 90% 110%, rgb(1 43 128), rgb(17, 139, 161))', color: 'white', fontSize: 12 }}
className={`relative flex h-[${size}px] w-[${size}px] items-center justify-center rounded-sm p-1 text-white ` + props?.className}
>
{chatGptLabel}
</div>
)
}