diff --git a/backend/routes/generate_code.py b/backend/routes/generate_code.py index b260cc0..d59b8d1 100644 --- a/backend/routes/generate_code.py +++ b/backend/routes/generate_code.py @@ -12,6 +12,7 @@ from prompts import assemble_imported_code_prompt, assemble_prompt from access_token import validate_access_token from datetime import datetime import json +from routes.logging_utils import send_to_saas_backend from utils import pprint_prompt # type: ignore @@ -234,6 +235,13 @@ async def stream_code(websocket: WebSocket): # Write the messages dict into a log so that we can debug later write_logs(prompt_messages, completion) + if IS_PROD: + # Catch any errors from sending to SaaS backend and continue + try: + await send_to_saas_backend(prompt_messages, completion, params["authToken"]) + except Exception as e: + print("Error sending to SaaS backend", e) + try: if should_generate_images: await websocket.send_json( diff --git a/backend/routes/logging_utils.py b/backend/routes/logging_utils.py new file mode 100644 index 0000000..b13ce39 --- /dev/null +++ b/backend/routes/logging_utils.py @@ -0,0 +1,33 @@ +import httpx +from openai.types.chat import ChatCompletionMessageParam +from typing import List +import json + +from config import IS_PROD + + +async def send_to_saas_backend( + prompt_messages: List[ChatCompletionMessageParam], + completion: str, + auth_token: str | None = None, +): + if IS_PROD: + async with httpx.AsyncClient() as client: + url = "https://screenshot-to-code-saas.onrender.com/generations/store" + # url = "http://localhost:8001/generations/store" + + data = json.dumps( + { + "prompt": json.dumps(prompt_messages), + "completion": completion, + } + ) + + headers = { + "Content-Type": "application/json", + "Authorization": f"Bearer {auth_token}", # Add the auth token to the headers + } + + response = await client.post(url, content=data, headers=headers) + response_data = response.json() + return response_data diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 9c64805..414fc1a 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -12,7 +12,6 @@ import { FaMobile, FaUndo, } from "react-icons/fa"; - import { Switch } from "./components/ui/switch"; import { Button } from "@/components/ui/button"; import { Textarea } from "@/components/ui/textarea"; @@ -41,6 +40,7 @@ import HistoryDisplay from "./components/history/HistoryDisplay"; import { extractHistoryTree } from "./components/history/utils"; import toast from "react-hot-toast"; import ImportCodeSection from "./components/ImportCodeSection"; +import { useAuth } from "@clerk/clerk-react"; const IS_OPENAI_DOWN = false; @@ -57,6 +57,9 @@ function App({ navbarComponent }: Props) { const [updateInstruction, setUpdateInstruction] = useState(""); const [isImportedFromCode, setIsImportedFromCode] = useState(false); + // TODO: Move to AppContainer + const { getToken } = useAuth(); + // Settings const [settings, setSettings] = usePersistedState( { @@ -156,7 +159,7 @@ function App({ navbarComponent }: Props) { } }; - function doGenerateCode( + async function doGenerateCode( params: CodeGenerationParams, parentVersion: number | null ) { @@ -164,7 +167,12 @@ function App({ navbarComponent }: Props) { setAppState(AppState.CODING); // Merge settings with params - const updatedParams = { ...params, ...settings }; + const authToken = await getToken(); + const updatedParams = { + ...params, + ...settings, + authToken: authToken || undefined, + }; generateCode( wsRef, @@ -223,13 +231,13 @@ function App({ navbarComponent }: Props) { } // Initial version creation - function doCreate(referenceImages: string[]) { + async function doCreate(referenceImages: string[]) { // Reset any existing state reset(); setReferenceImages(referenceImages); if (referenceImages.length > 0) { - doGenerateCode( + await doGenerateCode( { generationType: "create", image: referenceImages[0], @@ -264,7 +272,7 @@ function App({ navbarComponent }: Props) { if (shouldIncludeResultImage) { const resultImage = await takeScreenshot(); - doGenerateCode( + await doGenerateCode( { generationType: "update", image: referenceImages[0], @@ -275,7 +283,7 @@ function App({ navbarComponent }: Props) { currentVersion ); } else { - doGenerateCode( + await doGenerateCode( { generationType: "update", image: referenceImages[0], diff --git a/frontend/src/types.ts b/frontend/src/types.ts index 2820427..817a998 100644 --- a/frontend/src/types.ts +++ b/frontend/src/types.ts @@ -36,6 +36,7 @@ export interface CodeGenerationParams { resultImage?: string; history?: string[]; isImportedFromCode?: boolean; + authToken?: string; } export type FullGenerationSettings = CodeGenerationParams & Settings;