fix: session fixes #12-#18

- #12: Start Application timeout race in action-runner.ts
- #13: Terminal overflow containment (Markdown.module.scss + UserMessage.tsx)
- #14: Token optimization 64% reduction via simplifyTemplateActions (stream-text.ts)
- #15: Template install/start sequencing (selectStarterTemplate.ts)
- #16: urlId uniqueness toast error - serialization lock (useChatHistory.ts)
- #17: Create vs Edit action labels (Artifact.tsx)
- #18: boltArtifact tag leak in file content (message-parser.ts + action-runner.ts)

Author: zebbern

app/components/chat/Artifact.tsx

@@ -303,9 +303,13 @@ const ActionList = memo(({ actions }: ActionListProps) => {
               // File was directly written (staging disabled or auto-approved)
               diffStats = { linesAdded: action.content.split('\n').length, linesRemoved: 0 };
               fileContent = action.content;
-              actionLabel = 'Create';
+
+              // Check if the file already existed in the workbench to show Edit vs Create
+              const existingFile = workbenchStore.files.get()[`${WORK_DIR}/${filePath}`];
+              actionLabel = existingFile ? 'Edit' : 'Create';
             } else {
-              actionLabel = 'Create';
+              const existingFile = workbenchStore.files.get()[`${WORK_DIR}/${filePath}`];
+              actionLabel = existingFile ? 'Edit' : 'Create';
             }
           } else if (type === 'shell') {
             actionLabel = 'Run command';

app/components/chat/Markdown.module.scss

@@ -10,6 +10,11 @@ $code-font-size: 13px;
 .MarkdownContent {
   line-height: 1.6;
   color: var(--bolt-elements-textPrimary);
+  min-width: 0;
+  max-width: 100%;
+  overflow: hidden;
+  overflow-wrap: break-word;
+  word-wrap: break-word;
 
   > *:not(:last-child) {
     margin-block-end: 16px;
@@ -92,6 +97,8 @@ $code-font-size: 13px;
   pre {
     padding: 20px 16px;
     border-radius: 6px;
+    max-width: 100%;
+    overflow: hidden;
   }
 
   pre:has(> code) {

app/components/chat/UserMessage.tsx

@@ -32,7 +32,7 @@ export function UserMessage({ content, parts }: UserMessageProps) {
     const textContent = stripMetadata(textItem?.text || '');
 
     return (
-      <div className="overflow-hidden flex flex-col gap-3 items-end w-full">
+      <div className="overflow-hidden flex flex-col gap-3 items-end w-full min-w-0">
         <div className="flex flex-row items-center gap-2 self-end">
           {profile?.avatar || profile?.username ? (
             <div className="flex items-center gap-2">
@@ -56,9 +56,9 @@ export function UserMessage({ content, parts }: UserMessageProps) {
             </div>
           )}
         </div>
-        <div className="flex flex-col gap-3 max-w-[85%] ml-auto">
+        <div className="flex flex-col gap-3 max-w-[85%] ml-auto overflow-hidden">
           {textContent && (
-            <div className="text-bolt-elements-textPrimary text-sm leading-relaxed">
+            <div className="text-bolt-elements-textPrimary text-sm leading-relaxed min-w-0">
               <Markdown html>{textContent}</Markdown>
             </div>
           )}
@@ -85,7 +85,7 @@ export function UserMessage({ content, parts }: UserMessageProps) {
   const textContent = stripMetadata(content);
 
   return (
-    <div className="flex flex-col items-end gap-3 w-full">
+    <div className="flex flex-col items-end gap-3 w-full min-w-0">
       <div className="flex items-center gap-2">
         {profile?.avatar ? (
           <>
@@ -107,7 +107,7 @@ export function UserMessage({ content, parts }: UserMessageProps) {
           </>
         )}
       </div>
-      <div className="max-w-[85%] ml-auto">
+      <div className="max-w-[85%] ml-auto overflow-hidden">
         {images.length > 0 && (
           <div className="flex flex-wrap gap-2 mb-3">
             {images.map((item, index) => (
@@ -121,7 +121,7 @@ export function UserMessage({ content, parts }: UserMessageProps) {
             ))}
           </div>
         )}
-        <div className="text-bolt-elements-textPrimary text-sm leading-relaxed">
+        <div className="text-bolt-elements-textPrimary text-sm leading-relaxed min-w-0">
           <Markdown html>{textContent}</Markdown>
         </div>
       </div>

app/lib/.server/llm/stream-text.ts

@@ -52,10 +52,76 @@ function getCompletionTokenLimit(modelDetails: ModelInfo): number {
   return Math.min(MAX_TOKENS, 16384);
 }
 
+/*
+ * Essential files whose content the LLM needs to see in the template message.
+ * Everything else (shadcn components, etc.) gets replaced with "..." to save tokens.
+ */
+const ESSENTIAL_FILE_PATTERNS = [
+  'package.json',
+  'vite.config.ts',
+  'vite.config.js',
+  'tsconfig.json',
+  'tsconfig.app.json',
+  'tsconfig.node.json',
+  'tailwind.config.js',
+  'tailwind.config.ts',
+  'postcss.config.js',
+  'postcss.config.mjs',
+  'components.json',
+  'index.html',
+  'src/App.tsx',
+  'src/App.jsx',
+  'src/main.tsx',
+  'src/main.jsx',
+  'src/index.tsx',
+  'src/index.jsx',
+  'src/index.css',
+  'src/App.css',
+  'src/lib/utils.ts',
+  'src/vite-env.d.ts',
+  'app/root.tsx',
+  'app/entry.client.tsx',
+  'app/entry.server.tsx',
+  'next.config.js',
+  'next.config.ts',
+  'next.config.mjs',
+];
+
+function isEssentialFile(filePath: string): boolean {
+  return ESSENTIAL_FILE_PATTERNS.some((pattern) => filePath === pattern || filePath.endsWith(`/${pattern}`));
+}
+
+/**
+ * Simplify non-essential boltAction file contents to "..." to reduce token usage.
+ * Essential config/entry files keep their full content so the LLM understands the project structure.
+ * Lock files are stripped entirely (they're huge and the LLM never needs them).
+ */
+function simplifyTemplateActions(text: string): string {
+  /* Strip lock files entirely — they can be 6000+ lines (~25K tokens) */
+  let result = text.replace(
+    /<boltAction type="file" filePath="(?:package-lock\.json|yarn\.lock|pnpm-lock\.yaml)">[\s\S]*?<\/boltAction>/g,
+    '',
+  );
+
+  /* Replace non-essential file contents with "..." */
+  result = result.replace(
+    /(<boltAction[^>]*type="file"[^>]*filePath="([^"]+)"[^>]*>)([\s\S]*?)(<\/boltAction>)/g,
+    (match, openTag: string, filePath: string, _content: string, closeTag: string) => {
+      if (isEssentialFile(filePath)) {
+        return match;
+      }
+
+      return `${openTag}...${closeTag}`;
+    },
+  );
+
+  return result;
+}
+
 function sanitizeText(text: string): string {
   let sanitized = text.replace(/<div class=\\"__boltThought__\\">.*?<\/div>/s, '');
   sanitized = sanitized.replace(/<think>.*?<\/think>/s, '');
-  sanitized = sanitized.replace(/<boltAction type="file" filePath="package-lock\.json">[\s\S]*?<\/boltAction>/g, '');
+  sanitized = simplifyTemplateActions(sanitized);
 
   return sanitized.trim();
 }

app/lib/persistence/useChatHistory.ts

@@ -63,6 +63,9 @@ export function useChatHistory() {
   // Track last snapshot parameters so debounced file-change saves use the same message ID
   const lastSnapshotParamsRef = useRef<{ chatIdx: string; chatSummary?: string } | null>(null);
 
+  /* Serialization lock to prevent concurrent storeMessageHistory calls which cause 'urlId' uniqueness constraint errors in IndexedDB */
+  const isStoringRef = useRef(false);
+
   useEffect(() => {
     if (!db) {
       setReady(true);
@@ -358,80 +361,94 @@ export function useChatHistory() {
         return;
       }
 
-      const { firstArtifact } = workbenchStore;
-      messages = messages.filter((m) => !m.annotations?.includes('no-store'));
-
       /*
-       * Ensure chatId is set on the very first message.
-       * Always use a sequential numeric ID from getNextId() for consistency.
+       * Skip if another storeMessageHistory call is already in-flight.
+       * The 50ms sampler will try again with the latest messages.
        */
-      if (initialMessages.length === 0 && !chatId.get()) {
-        const nextId = await getNextId(db);
-        chatId.set(nextId);
-        versionsStore.setDBContext(db, nextId);
+      if (isStoringRef.current) {
+        return;
       }
 
-      /*
-       * Ensure urlId is set once and never changes.
-       * Derive it from the numeric chatId so URLs are always consistent
-       * (e.g. /chat/1, /chat/2) regardless of whether artifacts exist.
-       * Previously, artifact-based IDs like "2-1771470328283-0" were used
-       * when the AI generated artifacts, causing inconsistent URLs.
-       */
-      let resolvedUrlId = urlId;
+      isStoringRef.current = true;
 
-      if (!resolvedUrlId) {
-        const id = chatId.get()!;
-        resolvedUrlId = await getUrlId(db, id);
-        setUrlId(resolvedUrlId);
-        navigateChat(resolvedUrlId);
-      }
+      try {
+        const { firstArtifact } = workbenchStore;
+        messages = messages.filter((m) => !m.annotations?.includes('no-store'));
+
+        /*
+         * Ensure chatId is set on the very first message.
+         * Always use a sequential numeric ID from getNextId() for consistency.
+         */
+        if (initialMessages.length === 0 && !chatId.get()) {
+          const nextId = await getNextId(db);
+          chatId.set(nextId);
+          versionsStore.setDBContext(db, nextId);
+        }
+
+        /*
+         * Ensure urlId is set once and never changes.
+         * Derive it from the numeric chatId so URLs are always consistent
+         * (e.g. /chat/1, /chat/2) regardless of whether artifacts exist.
+         * Previously, artifact-based IDs like "2-1771470328283-0" were used
+         * when the AI generated artifacts, causing inconsistent URLs.
+         */
+        let resolvedUrlId = urlId;
+
+        if (!resolvedUrlId) {
+          const id = chatId.get()!;
+          resolvedUrlId = await getUrlId(db, id);
+          setUrlId(resolvedUrlId);
+          navigateChat(resolvedUrlId);
+        }
 
-      let chatSummary: string | undefined = undefined;
-      const lastMessage = messages[messages.length - 1];
+        let chatSummary: string | undefined = undefined;
+        const lastMessage = messages[messages.length - 1];
 
-      if (lastMessage.role === 'assistant') {
-        const annotations = lastMessage.annotations as JSONValue[];
-        const filteredAnnotations = (annotations?.filter(
-          (annotation: JSONValue) =>
-            annotation && typeof annotation === 'object' && Object.keys(annotation).includes('type'),
-        ) || []) as (Record<string, unknown> & { type: string })[];
+        if (lastMessage.role === 'assistant') {
+          const annotations = lastMessage.annotations as JSONValue[];
+          const filteredAnnotations = (annotations?.filter(
+            (annotation: JSONValue) =>
+              annotation && typeof annotation === 'object' && Object.keys(annotation).includes('type'),
+          ) || []) as (Record<string, unknown> & { type: string })[];
 
-        if (filteredAnnotations.find((annotation) => annotation.type === 'chatSummary')) {
-          chatSummary = filteredAnnotations.find((annotation) => annotation.type === 'chatSummary')?.summary as
-            | string
-            | undefined;
+          if (filteredAnnotations.find((annotation) => annotation.type === 'chatSummary')) {
+            chatSummary = filteredAnnotations.find((annotation) => annotation.type === 'chatSummary')?.summary as
+              | string
+              | undefined;
+          }
         }
-      }
 
-      // Save params so debounced file-change subscriber can re-save with updated files
-      lastSnapshotParamsRef.current = { chatIdx: messages[messages.length - 1].id, chatSummary };
+        // Save params so debounced file-change subscriber can re-save with updated files
+        lastSnapshotParamsRef.current = { chatIdx: messages[messages.length - 1].id, chatSummary };
 
-      takeSnapshot(messages[messages.length - 1].id, workbenchStore.files.get(), resolvedUrlId, chatSummary);
+        takeSnapshot(messages[messages.length - 1].id, workbenchStore.files.get(), resolvedUrlId, chatSummary);
 
-      if (!description.get() && firstArtifact?.title) {
-        description.set(firstArtifact?.title);
-      }
+        if (!description.get() && firstArtifact?.title) {
+          description.set(firstArtifact?.title);
+        }
 
-      // Ensure chatId.get() is used for the final setMessages call
-      const finalChatId = chatId.get();
+        // Ensure chatId.get() is used for the final setMessages call
+        const finalChatId = chatId.get();
 
-      if (!finalChatId) {
-        logger.error('Cannot save messages, chat ID is not set.');
-        toast.error('Failed to save chat messages: Chat ID missing.');
+        if (!finalChatId) {
+          logger.error('Cannot save messages, chat ID is not set.');
+          toast.error('Failed to save chat messages: Chat ID missing.');
 
-        return;
-      }
+          return;
+        }
 
-      await setMessages(
-        db,
-        finalChatId,
-        [...archivedMessages, ...messages],
-        resolvedUrlId, // Always use the resolved urlId, not stale useState
-        description.get(),
-        undefined,
-        chatMetadata.get(),
-      );
+        await setMessages(
+          db,
+          finalChatId,
+          [...archivedMessages, ...messages],
+          resolvedUrlId, // Always use the resolved urlId, not stale useState
+          description.get(),
+          undefined,
+          chatMetadata.get(),
+        );
+      } finally {
+        isStoringRef.current = false;
+      }
     },
     duplicateCurrentChat: async (listItemId: string) => {
       if (!db || (!mixedId && !listItemId)) {

app/lib/runtime/action-runner.ts

@@ -454,10 +454,32 @@ export class ActionRunner {
       unreachable('Shell terminal not found');
     }
 
-    const resp = await shell.executeCommand(this.runnerId.get(), action.content, () => {
+    /*
+     * Dev servers (npm run dev, vite, etc.) run indefinitely and never exit,
+     * so shell.executeCommand() would never resolve. We race the execution
+     * against a timeout — if the command hasn't exited after the timeout,
+     * the server started successfully and we mark the action complete.
+     * If the command exits quickly (e.g. port conflict), we catch the error.
+     */
+    const SERVER_READY_TIMEOUT = 5000;
+
+    const execPromise = shell.executeCommand(this.runnerId.get(), action.content, () => {
       logger.debug(`[${action.type}]:Aborting Action\n\n`, action);
       action.abort();
     });
+
+    const timeoutPromise = new Promise<'server-running'>((resolve) =>
+      setTimeout(() => resolve('server-running'), SERVER_READY_TIMEOUT),
+    );
+
+    const result = await Promise.race([execPromise, timeoutPromise]);
+
+    if (result === 'server-running') {
+      logger.debug(`${action.type}: Dev server is running (command did not exit within ${SERVER_READY_TIMEOUT}ms)`);
+      return undefined;
+    }
+
+    const resp = result;
     logger.debug(`${action.type} Shell Response: [exit code:${resp?.exitCode}]`);
 
     if (resp?.exitCode != 0) {
@@ -550,6 +572,13 @@ export class ActionRunner {
     try {
       let contentToWrite = action.content;
 
+      /*
+       * Safety net: Strip any leaked bolt XML tags from file content.
+       * This can happen when the LLM omits closing tags and the parser's
+       * streaming path accidentally includes artifact/action markup.
+       */
+      contentToWrite = contentToWrite.replace(/<\/?boltArtifact[^>]*>/g, '').replace(/<\/?boltAction[^>]*>/g, '');
+
       /*
        * Safety net: When package.json is being overwritten, merge dependencies
        * from the existing file to prevent the LLM from accidentally dropping