hotfix
This commit is contained in:
		
							parent
							
								
									cec0735403
								
							
						
					
					
						commit
						5bffa8b0c9
					
				|  | @ -70,34 +70,47 @@ export const ChatInput: FC<Props> = ({ onSend, messageIsStreaming, model }) => { | ||||||
|   return ( |   return ( | ||||||
|     <div className="absolute bottom-0 left-0 w-full border-t md:border-t-0 dark:border-white/20 md:border-transparent md:dark:border-transparent dark:bg-[#444654] md:dark:bg-gradient-to-t from-[#343541] via-[#343541] to-[#343541]/0 bg-white md:dark:!bg-transparent dark:md:bg-vert-dark-gradient pt-2"> |     <div className="absolute bottom-0 left-0 w-full border-t md:border-t-0 dark:border-white/20 md:border-transparent md:dark:border-transparent dark:bg-[#444654] md:dark:bg-gradient-to-t from-[#343541] via-[#343541] to-[#343541]/0 bg-white md:dark:!bg-transparent dark:md:bg-vert-dark-gradient pt-2"> | ||||||
|       <div className="stretch mx-2 md:mt-[52px] mt-4 flex flex-row gap-3 last:mb-2 md:mx-4 md:last:mb-6 lg:mx-auto lg:max-w-3xl"> |       <div className="stretch mx-2 md:mt-[52px] mt-4 flex flex-row gap-3 last:mb-2 md:mx-4 md:last:mb-6 lg:mx-auto lg:max-w-3xl"> | ||||||
|           <div className="flex flex-col w-full py-2 flex-grow md:py-3 md:pl-4 relative border border-black/10 bg-white dark:border-gray-900/50 dark:text-white dark:bg-[#40414F] rounded-md shadow-[0_0_10px_rgba(0,0,0,0.10)] dark:shadow-[0_0_15px_rgba(0,0,0,0.10)]"> |         <div className="flex flex-col w-full py-2 flex-grow md:py-3 md:pl-4 relative border border-black/10 bg-white dark:border-gray-900/50 dark:text-white dark:bg-[#40414F] rounded-md shadow-[0_0_10px_rgba(0,0,0,0.10)] dark:shadow-[0_0_15px_rgba(0,0,0,0.10)]"> | ||||||
|       <textarea |           <textarea | ||||||
|         ref={textareaRef} |             ref={textareaRef} | ||||||
|         className="text-base m-0 w-full resize-none outline-none border-0 bg-transparent p-0 pr-7 focus:ring-0 focus-visible:ring-0 dark:bg-transparent pl-2 md:pl-0" |             className="text-black dark:text-white m-0 w-full resize-none outline-none border-0 bg-transparent p-0 pr-7 focus:ring-0 focus-visible:ring-0 dark:bg-transparent pl-2 md:pl-0" | ||||||
|         style={{ |             style={{ | ||||||
|           resize: "none", |               resize: "none", | ||||||
|           bottom: `${textareaRef?.current?.scrollHeight}px`, |               bottom: `${textareaRef?.current?.scrollHeight}px`, | ||||||
|           maxHeight: "400px", |               maxHeight: "400px", | ||||||
|           overflow: `${textareaRef.current && textareaRef.current.scrollHeight > 400 ? "auto" : "hidden"}` |               overflow: `${textareaRef.current && textareaRef.current.scrollHeight > 400 ? "auto" : "hidden"}` | ||||||
|         }} |             }} | ||||||
|         placeholder="Type a message..." |             placeholder="Type a message..." | ||||||
|         value={content} |             value={content} | ||||||
|         rows={1} |             rows={1} | ||||||
|         onCompositionStart={() => setIsTyping(true)} |             onCompositionStart={() => setIsTyping(true)} | ||||||
|         onCompositionEnd={() => setIsTyping(false)} |             onCompositionEnd={() => setIsTyping(false)} | ||||||
|         onChange={handleChange} |             onChange={handleChange} | ||||||
|         onKeyDown={handleKeyDown} |             onKeyDown={handleKeyDown} | ||||||
|       /> |           /> | ||||||
| 
 | 
 | ||||||
|       <button |           <button | ||||||
|         className="absolute right-5 focus:outline-none text-neutral-800 hover:text-neutral-900 dark:text-neutral-100 dark:hover:text-neutral-200 dark:bg-opacity-50 hover:bg-neutral-200 p-1 rounded-sm" |             className="absolute right-5 focus:outline-none text-neutral-800 hover:text-neutral-900 dark:text-neutral-100 dark:hover:text-neutral-200 dark:bg-opacity-50 hover:bg-neutral-200 p-1 rounded-sm" | ||||||
|         onClick={handleSend} |             onClick={handleSend} | ||||||
|       > |           > | ||||||
|         <IconSend size={16} className="opacity-60"/> |             <IconSend | ||||||
|       </button> |               size={16} | ||||||
|  |               className="opacity-60" | ||||||
|  |             /> | ||||||
|  |           </button> | ||||||
|  |         </div> | ||||||
|       </div> |       </div> | ||||||
|  |       <div className="px-3 pt-2 pb-3 text-center text-xs text-black/50 dark:text-white/50 md:px-4 md:pt-3 md:pb-6"> | ||||||
|  |         <a | ||||||
|  |           href="https://github.com/mckaywrigley/chatbot-ui" | ||||||
|  |           target="_blank" | ||||||
|  |           rel="noreferrer" | ||||||
|  |           className="underline" | ||||||
|  |         > | ||||||
|  |           ChatBot UI | ||||||
|  |         </a> | ||||||
|  |         . Chatbot UI is an advanced chatbot kit for OpenAI's chat models aiming to mimic ChatGPT's interface and functionality. | ||||||
|       </div> |       </div> | ||||||
|       <div className="px-3 pt-2 pb-3 text-center text-xs text-black/50 dark:text-white/50 md:px-4 md:pt-3 md:pb-6"><a href="https://github.com/mckaywrigley/chatbot-ui" target="_blank" rel="noreferrer" className="underline">ChatBot UI</a>. Chatbot UI is an advanced chatbot kit for OpenAI's chat models aiming to mimic ChatGPT's interface and functionality.</div> |  | ||||||
|     </div> |     </div> | ||||||
|   ); |   ); | ||||||
| }; | }; | ||||||
|  |  | ||||||
|  | @ -170,6 +170,7 @@ export default function Home() { | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     setModels(data); |     setModels(data); | ||||||
|  |     setModelError(false); | ||||||
|   }; |   }; | ||||||
| 
 | 
 | ||||||
|   const handleLightMode = (mode: "dark" | "light") => { |   const handleLightMode = (mode: "dark" | "light") => { | ||||||
|  | @ -271,6 +272,10 @@ export default function Home() { | ||||||
|     } |     } | ||||||
|   }, [selectedConversation]); |   }, [selectedConversation]); | ||||||
| 
 | 
 | ||||||
|  |   useEffect(() => { | ||||||
|  |     fetchModels(apiKey); | ||||||
|  |   }, [apiKey]); | ||||||
|  | 
 | ||||||
|   useEffect(() => { |   useEffect(() => { | ||||||
|     const theme = localStorage.getItem("theme"); |     const theme = localStorage.getItem("theme"); | ||||||
|     if (theme) { |     if (theme) { | ||||||
|  |  | ||||||
		Loading…
	
		Reference in New Issue