diff --git a/README.md b/README.md
index 17b55b0..1cd00b4 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,8 @@
-# Chatbot UI
+# ChatUI
 
-Chatbot UI is an open source chat UI for AI models.
+Another ChatUI for ChimeraGPT + Poe models.
 
-![Chatbot UI](./public/screenshots/screenshot-0402023.jpg)
+![Chatbot UI](./public/screenshots/SUS.jpg)
 
 
 
diff --git a/components/Chat/Chat.tsx b/components/Chat/Chat.tsx
index fa6b69d..1c50056 100644
--- a/components/Chat/Chat.tsx
+++ b/components/Chat/Chat.tsx
@@ -355,34 +355,21 @@ export const Chat = memo(({ stopConversationRef }: Props) => {
             Welcome to Chatbot UI
           </div>
           <div className="text-center text-lg text-black dark:text-white">
-            <div className="mb-8">{`Chatbot UI is an open source clone of OpenAI's ChatGPT UI.`}</div>
-            <div className="mb-2 font-bold">
-              Important: Chatbot UI is 100% unaffiliated with OpenAI.
-            </div>
-          </div>
-          <div className="text-center text-gray-500 dark:text-gray-400">
-            <div className="mb-2">
-              Chatbot UI allows you to plug in your API key to use this UI with
-              their API.
-            </div>
-            <div className="mb-2">
-              It is <span className="italic">only</span> used to communicate
-              with their API.
-            </div>
+            <div className="mb-8">{`Another ChatUI for ChimeraGPT with Poe models.`}</div>
             <div className="mb-2">
               {t(
-                'Please set your OpenAI API key in the bottom left of the sidebar.',
+                'Please set your ChimeraAPI key by placing it in "OpenAI API Key" textbox located in the bottom left of the sidebar.',
               )}
             </div>
             <div>
-              {t("If you don't have an OpenAI API key, you can get one here: ")}
+              {t("If you don't have an ChimeraAPI key, you can get one here: ")}
               <a
-                href="https://platform.openai.com/account/api-keys"
+                href="https://discord.gg/pCTprCYhuV"
                 target="_blank"
                 rel="noreferrer"
                 className="text-blue-500 hover:underline"
               >
-                openai.com
+                Discord Server
               </a>
             </div>
           </div>
@@ -405,7 +392,7 @@ export const Chat = memo(({ stopConversationRef }: Props) => {
                         <Spinner size="16px" className="mx-auto" />
                       </div>
                     ) : (
-                      'Chatbot UI'
+                      ''
                     )}
                   </div>
 
diff --git a/components/Chat/ChatInput.tsx b/components/Chat/ChatInput.tsx
index 64f8df6..84e6c15 100644
--- a/components/Chat/ChatInput.tsx
+++ b/components/Chat/ChatInput.tsx
@@ -1,398 +1,398 @@
-import {
-  IconArrowDown,
-  IconBolt,
-  IconBrandGoogle,
-  IconPlayerStop,
-  IconRepeat,
-  IconSend,
-} from '@tabler/icons-react';
-import {
-  KeyboardEvent,
-  MutableRefObject,
-  useCallback,
-  useContext,
-  useEffect,
-  useRef,
-  useState,
-} from 'react';
-
-import { useTranslation } from 'next-i18next';
-
-import { Message } from '@/types/chat';
-import { Plugin } from '@/types/plugin';
-import { Prompt } from '@/types/prompt';
-
-import HomeContext from '@/pages/api/home/home.context';
-
-import { PluginSelect } from './PluginSelect';
-import { PromptList } from './PromptList';
-import { VariableModal } from './VariableModal';
-
-interface Props {
-  onSend: (message: Message, plugin: Plugin | null) => void;
-  onRegenerate: () => void;
-  onScrollDownClick: () => void;
-  stopConversationRef: MutableRefObject<boolean>;
-  textareaRef: MutableRefObject<HTMLTextAreaElement | null>;
-  showScrollDownButton: boolean;
-}
-
-export const ChatInput = ({
-  onSend,
-  onRegenerate,
-  onScrollDownClick,
-  stopConversationRef,
-  textareaRef,
-  showScrollDownButton,
-}: Props) => {
-  const { t } = useTranslation('chat');
-
-  const {
-    state: { selectedConversation, messageIsStreaming, prompts },
-
-    dispatch: homeDispatch,
-  } = useContext(HomeContext);
-
-  const [content, setContent] = useState<string>();
-  const [isTyping, setIsTyping] = useState<boolean>(false);
-  const [showPromptList, setShowPromptList] = useState(false);
-  const [activePromptIndex, setActivePromptIndex] = useState(0);
-  const [promptInputValue, setPromptInputValue] = useState('');
-  const [variables, setVariables] = useState<string[]>([]);
-  const [isModalVisible, setIsModalVisible] = useState(false);
-  const [showPluginSelect, setShowPluginSelect] = useState(false);
-  const [plugin, setPlugin] = useState<Plugin | null>(null);
-
-  const promptListRef = useRef<HTMLUListElement | null>(null);
-
-  const filteredPrompts = prompts.filter((prompt) =>
-    prompt.name.toLowerCase().includes(promptInputValue.toLowerCase()),
-  );
-
-  const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
-    const value = e.target.value;
-    const maxLength = selectedConversation?.model.maxLength;
-
-    if (maxLength && value.length > maxLength) {
-      alert(
-        t(
-          `Message limit is {{maxLength}} characters. You have entered {{valueLength}} characters.`,
-          { maxLength, valueLength: value.length },
-        ),
-      );
-      return;
-    }
-
-    setContent(value);
-    updatePromptListVisibility(value);
-  };
-
-  const handleSend = () => {
-    if (messageIsStreaming) {
-      return;
-    }
-
-    if (!content) {
-      alert(t('Please enter a message'));
-      return;
-    }
-
-    onSend({ role: 'user', content }, plugin);
-    setContent('');
-    setPlugin(null);
-
-    if (window.innerWidth < 640 && textareaRef && textareaRef.current) {
-      textareaRef.current.blur();
-    }
-  };
-
-  const handleStopConversation = () => {
-    stopConversationRef.current = true;
-    setTimeout(() => {
-      stopConversationRef.current = false;
-    }, 1000);
-  };
-
-  const isMobile = () => {
-    const userAgent =
-      typeof window.navigator === 'undefined' ? '' : navigator.userAgent;
-    const mobileRegex =
-      /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i;
-    return mobileRegex.test(userAgent);
-  };
-
-  const handleInitModal = () => {
-    const selectedPrompt = filteredPrompts[activePromptIndex];
-    if (selectedPrompt) {
-      setContent((prevContent) => {
-        const newContent = prevContent?.replace(
-          /\/\w*$/,
-          selectedPrompt.content,
-        );
-        return newContent;
-      });
-      handlePromptSelect(selectedPrompt);
-    }
-    setShowPromptList(false);
-  };
-
-  const handleKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => {
-    if (showPromptList) {
-      if (e.key === 'ArrowDown') {
-        e.preventDefault();
-        setActivePromptIndex((prevIndex) =>
-          prevIndex < prompts.length - 1 ? prevIndex + 1 : prevIndex,
-        );
-      } else if (e.key === 'ArrowUp') {
-        e.preventDefault();
-        setActivePromptIndex((prevIndex) =>
-          prevIndex > 0 ? prevIndex - 1 : prevIndex,
-        );
-      } else if (e.key === 'Tab') {
-        e.preventDefault();
-        setActivePromptIndex((prevIndex) =>
-          prevIndex < prompts.length - 1 ? prevIndex + 1 : 0,
-        );
-      } else if (e.key === 'Enter') {
-        e.preventDefault();
-        handleInitModal();
-      } else if (e.key === 'Escape') {
-        e.preventDefault();
-        setShowPromptList(false);
-      } else {
-        setActivePromptIndex(0);
-      }
-    } else if (e.key === 'Enter' && !isTyping && !isMobile() && !e.shiftKey) {
-      e.preventDefault();
-      handleSend();
-    } else if (e.key === '/' && e.metaKey) {
-      e.preventDefault();
-      setShowPluginSelect(!showPluginSelect);
-    }
-  };
-
-  const parseVariables = (content: string) => {
-    const regex = /{{(.*?)}}/g;
-    const foundVariables = [];
-    let match;
-
-    while ((match = regex.exec(content)) !== null) {
-      foundVariables.push(match[1]);
-    }
-
-    return foundVariables;
-  };
-
-  const updatePromptListVisibility = useCallback((text: string) => {
-    const match = text.match(/\/\w*$/);
-
-    if (match) {
-      setShowPromptList(true);
-      setPromptInputValue(match[0].slice(1));
-    } else {
-      setShowPromptList(false);
-      setPromptInputValue('');
-    }
-  }, []);
-
-  const handlePromptSelect = (prompt: Prompt) => {
-    const parsedVariables = parseVariables(prompt.content);
-    setVariables(parsedVariables);
-
-    if (parsedVariables.length > 0) {
-      setIsModalVisible(true);
-    } else {
-      setContent((prevContent) => {
-        const updatedContent = prevContent?.replace(/\/\w*$/, prompt.content);
-        return updatedContent;
-      });
-      updatePromptListVisibility(prompt.content);
-    }
-  };
-
-  const handleSubmit = (updatedVariables: string[]) => {
-    const newContent = content?.replace(/{{(.*?)}}/g, (match, variable) => {
-      const index = variables.indexOf(variable);
-      return updatedVariables[index];
-    });
-
-    setContent(newContent);
-
-    if (textareaRef && textareaRef.current) {
-      textareaRef.current.focus();
-    }
-  };
-
-  useEffect(() => {
-    if (promptListRef.current) {
-      promptListRef.current.scrollTop = activePromptIndex * 30;
-    }
-  }, [activePromptIndex]);
-
-  useEffect(() => {
-    if (textareaRef && textareaRef.current) {
-      textareaRef.current.style.height = 'inherit';
-      textareaRef.current.style.height = `${textareaRef.current?.scrollHeight}px`;
-      textareaRef.current.style.overflow = `${
-        textareaRef?.current?.scrollHeight > 400 ? 'auto' : 'hidden'
-      }`;
-    }
-  }, [content]);
-
-  useEffect(() => {
-    const handleOutsideClick = (e: MouseEvent) => {
-      if (
-        promptListRef.current &&
-        !promptListRef.current.contains(e.target as Node)
-      ) {
-        setShowPromptList(false);
-      }
-    };
-
-    window.addEventListener('click', handleOutsideClick);
-
-    return () => {
-      window.removeEventListener('click', handleOutsideClick);
-    };
-  }, []);
-
-  return (
-    <div className="absolute bottom-0 left-0 w-full border-transparent bg-gradient-to-b from-transparent via-white to-white pt-6 dark:border-white/20 dark:via-[#343541] dark:to-[#343541] md:pt-2">
-      <div className="stretch mx-2 mt-4 flex flex-row gap-3 last:mb-2 md:mx-4 md:mt-[52px] md:last:mb-6 lg:mx-auto lg:max-w-3xl">
-        {messageIsStreaming && (
-          <button
-            className="absolute top-0 left-0 right-0 mx-auto mb-3 flex w-fit items-center gap-3 rounded border border-neutral-200 bg-white py-2 px-4 text-black hover:opacity-50 dark:border-neutral-600 dark:bg-[#343541] dark:text-white md:mb-0 md:mt-2"
-            onClick={handleStopConversation}
-          >
-            <IconPlayerStop size={16} /> {t('Stop Generating')}
-          </button>
-        )}
-
-        {!messageIsStreaming &&
-          selectedConversation &&
-          selectedConversation.messages.length > 0 && (
-            <button
-              className="absolute top-0 left-0 right-0 mx-auto mb-3 flex w-fit items-center gap-3 rounded border border-neutral-200 bg-white py-2 px-4 text-black hover:opacity-50 dark:border-neutral-600 dark:bg-[#343541] dark:text-white md:mb-0 md:mt-2"
-              onClick={onRegenerate}
-            >
-              <IconRepeat size={16} /> {t('Regenerate response')}
-            </button>
-          )}
-
-        <div className="relative mx-2 flex w-full flex-grow flex-col rounded-md border border-black/10 bg-white shadow-[0_0_10px_rgba(0,0,0,0.10)] dark:border-gray-900/50 dark:bg-[#40414F] dark:text-white dark:shadow-[0_0_15px_rgba(0,0,0,0.10)] sm:mx-4">
-          <button
-            className="absolute left-2 top-2 rounded-sm p-1 text-neutral-800 opacity-60 hover:bg-neutral-200 hover:text-neutral-900 dark:bg-opacity-50 dark:text-neutral-100 dark:hover:text-neutral-200"
-            onClick={() => setShowPluginSelect(!showPluginSelect)}
-            onKeyDown={(e) => {}}
-          >
-            {plugin ? <IconBrandGoogle size={20} /> : <IconBolt size={20} />}
-          </button>
-
-          {showPluginSelect && (
-            <div className="absolute left-0 bottom-14 rounded bg-white dark:bg-[#343541]">
-              <PluginSelect
-                plugin={plugin}
-                onKeyDown={(e: any) => {
-                  if (e.key === 'Escape') {
-                    e.preventDefault();
-                    setShowPluginSelect(false);
-                    textareaRef.current?.focus();
-                  }
-                }}
-                onPluginChange={(plugin: Plugin) => {
-                  setPlugin(plugin);
-                  setShowPluginSelect(false);
-
-                  if (textareaRef && textareaRef.current) {
-                    textareaRef.current.focus();
-                  }
-                }}
-              />
-            </div>
-          )}
-
-          <textarea
-            ref={textareaRef}
-            className="m-0 w-full resize-none border-0 bg-transparent p-0 py-2 pr-8 pl-10 text-black dark:bg-transparent dark:text-white md:py-3 md:pl-10"
-            style={{
-              resize: 'none',
-              bottom: `${textareaRef?.current?.scrollHeight}px`,
-              maxHeight: '400px',
-              overflow: `${
-                textareaRef.current && textareaRef.current.scrollHeight > 400
-                  ? 'auto'
-                  : 'hidden'
-              }`,
-            }}
-            placeholder={
-              t('Type a message or type "/" to select a prompt...') || ''
-            }
-            value={content}
-            rows={1}
-            onCompositionStart={() => setIsTyping(true)}
-            onCompositionEnd={() => setIsTyping(false)}
-            onChange={handleChange}
-            onKeyDown={handleKeyDown}
-          />
-
-          <button
-            className="absolute right-2 top-2 rounded-sm p-1 text-neutral-800 opacity-60 hover:bg-neutral-200 hover:text-neutral-900 dark:bg-opacity-50 dark:text-neutral-100 dark:hover:text-neutral-200"
-            onClick={handleSend}
-          >
-            {messageIsStreaming ? (
-              <div className="h-4 w-4 animate-spin rounded-full border-t-2 border-neutral-800 opacity-60 dark:border-neutral-100"></div>
-            ) : (
-              <IconSend size={18} />
-            )}
-          </button>
-
-          {showScrollDownButton && (
-            <div className="absolute bottom-12 right-0 lg:bottom-0 lg:-right-10">
-              <button
-                className="flex h-7 w-7 items-center justify-center rounded-full bg-neutral-300 text-gray-800 shadow-md hover:shadow-lg focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-neutral-200"
-                onClick={onScrollDownClick}
-              >
-                <IconArrowDown size={18} />
-              </button>
-            </div>
-          )}
-
-          {showPromptList && filteredPrompts.length > 0 && (
-            <div className="absolute bottom-12 w-full">
-              <PromptList
-                activePromptIndex={activePromptIndex}
-                prompts={filteredPrompts}
-                onSelect={handleInitModal}
-                onMouseOver={setActivePromptIndex}
-                promptListRef={promptListRef}
-              />
-            </div>
-          )}
-
-          {isModalVisible && (
-            <VariableModal
-              prompt={filteredPrompts[activePromptIndex]}
-              variables={variables}
-              onSubmit={handleSubmit}
-              onClose={() => setIsModalVisible(false)}
-            />
-          )}
-        </div>
-      </div>
-      <div className="px-3 pt-2 pb-3 text-center text-[12px] 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>
-        .{' '}
-        {t(
-          "Chatbot UI is an advanced chatbot kit for OpenAI's chat models aiming to mimic ChatGPT's interface and functionality.",
-        )}
-      </div>
-    </div>
-  );
-};
+import { 
+   IconArrowDown, 
+   IconBolt, 
+   IconBrandGoogle, 
+   IconPlayerStop, 
+   IconRepeat, 
+   IconSend, 
+ } from '@tabler/icons-react'; 
+ import { 
+   KeyboardEvent, 
+   MutableRefObject, 
+   useCallback, 
+   useContext, 
+   useEffect, 
+   useRef, 
+   useState, 
+ } from 'react'; 
+  
+ import { useTranslation } from 'next-i18next'; 
+  
+ import { Message } from '@/types/chat'; 
+ import { Plugin } from '@/types/plugin'; 
+ import { Prompt } from '@/types/prompt'; 
+  
+ import HomeContext from '@/pages/api/home/home.context'; 
+  
+ import { PluginSelect } from './PluginSelect'; 
+ import { PromptList } from './PromptList'; 
+ import { VariableModal } from './VariableModal'; 
+  
+ interface Props { 
+   onSend: (message: Message, plugin: Plugin | null) => void; 
+   onRegenerate: () => void; 
+   onScrollDownClick: () => void; 
+   stopConversationRef: MutableRefObject<boolean>; 
+   textareaRef: MutableRefObject<HTMLTextAreaElement | null>; 
+   showScrollDownButton: boolean; 
+ } 
+  
+ export const ChatInput = ({ 
+   onSend, 
+   onRegenerate, 
+   onScrollDownClick, 
+   stopConversationRef, 
+   textareaRef, 
+   showScrollDownButton, 
+ }: Props) => { 
+   const { t } = useTranslation('chat'); 
+  
+   const { 
+     state: { selectedConversation, messageIsStreaming, prompts }, 
+  
+     dispatch: homeDispatch, 
+   } = useContext(HomeContext); 
+  
+   const [content, setContent] = useState<string>(); 
+   const [isTyping, setIsTyping] = useState<boolean>(false); 
+   const [showPromptList, setShowPromptList] = useState(false); 
+   const [activePromptIndex, setActivePromptIndex] = useState(0); 
+   const [promptInputValue, setPromptInputValue] = useState(''); 
+   const [variables, setVariables] = useState<string[]>([]); 
+   const [isModalVisible, setIsModalVisible] = useState(false); 
+   const [showPluginSelect, setShowPluginSelect] = useState(false); 
+   const [plugin, setPlugin] = useState<Plugin | null>(null); 
+  
+   const promptListRef = useRef<HTMLUListElement | null>(null); 
+  
+   const filteredPrompts = prompts.filter((prompt) => 
+     prompt.name.toLowerCase().includes(promptInputValue.toLowerCase()), 
+   ); 
+  
+   const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => { 
+     const value = e.target.value; 
+     const maxLength = selectedConversation?.model.maxLength; 
+  
+     if (maxLength && value.length > maxLength) { 
+       alert( 
+         t( 
+           `Message limit is {{maxLength}} characters. You have entered {{valueLength}} characters.`, 
+           { maxLength, valueLength: value.length }, 
+         ), 
+       ); 
+       return; 
+     } 
+  
+     setContent(value); 
+     updatePromptListVisibility(value); 
+   }; 
+  
+   const handleSend = () => { 
+     if (messageIsStreaming) { 
+       return; 
+     } 
+  
+     if (!content) { 
+       alert(t('Please enter a message')); 
+       return; 
+     } 
+  
+     onSend({ role: 'user', content }, plugin); 
+     setContent(''); 
+     setPlugin(null); 
+  
+     if (window.innerWidth < 640 && textareaRef && textareaRef.current) { 
+       textareaRef.current.blur(); 
+     } 
+   }; 
+  
+   const handleStopConversation = () => { 
+     stopConversationRef.current = true; 
+     setTimeout(() => { 
+       stopConversationRef.current = false; 
+     }, 1000); 
+   }; 
+  
+   const isMobile = () => { 
+     const userAgent = 
+       typeof window.navigator === 'undefined' ? '' : navigator.userAgent; 
+     const mobileRegex = 
+       /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS/i; 
+     return mobileRegex.test(userAgent); 
+   }; 
+  
+   const handleInitModal = () => { 
+     const selectedPrompt = filteredPrompts[activePromptIndex]; 
+     if (selectedPrompt) { 
+       setContent((prevContent) => { 
+         const newContent = prevContent?.replace( 
+           /\/\w*$/, 
+           selectedPrompt.content, 
+         ); 
+         return newContent; 
+       }); 
+       handlePromptSelect(selectedPrompt); 
+     } 
+     setShowPromptList(false); 
+   }; 
+  
+   const handleKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => { 
+     if (showPromptList) { 
+       if (e.key === 'ArrowDown') { 
+         e.preventDefault(); 
+         setActivePromptIndex((prevIndex) => 
+           prevIndex < prompts.length - 1 ? prevIndex + 1 : prevIndex, 
+         ); 
+       } else if (e.key === 'ArrowUp') { 
+         e.preventDefault(); 
+         setActivePromptIndex((prevIndex) => 
+           prevIndex > 0 ? prevIndex - 1 : prevIndex, 
+         ); 
+       } else if (e.key === 'Tab') { 
+         e.preventDefault(); 
+         setActivePromptIndex((prevIndex) => 
+           prevIndex < prompts.length - 1 ? prevIndex + 1 : 0, 
+         ); 
+       } else if (e.key === 'Enter') { 
+         e.preventDefault(); 
+         handleInitModal(); 
+       } else if (e.key === 'Escape') { 
+         e.preventDefault(); 
+         setShowPromptList(false); 
+       } else { 
+         setActivePromptIndex(0); 
+       } 
+     } else if (e.key === 'Enter' && !isTyping && !isMobile() && !e.shiftKey) { 
+       e.preventDefault(); 
+       handleSend(); 
+     } else if (e.key === '/' && e.metaKey) { 
+       e.preventDefault(); 
+       setShowPluginSelect(!showPluginSelect); 
+     } 
+   }; 
+  
+   const parseVariables = (content: string) => { 
+     const regex = /{{(.*?)}}/g; 
+     const foundVariables = []; 
+     let match; 
+  
+     while ((match = regex.exec(content)) !== null) { 
+       foundVariables.push(match[1]); 
+     } 
+  
+     return foundVariables; 
+   }; 
+  
+   const updatePromptListVisibility = useCallback((text: string) => { 
+     const match = text.match(/\/\w*$/); 
+  
+     if (match) { 
+       setShowPromptList(true); 
+       setPromptInputValue(match[0].slice(1)); 
+     } else { 
+       setShowPromptList(false); 
+       setPromptInputValue(''); 
+     } 
+   }, []); 
+  
+   const handlePromptSelect = (prompt: Prompt) => { 
+     const parsedVariables = parseVariables(prompt.content); 
+     setVariables(parsedVariables); 
+  
+     if (parsedVariables.length > 0) { 
+       setIsModalVisible(true); 
+     } else { 
+       setContent((prevContent) => { 
+         const updatedContent = prevContent?.replace(/\/\w*$/, prompt.content); 
+         return updatedContent; 
+       }); 
+       updatePromptListVisibility(prompt.content); 
+     } 
+   }; 
+  
+   const handleSubmit = (updatedVariables: string[]) => { 
+     const newContent = content?.replace(/{{(.*?)}}/g, (match, variable) => { 
+       const index = variables.indexOf(variable); 
+       return updatedVariables[index]; 
+     }); 
+  
+     setContent(newContent); 
+  
+     if (textareaRef && textareaRef.current) { 
+       textareaRef.current.focus(); 
+     } 
+   }; 
+  
+   useEffect(() => { 
+     if (promptListRef.current) { 
+       promptListRef.current.scrollTop = activePromptIndex * 30; 
+     } 
+   }, [activePromptIndex]); 
+  
+   useEffect(() => { 
+     if (textareaRef && textareaRef.current) { 
+       textareaRef.current.style.height = 'inherit'; 
+       textareaRef.current.style.height = `${textareaRef.current?.scrollHeight}px`; 
+       textareaRef.current.style.overflow = `${ 
+         textareaRef?.current?.scrollHeight > 400 ? 'auto' : 'hidden' 
+       }`; 
+     } 
+   }, [content]); 
+  
+   useEffect(() => { 
+     const handleOutsideClick = (e: MouseEvent) => { 
+       if ( 
+         promptListRef.current && 
+         !promptListRef.current.contains(e.target as Node) 
+       ) { 
+         setShowPromptList(false); 
+       } 
+     }; 
+  
+     window.addEventListener('click', handleOutsideClick); 
+  
+     return () => { 
+       window.removeEventListener('click', handleOutsideClick); 
+     }; 
+   }, []); 
+  
+   return ( 
+     <div className="absolute bottom-0 left-0 w-full border-transparent bg-gradient-to-b from-transparent via-white to-white pt-6 dark:border-white/20 dark:via-[#343541] dark:to-[#343541] md:pt-2"> 
+       <div className="stretch mx-2 mt-4 flex flex-row gap-3 last:mb-2 md:mx-4 md:mt-[52px] md:last:mb-6 lg:mx-auto lg:max-w-3xl"> 
+         {messageIsStreaming && ( 
+           <button 
+             className="absolute top-0 left-0 right-0 mx-auto mb-3 flex w-fit items-center gap-3 rounded border border-neutral-200 bg-white py-2 px-4 text-black hover:opacity-50 dark:border-neutral-600 dark:bg-[#343541] dark:text-white md:mb-0 md:mt-2" 
+             onClick={handleStopConversation} 
+           > 
+             <IconPlayerStop size={16} /> {t('Stop Generating')} 
+           </button> 
+         )} 
+  
+         {!messageIsStreaming && 
+           selectedConversation && 
+           selectedConversation.messages.length > 0 && ( 
+             <button 
+               className="absolute top-0 left-0 right-0 mx-auto mb-3 flex w-fit items-center gap-3 rounded border border-neutral-200 bg-white py-2 px-4 text-black hover:opacity-50 dark:border-neutral-600 dark:bg-[#343541] dark:text-white md:mb-0 md:mt-2" 
+               onClick={onRegenerate} 
+             > 
+               <IconRepeat size={16} /> {t('Regenerate response')} 
+             </button> 
+           )} 
+  
+         <div className="relative mx-2 flex w-full flex-grow flex-col rounded-md border border-black/10 bg-white shadow-[0_0_10px_rgba(0,0,0,0.10)] dark:border-gray-900/50 dark:bg-[#40414F] dark:text-white dark:shadow-[0_0_15px_rgba(0,0,0,0.10)] sm:mx-4"> 
+           <button 
+             className="absolute left-2 top-2 rounded-sm p-1 text-neutral-800 opacity-60 hover:bg-neutral-200 hover:text-neutral-900 dark:bg-opacity-50 dark:text-neutral-100 dark:hover:text-neutral-200" 
+             onClick={() => setShowPluginSelect(!showPluginSelect)} 
+             onKeyDown={(e) => {}} 
+           > 
+             {plugin ? <IconBrandGoogle size={20} /> : <IconBolt size={20} />} 
+           </button> 
+  
+           {showPluginSelect && ( 
+             <div className="absolute left-0 bottom-14 rounded bg-white dark:bg-[#343541]"> 
+               <PluginSelect 
+                 plugin={plugin} 
+                 onKeyDown={(e: any) => { 
+                   if (e.key === 'Escape') { 
+                     e.preventDefault(); 
+                     setShowPluginSelect(false); 
+                     textareaRef.current?.focus(); 
+                   } 
+                 }} 
+                 onPluginChange={(plugin: Plugin) => { 
+                   setPlugin(plugin); 
+                   setShowPluginSelect(false); 
+  
+                   if (textareaRef && textareaRef.current) { 
+                     textareaRef.current.focus(); 
+                   } 
+                 }} 
+               /> 
+             </div> 
+           )} 
+  
+           <textarea 
+             ref={textareaRef} 
+             className="m-0 w-full resize-none border-0 bg-transparent p-0 py-2 pr-8 pl-10 text-black dark:bg-transparent dark:text-white md:py-3 md:pl-10" 
+             style={{ 
+               resize: 'none', 
+               bottom: `${textareaRef?.current?.scrollHeight}px`, 
+               maxHeight: '400px', 
+               overflow: `${ 
+                 textareaRef.current && textareaRef.current.scrollHeight > 400 
+                   ? 'auto' 
+                   : 'hidden' 
+               }`, 
+             }} 
+             placeholder={ 
+               t('Type a message or type "/" to select a prompt...') || '' 
+             } 
+             value={content} 
+             rows={1} 
+             onCompositionStart={() => setIsTyping(true)} 
+             onCompositionEnd={() => setIsTyping(false)} 
+             onChange={handleChange} 
+             onKeyDown={handleKeyDown} 
+           /> 
+  
+           <button 
+             className="absolute right-2 top-2 rounded-sm p-1 text-neutral-800 opacity-60 hover:bg-neutral-200 hover:text-neutral-900 dark:bg-opacity-50 dark:text-neutral-100 dark:hover:text-neutral-200" 
+             onClick={handleSend} 
+           > 
+             {messageIsStreaming ? ( 
+               <div className="h-4 w-4 animate-spin rounded-full border-t-2 border-neutral-800 opacity-60 dark:border-neutral-100"></div> 
+             ) : ( 
+               <IconSend size={18} /> 
+             )} 
+           </button> 
+  
+           {showScrollDownButton && ( 
+             <div className="absolute bottom-12 right-0 lg:bottom-0 lg:-right-10"> 
+               <button 
+                 className="flex h-7 w-7 items-center justify-center rounded-full bg-neutral-300 text-gray-800 shadow-md hover:shadow-lg focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-neutral-200" 
+                 onClick={onScrollDownClick} 
+               > 
+                 <IconArrowDown size={18} /> 
+               </button> 
+             </div> 
+           )} 
+  
+           {showPromptList && filteredPrompts.length > 0 && ( 
+             <div className="absolute bottom-12 w-full"> 
+               <PromptList 
+                 activePromptIndex={activePromptIndex} 
+                 prompts={filteredPrompts} 
+                 onSelect={handleInitModal} 
+                 onMouseOver={setActivePromptIndex} 
+                 promptListRef={promptListRef} 
+               /> 
+             </div> 
+           )} 
+  
+           {isModalVisible && ( 
+             <VariableModal 
+               prompt={filteredPrompts[activePromptIndex]} 
+               variables={variables} 
+               onSubmit={handleSubmit} 
+               onClose={() => setIsModalVisible(false)} 
+             /> 
+           )} 
+         </div> 
+       </div> 
+       <div className="px-3 pt-2 pb-3 text-center text-[12px] 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> 
+         .{' '} 
+         {t( 
+           "Chatbot UI is an advanced chatbot kit for OpenAI's chat models aiming to mimic ChatGPT's interface and functionality.", 
+         )} 
+       </div> 
+     </div> 
+   ); 
+ };
\ No newline at end of file
diff --git a/public/screenshots/SUS.jpg b/public/screenshots/SUS.jpg
new file mode 100644
index 0000000..eb09db9
Binary files /dev/null and b/public/screenshots/SUS.jpg differ
diff --git a/types/openai.ts b/types/openai.ts
index bb6061f..06ed96b 100644
--- a/types/openai.ts
+++ b/types/openai.ts
@@ -7,24 +7,29 @@ export interface OpenAIModel {
   tokenLimit: number;
 }
 
+// Define all the model identifiers
 export enum OpenAIModelID {
   GPT_3_5 = 'gpt-3.5-turbo',
   GPT_3_5_0613 = 'gpt-3.5-turbo-0613',
   GPT_3_5_16K = 'gpt-3.5-turbo-16k',
+  GPT_3_5_16K_POE = 'gpt-3.5-turbo-16k-poe',
   GPT_3_5_16K_0613 = 'gpt-3.5-turbo-16k-0613',
-  GPT_4 = 'gpt-4',
   GPT_4_0613 = 'gpt-4-0613',
+  GPT_4 = 'gpt-4',
+  GPT_4_POE = 'gpt-4-poe',
+  GPT_4_32K_0613 = 'gpt-4-32k-0613',
   GPT_4_32K = 'gpt-4-32k',
-  CLAUDE_PLUS = 'claude+',
-  CLAUDE_INSTANT = 'claude-instant',
+  GPT_4_32K_POE = 'gpt-4-32k-poe',
+  CLAUDE_2_100K = 'claude-2-100k',
   CLAUDE_INSTANT_100K = 'claude-instant-100k',
-  BARD = 'bard',
+  CLAUDE_INSTANT = 'claude-instant',
 }
 
 // in case the `DEFAULT_MODEL` environment variable is not set or set to an unsupported model
 export const fallbackModelID = OpenAIModelID.GPT_3_5;
 
 export const OpenAIModels: Record<OpenAIModelID, OpenAIModel> = {
+  // Define all the models with their properties
   [OpenAIModelID.GPT_3_5]: {
     id: OpenAIModelID.GPT_3_5,
     name: 'GPT-3.5',
@@ -43,52 +48,71 @@ export const OpenAIModels: Record<OpenAIModelID, OpenAIModel> = {
     maxLength: 48000,
     tokenLimit: 16384,
   },
+  [OpenAIModelID.GPT_3_5_16K_POE]: {
+    id: OpenAIModelID.GPT_3_5_16K_POE,
+    name: 'GPT-3.5-16K-POE',
+    maxLength: 48000,
+    tokenLimit: 16384,
+  },
   [OpenAIModelID.GPT_3_5_16K_0613]: {
     id: OpenAIModelID.GPT_3_5_16K_0613,
     name: 'GPT-3.5-16K-0613',
     maxLength: 48000,
     tokenLimit: 16384,
   },
+  [OpenAIModelID.GPT_4_0613]: {
+    id: OpenAIModelID.GPT_4_0613,
+    name: 'GPT-4-0613',
+    maxLength: 24000,
+    tokenLimit: 8192,
+  },
   [OpenAIModelID.GPT_4]: {
     id: OpenAIModelID.GPT_4,
     name: 'GPT-4',
     maxLength: 24000,
     tokenLimit: 8192,
   },
-  [OpenAIModelID.GPT_4_0613]: {
-    id: OpenAIModelID.GPT_4_0613,
-    name: 'GPT-4-0613',
+  [OpenAIModelID.GPT_4_POE]: {
+    id: OpenAIModelID.GPT_4_POE,
+    name: 'GPT-4-POE',
     maxLength: 24000,
     tokenLimit: 8192,
   },
+  [OpenAIModelID.GPT_4_32K_0613]: {
+    id: OpenAIModelID.GPT_4_32K_0613,
+    name: 'GPT-4-32K-0613',
+    maxLength: 96000,
+    tokenLimit: 32768,
+  },
   [OpenAIModelID.GPT_4_32K]: {
     id: OpenAIModelID.GPT_4_32K,
     name: 'GPT-4-32K',
     maxLength: 96000,
     tokenLimit: 32768,
   },
-  [OpenAIModelID.CLAUDE_PLUS]: {
-    id: OpenAIModelID.CLAUDE_PLUS,
-    name: 'Claude+',
-    maxLength: 30000,
-    tokenLimit: 10240,
+  [OpenAIModelID.GPT_4_32K_POE]: {
+    id: OpenAIModelID.GPT_4_32K_POE,
+    name: 'GPT-4-32K-POE',
+    maxLength: 96000,
+    tokenLimit: 32768,
   },
-  [OpenAIModelID.CLAUDE_INSTANT]: {
-    id: OpenAIModelID.CLAUDE_INSTANT,
-    name: 'Claude Instant',
-    maxLength: 30000,
-    tokenLimit: 10240,
+  [OpenAIModelID.CLAUDE_2_100K]: {
+    id: OpenAIModelID.CLAUDE_2_100K,
+    name: 'Claude-2-100K',
+    maxLength: 360000,
+    tokenLimit: 102400,
   },
   [OpenAIModelID.CLAUDE_INSTANT_100K]: {
     id: OpenAIModelID.CLAUDE_INSTANT_100K,
-    name: 'Claude Instant 100K',
-    maxLength: 300000,
+    name: 'Claude-Instant-100K',
+    maxLength: 360000,
     tokenLimit: 102400,
   },
-  [OpenAIModelID.BARD]: {
-    id: OpenAIModelID.BARD,
-    name: 'Bard',
-    maxLength: 30000,
+  [OpenAIModelID.CLAUDE_INSTANT]: {
+    id: OpenAIModelID.CLAUDE_INSTANT,
+    name: 'Claude-Instant',
+    maxLength: 36000,
     tokenLimit: 10240,
   },
-};
\ No newline at end of file
+};
+  
diff --git a/utils/app/const.ts b/utils/app/const.ts
index 3011f3d..aee752e 100644
--- a/utils/app/const.ts
+++ b/utils/app/const.ts
@@ -1,6 +1,6 @@
 export const DEFAULT_SYSTEM_PROMPT =
   process.env.NEXT_PUBLIC_DEFAULT_SYSTEM_PROMPT ||
-  "You are ChatGPT, a large language model trained by OpenAI. Follow the user's instructions carefully. Respond using markdown.";
+  "You are an advanced AI language model that can generate human-like text responses based on the prompts you receive. Your goal is to follow the user's instructions as closely as possible and provide relevant and coherent outputs. You can use Markdown to format your responses. For example: Use bold text to highlight important words or phrases. Use headings and subheadings to organize your content. Use lists and tables to display information in a structured way. Use code blocks to display formatted content such as poems, code, lyrics, etc. Use LaTeX to write mathematical expressions. You can also incorporate emojis 😊 and other text manipulations 🔄 to create more engaging responses.";
 
 export const OPENAI_API_HOST =
   process.env.OPENAI_API_HOST || 'https://chimeragpt.adventblocks.cc';