diff --git a/src/Chat.tsx b/src/Chat.tsx index 88025d2..63f02aa 100644 --- a/src/Chat.tsx +++ b/src/Chat.tsx @@ -57,6 +57,11 @@ export interface ChatProps extends PropsWithChildren { */ isLoading?: boolean; + /** + * Whether to disable the chat. + */ + disabled?: boolean; + /** * Callback function to handle when a session is selected. */ @@ -84,6 +89,7 @@ export const Chat: FC = ({ theme: customTheme = chatTheme, onNewSession, remarkPlugins, + disabled, style, className }) => { @@ -140,6 +146,7 @@ export const Chat: FC = ({ activeSession, remarkPlugins, theme, + disabled, isLoading, activeSessionId: internalActiveSessionID, selectSession: handleSelectSession, @@ -148,6 +155,7 @@ export const Chat: FC = ({ }), [ isLoading, + disabled, theme, remarkPlugins, sessions, diff --git a/src/ChatContext.ts b/src/ChatContext.ts index 079ac7c..64cb960 100644 --- a/src/ChatContext.ts +++ b/src/ChatContext.ts @@ -5,6 +5,7 @@ import { PluggableList } from 'react-markdown/lib'; export interface ChatContextProps { sessions: Session[]; + disabled?: boolean; activeSessionId: string | null; theme?: ChatTheme; isLoading?: boolean; diff --git a/src/ChatInput.tsx b/src/ChatInput.tsx index d88e867..c618c26 100644 --- a/src/ChatInput.tsx +++ b/src/ChatInput.tsx @@ -71,7 +71,7 @@ export const ChatInput: FC = ({ stopIcon = , attachIcon = }) => { - const { theme, isLoading } = useContext(ChatContext); + const { theme, isLoading, disabled } = useContext(ChatContext); const [message, setMessage] = useState(''); const fileInputRef = useRef(null); @@ -107,7 +107,7 @@ export const ChatInput: FC = ({ defaultValue={defaultValue} onKeyPress={handleKeyPress} placeholder={placeholder} - disabled={isLoading} + disabled={isLoading || disabled} /> {allowedFiles?.length > 0 && ( <> @@ -120,6 +120,7 @@ export const ChatInput: FC = ({ /> @@ -140,7 +142,7 @@ export const ChatInput: FC = ({ title="Send" className={cn(theme.input.send)} onClick={handleSendMessage} - disabled={isLoading} + disabled={isLoading || disabled} > {sendIcon} diff --git a/src/SessionsList/NewSessionButton.tsx b/src/SessionsList/NewSessionButton.tsx index 0de1daa..a4cae5a 100644 --- a/src/SessionsList/NewSessionButton.tsx +++ b/src/SessionsList/NewSessionButton.tsx @@ -14,7 +14,7 @@ export const NewSessionButton: FC = ({ children, newSessionText = 'New Session' }) => { - const { theme, createSession } = useContext(ChatContext); + const { theme, createSession, disabled } = useContext(ChatContext); const Comp = children ? Slot : Button; return ( @@ -23,6 +23,7 @@ export const NewSessionButton: FC = ({ disableMargins color="primary" className={cn(theme.sessions.create)} + disabled={disabled} onClick={createSession} > {children || newSessionText} diff --git a/stories/Demos.stories.tsx b/stories/Demos.stories.tsx index 12e887b..b74d8f8 100644 --- a/stories/Demos.stories.tsx +++ b/stories/Demos.stories.tsx @@ -1176,6 +1176,7 @@ export const OpenAIIntegration = () => { viewType="console" sessions={sessions} isLoading={isLoading} + disabled={!apiKey} onDeleteSession={handleDeleteSession} onSendMessage={handleNewMessage} activeSessionId={activeSessionId}