Creating an advanced LLM Copilot Extension for VS Code IDE
Closed this issue · 4 comments
Is your feature request related to a problem? Please describe.
This extension was developed to enhance coding efficiency by integrating advanced language models like Llama 3.1, OpenAI’s GPT-3.5-turbo, and Gemini 1.5. These models offer powerful code generation, suggestion capabilities, and the ability to solve complex coding problems. The extension is designed with a user-friendly interface and can be easily integrated into your existing workflow.
Describe the solution you'd like
Solutions implemented through:
Model Integration: Supports switching between Llama 3.1, GPT-3.5-turbo, and Gemini models.
Code Generation: Generates code snippets, solves LeetCode & DSA problems, and supports autocompletion
User-Friendly Interface: Simplified design for ease of use, allowing users to interact with the AI seamlessly
Describe alternatives you've considered
LLM Copilot Extension in VS Code
Introduction:
Welcome to the documentation for the VS Code Copilot Extension, which I created. This extension was developed to enhance coding efficiency by integrating advanced language models like Llama 3.1, OpenAI’s GPT-3.5-turbo, and Gemini 1.5. These models offer powerful code generation, suggestion capabilities, and the ability to solve complex coding problems. The extension is designed with a user-friendly interface and can be easily integrated into your existing workflow.
Prerequisites:
Before using this extension, we need to ensure that we have the following installed on our system:
Visual Studio Code (version 1.92.0 or higher)
Node.js (for running the extension)
TypeScript (for compiling TypeScript files) Additionally, we need to make sure that we have access to API keys from Together.ai, Groq, OpenAI, or other supported providers to interact with the language models.
Installation:
First we clone this repository
We then run “npm install” to install all necessary dependencies.
Thereafter , we use the command npm run compile to compile the TypeScript files.
Now to test the extension,we need to press F5 in VS Code to open a new window with the extension running or run the following command in terminal window : code --extensionDevelopmentPath=D:\Extension\extension\ ( according to our exact file location path)
Overview of package.json
The package.json file is crucial as it defines the extension’s metadata, dependencies, and commands. Key elements include:
Name and Version: The extension is named codesuggestion with version 0.0.1.
Engines: Specifies compatibility with VS Code version 1.92.0 or higher.
Contributes: Defines the command extension.openChat to open the chat interface.
Scripts: Includes commands for compiling TypeScript, linting, and testing.
Dependencies: Includes axios for API calls and development dependencies for TypeScript, linting, and testing.
Setting Up the Command in extension.ts:
The extension.ts file contains the core logic:
Imports: Includes necessary modules like vscode and axios.
Activate Function: The entry point when the extension is activated, where the command extension.openChat is registered.
Webview Setup: The command triggers a Webview panel that displays the chat interface, allowing users to interact with the AI.
Making API Calls to AI Models:
The getCodeSnippet function is central to the extension’s operation:
Functionality: Sends a POST request to the selected AI model's API, passing the user’s query.
Response Handling: The response is processed and the code snippet is returned and displayed in the Webview.
User Interface:
The user interface is designed using HTML, CSS, and JavaScript:
Chat Interface: Users can input queries and select the desired AI model from a dropdown menu.
Response Display: The AI’s response is displayed in a code block format for easy copying and pasting.
Features:
Model Integration: Supports switching between Llama 3.1, GPT-3.5-turbo, and Gemini models.
Code Generation: Generates code snippets, solves LeetCode & DSA problems, and supports autocompletion
User-Friendly Interface: Simplified design for ease of use, allowing users to interact with the AI seamlessly
Approach to be followed (optional)
A clear and concise description of the approach to be followed.
Additional context
Add any other context or screenshots about the feature request here.
Thanks for creating the issue in ML-Nexus!🎉
Before you start working on your PR, please make sure to:
- ⭐ Star the repository if you haven't already.
- Pull the latest changes to avoid any merge conflicts.
- Attach before & after screenshots in your PR for clarity.
- Include the issue number in your PR description for better tracking.
Don't forget to follow @UppuluriKalyani – Project Admin – for more updates!
Tag @Neilblaze,@SaiNivedh26 for assigning the issue to you.
Happy open-source contributing!☺️
@UppuluriKalyani Please review once
Thanks for raising this issue! However, we believe a similar issue already exists. Kindly go through all the open issues and ask to be assigned to that issue.
Hello @Panchadip-128! Your issue #515 has been closed. Thank you for your contribution!