sudoevans · pull · Jun 28, 2025 · Jun 28, 2025
diff --git a/apps/web/client/src/app/project/[id]/_components/main.tsx b/apps/web/client/src/app/project/[id]/_components/main.tsx
@@ -10,7 +10,7 @@ import { SettingsModal } from '@/components/ui/settings-modal';
 import { useCleanupOnPageChange } from '@/hooks/use-subscription-cleanup';
 import { api } from '@/trpc/react';
 import { Routes } from '@/utils/constants';
-import { ChatType } from '@onlook/models';
+import { ChatType, type ChatMessageContext } from '@onlook/models';
 import { Icons } from '@onlook/ui/icons';
 import { TooltipProvider } from '@onlook/ui/tooltip';
 import { observer } from 'mobx-react-lite';
@@ -50,6 +50,7 @@ export const Main = observer(({ projectId }: { projectId: string }) => {
     );
 
     useEffect(() => {
+
         const initializeProject = async () => {
             if (!result) {
                 return;
@@ -89,9 +90,12 @@ export const Main = observer(({ projectId }: { projectId: string }) => {
 
         if (projectId !== creationData.project.id) return;
 
+        const createContext: ChatMessageContext[] = await editorEngine.chat.context.getCreateContext();
+        const context = [...createContext, ...creationData.images];
+
         const messages = await editorEngine.chat.getEditMessages(
             creationData.prompt,
-            creationData.images,
+            context,
         );
 
         if (!messages) {

diff --git a/apps/web/client/src/app/project/[id]/_hooks/use-chat.tsx b/apps/web/client/src/app/project/[id]/_hooks/use-chat.tsx
@@ -16,16 +16,19 @@ export function ChatProvider({ children }: { children: React.ReactNode }) {
         maxSteps: 20,
         onToolCall: (toolCall) => handleToolCall(toolCall.toolCall, editorEngine),
         onFinish: (message, config) => {
-            editorEngine.chat.conversation.addAssistantMessage(message);
+            if (config.finishReason !== 'tool-calls') {
+                editorEngine.chat.conversation.addAssistantMessage(message);
+            }
             if (config.finishReason === 'stop') {
                 editorEngine.chat.context.clearAttachments();
+                editorEngine.chat.error.clear();
             } else if (config.finishReason === 'length') {
                 editorEngine.chat.error.handleChatError(new Error('Output length limit reached'));
             } else if (config.finishReason === 'content-filter') {
                 editorEngine.chat.error.handleChatError(new Error('Content filter error'));
             } else if (config.finishReason === 'error') {
                 editorEngine.chat.error.handleChatError(new Error('Error in chat'));
-            } else {
+            } else if (config.finishReason === 'other' || config.finishReason === 'unknown') {
                 editorEngine.chat.error.handleChatError(new Error('Unknown finish reason'));
             }
         },

diff --git a/apps/web/client/src/components/store/create/manager.ts b/apps/web/client/src/components/store/create/manager.ts
@@ -1,7 +1,7 @@
 import { api } from '@/trpc/client';
 import { SandboxTemplates, Templates } from '@onlook/constants';
 import type { Project as DbProject } from '@onlook/db';
-import type { ImageMessageContext } from '@onlook/models/chat';
+import { MessageContextType, type FileMessageContext, type ImageMessageContext } from '@onlook/models/chat';
 import { makeAutoObservable } from "mobx";
 import { v4 as uuidv4 } from 'uuid';
 import { parseRepoUrl } from '../editor/pages/helper';

diff --git a/apps/web/client/src/components/store/editor/chat/context.ts b/apps/web/client/src/components/store/editor/chat/context.ts
@@ -128,6 +128,73 @@ export class ChatContext {
         ];
     }
 
+    async getCreateContext() {
+        try {
+            const context: ChatMessageContext[] = [];
+            const pageContext = await this.getDefaultPageContext();
+            const styleGuideContext = await this.getDefaultStyleGuideContext();
+            if (pageContext) {
+                context.push(pageContext);
+            }
+            if (styleGuideContext) {
+                context.push(...styleGuideContext);
+            }
+            return context;
+        } catch (error) {
+            console.error('Error getting create context', error);
+            return [];
+        }
+    }
+
+    async getDefaultPageContext(): Promise<FileMessageContext | null> {
+        try {
+            const pagePaths = ['./app/page.tsx', './src/app/pa
8000
ge.tsx'];
+            for (const pagePath of pagePaths) {
+                const content = await this.editorEngine.sandbox.readFile(pagePath);
+                if (content) {
+                    const defaultPageContext: FileMessageContext = {
+                        type: MessageContextType.FILE,
+                        path: pagePath,
+                        content,
+                        displayName: pagePath.split('/').pop() || 'page.tsx',
+                    }
+                    return defaultPageContext
+                }
+            }
+            return null;
+        } catch (error) {
+            console.error('Error getting default page context', error);
+            return null;
+        }
+    }
+
+    async getDefaultStyleGuideContext(): Promise<FileMessageContext[] | null> {
+        try {
+            const styleGuide = await this.editorEngine.theme.initializeTailwindColorContent();
+            if (!styleGuide) {
+                throw new Error('No style guide found');
+            }
+            const tailwindConfigContext: FileMessageContext = {
+                type: MessageContextType.FILE,
+                path: styleGuide.configPath,
+                content: styleGuide.configContent,
+                displayName: styleGuide.configPath.split('/').pop() || 'tailwind.config.ts',
+            }
+
+            const cssContext: FileMessageContext = {
+                type: MessageContextType.FILE,
+                path: styleGuide.cssPath,
+                content: styleGuide.cssContent,
+                displayName: styleGuide.cssPath.split('/').pop() || 'globals.css',
+            }
+
+            return [tailwindConfigContext, cssContext];
+        } catch (error) {
+            console.error('Error getting default style guide context', error);
+            return null;
+        }
+    }
+
     clearAttachments() {
         this.context = this.context.filter((context) => context.type !== MessageContextType.IMAGE);
     }

diff --git a/apps/web/client/src/components/store/project/git-manager.ts b/apps/web/client/src/components/store/project/git-manager.ts
@@ -61,7 +61,7 @@ export class GitManager {
             // Set user.email if not configured
             if (!hasEmail) {
                 const emailConfigResult = await this.runCommand(
-                    'git config user.email "git@onlook.com"',
+                    'git config user.email "support@onlook.com"',
                 );
                 if (!emailConfigResult.success) {
                     console.error('Failed to set git user.email:', emailConfigResult.error);