From 31d8472f59a17e94d35bba7a5f3d4894084a82a6 Mon Sep 17 00:00:00 2001
From: Saoud Rizwan <7799382+saoudrizwan@users.noreply.github.com>
Date: Wed, 31 Jul 2024 19:25:26 -0400
Subject: [PATCH] Close current diff view when showing new edit right after;
 fix thinking tags rendering

---
 src/ClaudeDev.ts                      | 4 ++--
 webview-ui/src/components/ChatRow.tsx | 6 +++++-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/ClaudeDev.ts b/src/ClaudeDev.ts
index eb23c4e..ec2901b 100644
--- a/src/ClaudeDev.ts
+++ b/src/ClaudeDev.ts
@@ -418,7 +418,7 @@ export class ClaudeDev {
 
 				await fs.writeFile(filePath, newContent)
 				// Finish by opening the edited file in the editor
-				vscode.window.showTextDocument(vscode.Uri.file(filePath), { preview: false })
+				await vscode.window.showTextDocument(vscode.Uri.file(filePath), { preview: false })
 				return `Changes applied to ${filePath}:\n${diffResult}`
 			} else {
 				const fileName = path.basename(filePath)
@@ -449,7 +449,7 @@ export class ClaudeDev {
 				}
 				await fs.mkdir(path.dirname(filePath), { recursive: true })
 				await fs.writeFile(filePath, newContent)
-				vscode.window.showTextDocument(vscode.Uri.file(filePath), { preview: false })
+				await vscode.window.showTextDocument(vscode.Uri.file(filePath), { preview: false })
 				return `New file created and content written to ${filePath}`
 			}
 		} catch (error) {
diff --git a/webview-ui/src/components/ChatRow.tsx b/webview-ui/src/components/ChatRow.tsx
index 4af8b56..76a6d0e 100644
--- a/webview-ui/src/components/ChatRow.tsx
+++ b/webview-ui/src/components/ChatRow.tsx
@@ -122,10 +122,14 @@ const ChatRow: React.FC<ChatRowProps> = ({
 
 	const renderMarkdown = (markdown: string = "") => {
 		// react-markdown lets us customize elements, so here we're using their example of replacing code blocks with SyntaxHighlighter. However when there are no language matches (` or ``` without a language specifier) then we default to a normal code element for inline code. Code blocks without a language specifier shouldn't be a common occurrence as we prompt Claude to always use a language specifier.
+		// when claude wraps text in thinking tags, he doesnt use line breaks so we need to insert those ourselves to render markdown correctly
+		const parsed = markdown.replace(/<thinking>([\s\S]*?)<\/thinking>/g, (match, content) => {
+			return `_<thinking>_\n\n${content}\n\n_</thinking>_`
+		})
 		return (
 			<div style={{ wordBreak: "break-word", overflowWrap: "anywhere" }}>
 				<Markdown
-					children={markdown}
+					children={parsed}
 					components={{
 						p(props) {
 							const { style, ...rest } = props