From 011d4ffbc909672b1b28e5a38c673a8d5fd4f319 Mon Sep 17 00:00:00 2001 From: Saoud Rizwan <7799382+saoudrizwan@users.noreply.github.com> Date: Sat, 27 Jul 2024 16:48:23 -0400 Subject: [PATCH] Fix scrolling to bottom; update system prompt to not unnecessarily read files before editing; add gif to README --- README.md | 15 +++++++++++++-- src/ClaudeDev.ts | 2 +- webview-ui/src/components/ChatView.tsx | 8 +++----- 3 files changed, 17 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index eadc244..34cc467 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ # Claude Dev
- [video]
+
@@ -12,7 +12,7 @@ Make Contribution
-Thanks to [Claude 3.5 Sonnet's agentic coding capabilities](https://www-cdn.anthropic.com/fed9cc193a14b84131812372d8d5857f8f304c52/Model_Card_Claude_3_Addendum.pdf) Claude Dev can handle complex software development tasks step-by-step. With tools that let him analyze project source code, read & write files, and execute terminal commands (after you grant permission), he can assist you in ways that go beyond simple code completion or tech support. From building software projects to running system operations, Claude Dev is only limited by your imagination. +Thanks to [Claude 3.5 Sonnet's agentic coding capabilities](https://www-cdn.anthropic.com/fed9cc193a14b84131812372d8d5857f8f304c52/Model_Card_Claude_3_Addendum.pdf) Claude Dev can handle complex software development tasks step-by-step. With tools that let him read & write files, analyze project source code, and execute terminal commands (after you grant permission), he can assist you in ways that go beyond simple code completion or tech support. From building software projects to running system operations, Claude Dev is only limited by your imagination. While autonomous AI scripts traditionally run in sandboxed environments, Claude Dev offers a human-in-the-loop GUI to supervise every file change and command executed, providing a safe and accessible way to explore the potential of agentic AI. @@ -64,10 +64,21 @@ To build Claude Dev locally, follow these steps: ``` 4. Launch by pressing `F5` to open a new VSCode window with the extension loaded +## Reviews + +- ["Claude Sonnet 3.5 Artifacts in VSCode With This Extension"](https://www.youtube.com/watch?v=5FbZ8ALfSTs) by [CoderOne](https://www.youtube.com/@CoderOne) +- ["Meet Claude Dev — An Open-Source AI Programmer In VS Code"](https://generativeai.pub/meet-claude-dev-an-open-source-autonomous-ai-programmer-in-vs-code-f457f9821b7b) by [Jim Clyde Monge](https://jimclydemonge.medium.com/) +- ["Code Smarter with Claude Dev: An AI Programmer for Your Projects"](https://www.linkedin.com/pulse/code-smarter-claude-dev-ai-programmer-your-projects-iana-detochka-jiqpe) by Iana D. +- [Claude Dev also hit top 10 posts of all time on r/ClaudeAI (thank you for all the lovely comments)](https://www.reddit.com/r/ClaudeAI/comments/1e3h0f1/my_submission_to_anthropics_build_with_claude/) + ## License This project is licensed under the MIT License. See the [LICENSE](./LICENSE) file for details. +## Questions? + +Contact me on twitter @sdrzn. Please create an issue if you come across a bug or would like a feature to be added. + ## Acknowledgments Special thanks to Anthropic for providing the API that powers this extension. diff --git a/src/ClaudeDev.ts b/src/ClaudeDev.ts index e2e3fd8..36aefb2 100644 --- a/src/ClaudeDev.ts +++ b/src/ClaudeDev.ts @@ -39,7 +39,7 @@ RULES vscode.workspace.workspaceFolders?.map((folder) => folder.uri.fsPath).at(0) ?? path.join(os.homedir(), "Desktop") } - Your current working directory is '${process.cwd()}', and you cannot \`cd\` into a different directory to complete a task. You are stuck operating from '${process.cwd()}', so be sure to pass in the appropriate 'path' parameter when using tools that require a path. -- Always read a file before editing it if you are missing content. This will help you understand the context and make informed changes. +- If you do not know the contents of an existing file you need to edit, use the read_file tool to help you make informed changes. However if you have seen this file before, you should be able to remember its contents. - When editing files, always provide the complete file content in your response, regardless of the extent of changes. The system handles diff generation automatically. - Before using the execute_command tool, you must first think about the System Information context provided by the user to understand their environment and tailor your commands to ensure they are compatible with the user's system. - When using the execute_command tool, avoid running servers or executing commands that don't terminate on their own (e.g. Flask web servers, continuous scripts). If a task requires such a process or server, explain in your task completion result why you can't execute it directly and provide clear instructions on how the user can run it themselves. diff --git a/webview-ui/src/components/ChatView.tsx b/webview-ui/src/components/ChatView.tsx index 2229474..128176d 100644 --- a/webview-ui/src/components/ChatView.tsx +++ b/webview-ui/src/components/ChatView.tsx @@ -309,10 +309,7 @@ const ChatView = ({ messages, isHidden, vscodeThemeName, showAnnouncement, hideA const timer = setTimeout(() => { // TODO: we can use virtuoso's isAtBottom to prevent scrolling if user is scrolled up, and show a 'scroll to bottom' button for better UX // NOTE: scroll to bottom may not work if you use margin, see virtuoso's troubleshooting - virtuosoRef.current?.scrollToIndex({ - index: "LAST", - behavior: "smooth", - }) + virtuosoRef.current?.scrollTo({ top: Number.MAX_SAFE_INTEGER, behavior: "smooth" }) }, 50) return () => clearTimeout(timer) @@ -425,7 +422,8 @@ const ChatView = ({ messages, isHidden, vscodeThemeName, showAnnouncement, hideA onChange={(e) => setInputValue(e.target.value)} onKeyDown={handleKeyDown} onHeightChange={() => - virtuosoRef.current?.scrollToIndex({ index: "LAST", align: "end", behavior: "auto" }) + //virtuosoRef.current?.scrollToIndex({ index: "LAST", align: "end", behavior: "auto" }) + virtuosoRef.current?.scrollTo({ top: Number.MAX_SAFE_INTEGER, behavior: "auto" }) } placeholder={task ? "Type a message..." : "Type your task here..."} maxRows={10}