From ffb67d4ce98fb36d3ea8d2e1ede99c556491e6fc Mon Sep 17 00:00:00 2001 From: Abi Raja Date: Mon, 13 May 2024 15:58:47 -0400 Subject: [PATCH 1/5] Update README.md --- README.md | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index a017ed4..43a0180 100644 --- a/README.md +++ b/README.md @@ -15,9 +15,10 @@ Supported stacks: Supported AI models: -- GPT-4 Turbo (Apr 2024) - Best model -- GPT-4 Vision (Nov 2023) - Good model that's better than GPT-4 Turbo on some inputs -- Claude 3 Sonnet - Faster, and on par or better than GPT-4 vision for many inputs +- GPT-4 O - Best model! +- GPT-4 Turbo (Apr 2024) +- GPT-4 Vision (Nov 2023) +- Claude 3 Sonnet - DALL-E 3 for image generation See the [Examples](#-examples) section below for more demos. From 3c82b6571d87d9f31baf3ada0a96633c775ba6fa Mon Sep 17 00:00:00 2001 From: Abi Raja Date: Mon, 13 May 2024 15:59:18 -0400 Subject: [PATCH 2/5] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 43a0180..199bebb 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # screenshot-to-code -A simple tool to convert screenshots, mockups and Figma designs into clean, functional code using AI. +A simple tool to convert screenshots, mockups and Figma designs into clean, functional code using AI. Now supporting GPT-4O! https://github.com/abi/screenshot-to-code/assets/23818/6cebadae-2fe3-4986-ac6a-8fb9db030045 From 0cbc5dbef0826b42a20d702d875d980c954a8cd8 Mon Sep 17 00:00:00 2001 From: Abi Raja Date: Mon, 13 May 2024 15:59:47 -0400 Subject: [PATCH 3/5] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 199bebb..20e2523 100644 --- a/README.md +++ b/README.md @@ -15,7 +15,7 @@ Supported stacks: Supported AI models: -- GPT-4 O - Best model! +- GPT-4O - Best model! - GPT-4 Turbo (Apr 2024) - GPT-4 Vision (Nov 2023) - Claude 3 Sonnet From 22101ca73d51fd0d7b42ed8d4eebbb715df25b24 Mon Sep 17 00:00:00 2001 From: Abi Raja Date: Mon, 13 May 2024 16:24:12 -0400 Subject: [PATCH 4/5] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 20e2523..4b681b1 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # screenshot-to-code -A simple tool to convert screenshots, mockups and Figma designs into clean, functional code using AI. Now supporting GPT-4O! +A simple tool to convert screenshots, mockups and Figma designs into clean, functional code using AI. **Now supporting GPT-4O!** https://github.com/abi/screenshot-to-code/assets/23818/6cebadae-2fe3-4986-ac6a-8fb9db030045 From 9e3614549ce785639ab41f29de9ade87896c4a26 Mon Sep 17 00:00:00 2001 From: Abi Raja Date: Tue, 14 May 2024 11:48:07 -0400 Subject: [PATCH 5/5] add GPT4o message --- frontend/src/App.tsx | 13 +++++++++++++ frontend/src/lib/models.ts | 2 +- 2 files changed, 14 insertions(+), 1 deletion(-) diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 33c02ca..fd1576e 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -89,6 +89,10 @@ function App() { CodeGenerationModel.GPT_4_TURBO_2024_04_09 && settings.generatedCodeConfig === Stack.REACT_TAILWIND; + const showGpt4OMessage = + selectedCodeGenerationModel !== CodeGenerationModel.GPT_4O_2024_05_13 && + appState === AppState.INITIAL; + // Indicate coding state using the browser tab's favicon and title useBrowserTabIndicator(appState === AppState.CODING); @@ -403,6 +407,15 @@ function App() { )} + {showGpt4OMessage && ( +
+

+ Now supporting GPT-4o. Higher quality and 2x faster. Give it a + try! +

+
+ )} + {appState !== AppState.CODE_READY && } {IS_RUNNING_ON_CLOUD && !settings.openAiApiKey && } diff --git a/frontend/src/lib/models.ts b/frontend/src/lib/models.ts index 970e63b..d6fd09d 100644 --- a/frontend/src/lib/models.ts +++ b/frontend/src/lib/models.ts @@ -11,7 +11,7 @@ export enum CodeGenerationModel { export const CODE_GENERATION_MODEL_DESCRIPTIONS: { [key in CodeGenerationModel]: { name: string; inBeta: boolean }; } = { - "gpt-4o-2024-05-13": { name: "GPT-4O 🌟", inBeta: false }, + "gpt-4o-2024-05-13": { name: "GPT-4o 🌟", inBeta: false }, "gpt-4-turbo-2024-04-09": { name: "GPT-4 Turbo (Apr 2024)", inBeta: false }, gpt_4_vision: { name: "GPT-4 Vision (Nov 2023)", inBeta: false }, claude_3_sonnet: { name: "Claude 3 Sonnet", inBeta: false },