From 5a8d2ec4919c90b79aa6af82e13dcafc99c3f3d1 Mon Sep 17 00:00:00 2001 From: gray Date: Thu, 5 Dec 2024 17:02:02 +0800 Subject: [PATCH] no model ui --- src/FE/components/Chat/Chat.tsx | 50 +++++++++---------- src/FE/components/Chat/ChatError.tsx | 2 +- src/FE/components/Chat/NoModel.tsx | 27 ++++++++++ src/FE/components/Icons/index.tsx | 39 +++++++++++---- src/FE/components/Markdown/CodeBlock.tsx | 2 +- .../Promptbar/components/Prompt.tsx | 1 - src/FE/components/Sidebar/Sidebar.tsx | 6 +-- src/FE/locales/zh-CN.json | 5 +- src/FE/pages/globals.css | 2 +- 9 files changed, 91 insertions(+), 43 deletions(-) create mode 100644 src/FE/components/Chat/NoModel.tsx diff --git a/src/FE/components/Chat/Chat.tsx b/src/FE/components/Chat/Chat.tsx index 88788cc6..e3a912bc 100644 --- a/src/FE/components/Chat/Chat.tsx +++ b/src/FE/components/Chat/Chat.tsx @@ -33,6 +33,7 @@ import { HomeContext } from '@/contexts/Home.context'; import { cn } from '@/lib/utils'; import Decimal from 'decimal.js'; import { v4 as uuidv4 } from 'uuid'; +import NoModel from './NoModel'; interface Props { stopConversationRef: MutableRefObject; @@ -377,33 +378,31 @@ export const Chat = memo(({ stopConversationRef }: Props) => { ref={chatContainerRef} onScroll={handleScroll} > - {selectChat?.id && ( -
-
-
- {hasModel() && ( - { - homeDispatch({ - field: 'selectModel', - value: model, - }); - putUserChatModel(selectChat.id, model.modelId); - }} - /> - )} -
-
{}
+
+
+
+ {hasModel() && ( + { + homeDispatch({ + field: 'selectModel', + value: model, + }); + putUserChatModel(selectChat.id, model.modelId); + }} + /> + )}
+
{}
- )} +
{selectMessages?.length === 0 ? ( <>
@@ -542,6 +541,7 @@ export const Chat = memo(({ stopConversationRef }: Props) => { onChangePrompt={onChangePrompt} /> )} + {!hasModel() && }
); diff --git a/src/FE/components/Chat/ChatError.tsx b/src/FE/components/Chat/ChatError.tsx index b567c12c..bff8db98 100644 --- a/src/FE/components/Chat/ChatError.tsx +++ b/src/FE/components/Chat/ChatError.tsx @@ -27,7 +27,7 @@ const ChatError = (props: Props) => { className="bg-background my-2 mt-0 border-none p-0 px-1 pt-1" > - + {errorMessage()} diff --git a/src/FE/components/Chat/NoModel.tsx b/src/FE/components/Chat/NoModel.tsx new file mode 100644 index 00000000..0bb7c01b --- /dev/null +++ b/src/FE/components/Chat/NoModel.tsx @@ -0,0 +1,27 @@ +import useTranslation from '@/hooks/useTranslation'; + +import { IconModelSearch } from '../Icons'; + +const NoModel = () => { + const { t } = useTranslation(); + + return ( +
+
+
+ +
+
+

+ {t("There's no model here")} +

+

+ {t('You can contact the administrator or create one yourself')} +

+
+
+
+ ); +}; + +export default NoModel; diff --git a/src/FE/components/Icons/index.tsx b/src/FE/components/Icons/index.tsx index 71a5365d..9310c591 100644 --- a/src/FE/components/Icons/index.tsx +++ b/src/FE/components/Icons/index.tsx @@ -628,7 +628,7 @@ const IconBulbFilled = (props: IconProps) => { ); }; -const IconMistOff = (props: IconProps) => { +const IconSearch = (props: IconProps) => { const { className, size = 20, strokeWidth = 2, stroke, onClick } = props; return ( @@ -645,14 +645,8 @@ const IconMistOff = (props: IconProps) => { strokeLinecap="round" strokeLinejoin="round" > - - - - - - - - + + ); }; @@ -1473,6 +1467,30 @@ var IconLoader = (props: IconProps) => { ); }; +var IconModelSearch = (props: IconProps) => { + const { className, size = 20, strokeWidth = 2, stroke, onClick } = props; + + return ( + + + + + + + ); +}; var Icon = (props: IconProps) => { const { className, size = 20, strokeWidth = 2, stroke, onClick } = props; @@ -1516,7 +1534,7 @@ export { IconX, IconClipboard, IconBulbFilled, - IconMistOff, + IconSearch, IconPlus, IconSquareRoundedX, IconChartPie, @@ -1547,4 +1565,5 @@ export { IconSun, IconMoon, IconLoader, + IconModelSearch, }; diff --git a/src/FE/components/Markdown/CodeBlock.tsx b/src/FE/components/Markdown/CodeBlock.tsx index f320245f..7d631607 100644 --- a/src/FE/components/Markdown/CodeBlock.tsx +++ b/src/FE/components/Markdown/CodeBlock.tsx @@ -31,7 +31,7 @@ export const CodeBlock: FC = memo(({ language, value }) => { return (
-
+
{language}
diff --git a/src/FE/components/Promptbar/components/Prompt.tsx b/src/FE/components/Promptbar/components/Prompt.tsx index 0e185bf8..c7b4d480 100644 --- a/src/FE/components/Promptbar/components/Prompt.tsx +++ b/src/FE/components/Promptbar/components/Prompt.tsx @@ -6,7 +6,6 @@ import SidebarActionButton from '@/components/Button/SidebarActionButton'; import { IconBulbFilled, IconCheck, - IconMistOff, IconTrash, IconX, } from '@/components/Icons/index'; diff --git a/src/FE/components/Sidebar/Sidebar.tsx b/src/FE/components/Sidebar/Sidebar.tsx index 11f36044..5e999488 100644 --- a/src/FE/components/Sidebar/Sidebar.tsx +++ b/src/FE/components/Sidebar/Sidebar.tsx @@ -5,7 +5,7 @@ import useTranslation from '@/hooks/useTranslation'; import { IconLayoutSidebar, IconLayoutSidebarRight, - IconMistOff, + IconSearch, IconSquarePlus, } from '@/components/Icons/index'; import Search from '@/components/Search'; @@ -102,8 +102,8 @@ const Sidebar = ({ {items?.length > 0 ? (
{itemComponent}
) : ( -
- +
+ {t('No data')}
)} diff --git a/src/FE/locales/zh-CN.json b/src/FE/locales/zh-CN.json index 37124370..21c384d6 100644 --- a/src/FE/locales/zh-CN.json +++ b/src/FE/locales/zh-CN.json @@ -356,5 +356,8 @@ "File Count": "文件数量", "File is empty.": "文件为空。", "File is too large.": "文件过大。", - "Invalid file name.": "无效的文件名。" + "Invalid file name.": "无效的文件名。", + + "There's no model here": "这里没有模型", + "You can contact the administrator or create one yourself": "你可以联系管理员或者自己创建一个" } diff --git a/src/FE/pages/globals.css b/src/FE/pages/globals.css index 17255b9f..1512be8b 100644 --- a/src/FE/pages/globals.css +++ b/src/FE/pages/globals.css @@ -117,7 +117,7 @@ html { max-width: 100ch !important; } -.prose > pre { +.prose pre { padding: 0; }