fix: disable new chat during generation

This commit is contained in:
Jing Hua 2023-03-26 13:46:55 +08:00
parent dcea49d6ad
commit 17b6fc91fb
3 changed files with 29 additions and 6 deletions

View file

@ -54,9 +54,9 @@ const ShowMoreButton = () => {
const ChatHistoryClass = {
normal:
'flex py-3 px-3 items-center gap-3 relative rounded-md hover:bg-[#2A2B32] break-all hover:pr-4 group',
'flex py-3 px-3 items-center gap-3 relative rounded-md hover:bg-[#2A2B32] break-all hover:pr-4 group transition-opacity',
active:
'flex py-3 px-3 items-center gap-3 relative rounded-md break-all pr-14 bg-gray-800 hover:bg-gray-800 group',
'flex py-3 px-3 items-center gap-3 relative rounded-md break-all pr-14 bg-gray-800 hover:bg-gray-800 group transition-opacity',
normalGradient:
'absolute inset-y-0 right-0 w-8 z-10 bg-gradient-to-l from-gray-900 group-hover:from-[#2A2B32]',
activeGradient:
@ -110,7 +110,11 @@ const ChatHistory = React.memo(
<a
className={`${
active ? ChatHistoryClass.active : ChatHistoryClass.normal
} ${generating ? 'cursor-not-allowed' : 'cursor-pointer'}`}
} ${
generating
? 'cursor-not-allowed opacity-40'
: 'cursor-pointer opacity-100'
}`}
onClick={() => {
if (!generating) setCurrentChatIndex(chatIndex);
}}

View file

@ -1,5 +1,6 @@
import React from 'react';
import { useTranslation } from 'react-i18next';
import useStore from '@store/store';
import PlusIcon from '@icon/PlusIcon';
@ -8,11 +9,18 @@ import useAddChat from '@hooks/useAddChat';
const NewChat = () => {
const { t } = useTranslation();
const addChat = useAddChat();
const generating = useStore((state) => state.generating);
return (
<a
className='max-md:hidden flex py-3 px-3 items-center gap-3 rounded-md hover:bg-gray-500/10 transition-colors duration-200 text-white cursor-pointer text-sm md:mb-2 flex-shrink-0 md:border md:border-white/20'
onClick={addChat}
className={`max-md:hidden flex py-3 px-3 items-center gap-3 rounded-md hover:bg-gray-500/10 transition-colors duration-200 text-white text-sm md:mb-2 flex-shrink-0 md:border md:border-white/20 transition-opacity ${
generating
? 'cursor-not-allowed opacity-40'
: 'cursor-pointer opacity-100'
}`}
onClick={() => {
if (!generating) addChat;
}}
>
<PlusIcon />{' '}
<span className='hidden md:inline-flex text-white text-sm'>

View file

@ -5,6 +5,7 @@ import PlusIcon from '@icon/PlusIcon';
import useAddChat from '@hooks/useAddChat';
const MobileBar = () => {
const generating = useStore((state) => state.generating);
const chatTitle = useStore((state) =>
state.chats &&
state.chats.length > 0 &&
@ -48,7 +49,17 @@ const MobileBar = () => {
</svg>
</button>
<h1 className='flex-1 text-center text-base font-normal'>{chatTitle}</h1>
<button type='button' className='px-3 text-gray-400' onClick={addChat}>
<button
type='button'
className={`px-3 text-gray-400 transition-opacity ${
generating
? 'cursor-not-allowed opacity-40'
: 'cursor-pointer opacity-100'
}`}
onClick={() => {
if (!generating) addChat();
}}
>
<PlusIcon className='h-6 w-6' />
</button>
</div>