GPT-4o

Author: fredyandrei

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## [3.0.0] 2024-06-28
+
+### GPT-4o Support
+
+Updated GPT-3.5-Turbo to GPT-4o
+
 ## [2.0.0] 2024-02-06
 
 ### Next 14

README.md

@@ -1,6 +1,6 @@
 # [Horizon ChatGPT AI Template](https://horizon-ui.com/chatgpt-ai-template) [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter)](https://twitter.com/intent/tweet?text=Check%20Horizon%20ChatGPT%20AI%20Template,%20the%20trendiest%20open%20source%20ChatGPT%20AI%20admin%20template%20for%20%23nextjs%20and%20%23react!%0A%0Ahttps%3A//horizon-ui.com/chatgpt-ai-template/%20%20)
 
-![version](https://img.shields.io/badge/version-1.0.0-brightgreen.svg)
+![version](https://img.shields.io/badge/version-3.0.0-brightgreen.svg)
 [![GitHub issues open](https://img.shields.io/github/issues/horizon-ui/chatgpt-ai-template.svg?maxAge=2592000)](https://github.com/horizon-ui/chatgpt-ai-template/issues?q=is%3Aopen+is%3Aissue)
 
 <p>&nbsp;</p>
@@ -61,8 +61,8 @@ View <a href="https://horizon-ui.com/chatgpt-ai-template/?ref=readme-horizon-ai-
 
 ### Versions
 
-| Free Version                                                                                                                                                                                   | PRO Version                                                                                                                                                                            |
-| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| Free Version                                                                                                                                                         | PRO Version                                                                                                                                                                   |
+| -------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | [![Horizon ChatGPT AI Template](https://i.ibb.co/Qmym1qt/horizon-ai-template-presentation-image-open-source.png)](https://github.com/horizon-ui/chatgpt-ai-template) | [![Horizon AI Template PRO](https://i.ibb.co/ChL2fvf/horizon-ai-template-presentation-image.png)](https://www.horizon-ui.com/ai-template?ref=readme-horizon-ai-template-free) |
 
 ### Figma Version

app/page.tsx

@@ -30,7 +30,7 @@ export default function Chat(props: { apiKeyApp: string }) {
   // Response message
   const [outputCode, setOutputCode] = useState<string>('');
   // ChatGPT model
-  const [model, setModel] = useState<OpenAIModel>('gpt-3.5-turbo');
+  const [model, setModel] = useState<OpenAIModel>('gpt-4o');
   // Loading state
   const [loading, setLoading] = useState<boolean>(false);
 
@@ -60,7 +60,7 @@ export default function Chat(props: { apiKeyApp: string }) {
     setInputOnSubmit(inputCode);
 
     // Chat post conditions(maximum number of characters, valid message etc.)
-    const maxCodeLength = model === 'gpt-3.5-turbo' ? 700 : 700;
+    const maxCodeLength = model === 'gpt-4o' ? 700 : 700;
 
     if (!apiKey?.includes('sk-')) {
       alert('Please enter an API key.');
@@ -188,15 +188,15 @@ export default function Chat(props: { apiKeyApp: string }) {
               transition="0.3s"
               justify={'center'}
               align="center"
-              bg={model === 'gpt-3.5-turbo' ? buttonBg : 'transparent'}
+              bg={model === 'gpt-4o' ? buttonBg : 'transparent'}
               w="174px"
               h="70px"
-              boxShadow={model === 'gpt-3.5-turbo' ? buttonShadow : 'none'}
+              boxShadow={model === 'gpt-4o' ? buttonShadow : 'none'}
               borderRadius="14px"
               color={textColor}
               fontSize="18px"
               fontWeight={'700'}
-              onClick={() => setModel('gpt-3.5-turbo')}
+              onClick={() => setModel('gpt-4o')}
             >
               <Flex
                 borderRadius="full"
@@ -214,22 +214,22 @@ export default function Chat(props: { apiKeyApp: string }) {
                   color={iconColor}
                 />
               </Flex>
-              GPT-3.5
+              GPT-4o
             </Flex>
             <Flex
               cursor={'pointer'}
               transition="0.3s"
               justify={'center'}
               align="center"
-              bg={model === 'gpt-4' ? buttonBg : 'transparent'}
+              bg={model === 'gpt-3.5-turbo' ? buttonBg : 'transparent'}
               w="164px"
               h="70px"
-              boxShadow={model === 'gpt-4' ? buttonShadow : 'none'}
+              boxShadow={model === 'gpt-3.5-turbo' ? buttonShadow : 'none'}
               borderRadius="14px"
               color={textColor}
               fontSize="18px"
               fontWeight={'700'}
-              onClick={() => setModel('gpt-4')}
+              onClick={() => setModel('gpt-3.5-turbo')}
             >
               <Flex
                 borderRadius="full"
@@ -247,7 +247,7 @@ export default function Chat(props: { apiKeyApp: string }) {
                   color={iconColor}
                 />
               </Flex>
-              GPT-4
+              GPT-3.5
             </Flex>
           </Flex>
 

src/types/types.ts

@@ -1,4 +1,4 @@
-export type OpenAIModel = 'gpt-3.5-turbo' | 'gpt-4';
+export type OpenAIModel = 'gpt-4o' | 'gpt-3.5-turbo';
 
 export interface ChatBody {
   inputCode: string;