From 056ea68e52f8ff5dc474bf069a91cd7de59c32de Mon Sep 17 00:00:00 2001
From: balibabu <cike8899@users.noreply.github.com>
Date: Fri, 11 Apr 2025 12:37:16 +0800
Subject: [PATCH] Fix: In the dark night theme, the message input box is not
 displayed correctly. #6950 (#6951)

### What problem does this PR solve?

Fix: In the dark night theme, the message input box is not displayed
correctly. #6950

### Type of change


- [x] New Feature (non-breaking change which adds functionality)
---
 web/src/components/message-input/index.less           | 1 -
 web/src/components/message-input/index.tsx            | 7 ++++++-
 web/src/locales/en.ts                                 | 5 ++---
 web/src/pages/chat/chat-configuration-modal/index.tsx | 6 +++---
 4 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/web/src/components/message-input/index.less b/web/src/components/message-input/index.less
index 89ed1b74..ce2ef775 100644
--- a/web/src/components/message-input/index.less
+++ b/web/src/components/message-input/index.less
@@ -1,7 +1,6 @@
 .messageInputWrapper {
   margin-right: 20px;
   padding: '0px 0px 10px 0px';
-  background-color: #ffffff;
   border: 1px solid #d9d9d9;
   &:hover {
     border-color: #40a9ff;
diff --git a/web/src/components/message-input/index.tsx b/web/src/components/message-input/index.tsx
index 529ce73e..95a4ee19 100644
--- a/web/src/components/message-input/index.tsx
+++ b/web/src/components/message-input/index.tsx
@@ -5,6 +5,7 @@ import {
   useRemoveNextDocument,
   useUploadAndParseDocument,
 } from '@/hooks/document-hooks';
+import { cn } from '@/lib/utils';
 import { getExtension } from '@/utils/document-util';
 import { formatBytes } from '@/utils/file-util';
 import {
@@ -222,7 +223,11 @@ const MessageInput = ({
   }, [conversationId, setFileList]);
 
   return (
-    <Flex gap={1} vertical className={styles.messageInputWrapper}>
+    <Flex
+      gap={1}
+      vertical
+      className={cn(styles.messageInputWrapper, 'dark:bg-black')}
+    >
       <TextArea
         size="large"
         placeholder={t('sendPlaceholder')}
diff --git a/web/src/locales/en.ts b/web/src/locales/en.ts
index 95ee90c8..836cfb69 100644
--- a/web/src/locales/en.ts
+++ b/web/src/locales/en.ts
@@ -406,7 +406,7 @@ This auto-tagging feature enhances retrieval by adding another layer of domain-s
       createAssistant: 'Create an Assistant',
       assistantSetting: 'Assistant settings',
       promptEngine: 'Prompt engine',
-      modelSetting: 'Model Setting',
+      modelSetting: 'Model settings',
       chat: 'Chat',
       newChat: 'New chat',
       send: 'Send',
@@ -532,8 +532,7 @@ This auto-tagging feature enhances retrieval by adding another layer of domain-s
       locale: 'Locale',
       selectLanguage: 'Select a language',
       reasoning: 'Reasoning',
-      reasoningTip:
-        `Whether to enable a reasoning workflow during question answering, as seen in models like Deepseek-R1 or OpenAI o1. When enabled, this allows the model to access external knowledge and tackle complex questions in a step-by-step manner, leveraging techniques like chain-of-thought reasoning. This approach enhances the model's ability to provide accurate responses by breaking down problems into manageable steps, improving performance on tasks that require logical reasoning and multi-step thinking.`,
+      reasoningTip: `Whether to enable a reasoning workflow during question answering, as seen in models like Deepseek-R1 or OpenAI o1. When enabled, this allows the model to access external knowledge and tackle complex questions in a step-by-step manner, leveraging techniques like chain-of-thought reasoning. This approach enhances the model's ability to provide accurate responses by breaking down problems into manageable steps, improving performance on tasks that require logical reasoning and multi-step thinking.`,
       tavilyApiKeyTip:
         'If an API key is correctly set here, Tavily-based web searches will be used to supplement knowledge base retrieval.',
       tavilyApiKeyMessage: 'Please enter your Tavily API Key',
diff --git a/web/src/pages/chat/chat-configuration-modal/index.tsx b/web/src/pages/chat/chat-configuration-modal/index.tsx
index 594a69d6..e19996b1 100644
--- a/web/src/pages/chat/chat-configuration-modal/index.tsx
+++ b/web/src/pages/chat/chat-configuration-modal/index.tsx
@@ -37,9 +37,9 @@ const validateMessages = {
 };
 
 enum ConfigurationSegmented {
-  AssistantSetting = 'Assistant settings',
-  PromptEngine = 'Prompt engine',
-  ModelSetting = 'Model settings',
+  AssistantSetting = 'Assistant Setting',
+  PromptEngine = 'Prompt Engine',
+  ModelSetting = 'Model Setting',
 }
 
 const segmentedMap = {