fix: input chat input wrong padding (#8207)

This commit is contained in:
Joel 2024-09-10 17:01:32 +08:00 committed by GitHub
parent 2cf1187b32
commit d1605952b0
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 13 additions and 3 deletions

View File

@ -129,6 +129,7 @@ const ChatItem: FC<ChatItemProps> = ({
questionIcon={<Avatar name={userProfile.name} size={40} />}
allToolIcons={allToolIcons}
hideLogModal
noSpacing
/>
)
}

View File

@ -128,6 +128,7 @@ const DebugWithMultipleModel = () => {
onSend={handleSend}
speechToTextConfig={speechToTextConfig}
visionConfig={visionConfig}
noSpacing
/>
</div>
)

View File

@ -130,6 +130,7 @@ const DebugWithSingleModel = forwardRef<DebugWithSingleModelRefType, DebugWithSi
onAnnotationEdited={handleAnnotationEdited}
onAnnotationAdded={handleAnnotationAdded}
onAnnotationRemoved={handleAnnotationRemoved}
noSpacing
/>
)
})

View File

@ -32,18 +32,21 @@ import {
useDraggableUploader,
useImageFiles,
} from '@/app/components/base/image-uploader/hooks'
import cn from '@/utils/classnames'
type ChatInputProps = {
visionConfig?: VisionConfig
speechToTextConfig?: EnableType
onSend?: OnSend
theme?: Theme | null
noSpacing?: boolean
}
const ChatInput: FC<ChatInputProps> = ({
visionConfig,
speechToTextConfig,
onSend,
theme,
noSpacing,
}) => {
const { appData } = useChatWithHistoryContext()
const { t } = useTranslation()
@ -146,7 +149,7 @@ const ChatInput: FC<ChatInputProps> = ({
return (
<>
<div className='relative'>
<div className={cn('relative', !noSpacing && 'px-8')}>
<div
className={`
p-[5.5px] max-h-[150px] bg-white border-[1.5px] border-gray-200 rounded-xl overflow-y-auto
@ -193,7 +196,7 @@ const ChatInput: FC<ChatInputProps> = ({
onDrop={onDrop}
autoSize
/>
<div className='absolute bottom-[7px] right-2 flex items-center h-8'>
<div className={cn('absolute bottom-[7px] flex items-center h-8', noSpacing ? 'right-2' : 'right-10')}>
<div className='flex items-center px-1 h-5 rounded-md bg-gray-100 text-xs font-medium text-gray-500'>
{query.trim().length}
</div>

View File

@ -60,6 +60,7 @@ export type ChatProps = {
hideProcessDetail?: boolean
hideLogModal?: boolean
themeBuilder?: ThemeBuilder
noSpacing?: boolean
}
const Chat: FC<ChatProps> = ({
@ -89,6 +90,7 @@ const Chat: FC<ChatProps> = ({
hideProcessDetail,
hideLogModal,
themeBuilder,
noSpacing,
}) => {
const { t } = useTranslation()
const { currentLogItem, setCurrentLogItem, showPromptLogModal, setShowPromptLogModal, showAgentLogModal, setShowAgentLogModal } = useAppStore(useShallow(state => ({
@ -197,7 +199,7 @@ const Chat: FC<ChatProps> = ({
{chatNode}
<div
ref={chatContainerInnerRef}
className={`w-full ${chatContainerInnerClassName}`}
className={classNames('w-full', !noSpacing && 'px-8', chatContainerInnerClassName)}
>
{
chatList.map((item, index) => {
@ -268,6 +270,7 @@ const Chat: FC<ChatProps> = ({
speechToTextConfig={config?.speech_to_text}
onSend={onSend}
theme={themeBuilder?.theme}
noSpacing={noSpacing}
/>
)
}

View File

@ -118,6 +118,7 @@ const ChatWrapper = forwardRef<ChatWrapperRefType, ChatWrapperProps>(({ showConv
}
</>
)}
noSpacing
suggestedQuestions={suggestedQuestions}
showPromptLog
chatAnswerContainerInner='!pr-2'