1MEIC08T4: reFactorX - FEUP-MEIC-DS-2024-25/ai4sd GitHub Wiki

Deprecated, see: WhatTheDuck

Our product leverages AI to provide intelligent refactoring suggestions. By integrating the LiveRef plugin, it enhances the process with a pre-visualization of the proposed code changes, along with detailed comparisons to the existing code, including metrics like time and space complexity.

Ever felt like your code could use a tune-up but aren’t sure where to start? reFactorX is here to lend a guiding hand, running right within VS Code to sniff out code smells and suggest smarter refactorings. No more endless guessing or trial and error—just clear, informed decisions that make your code better.

reFactorX doesn’t just show you what could change; it walks you through the why. With every suggestion, you’ll see the impact on key metrics like time and space complexity, so you can know not just how the code improves, but also why it matters.

• Elevate code quality to meet today’s best practices and standards.
• Reduce the need for future refactoring by getting it right the first time.

It’s like having a refactoring mentor built right into your editor.

• Uses metaheuristics to analyze code and highlight potential areas for refactoring.
• Provides color-coded indicators within the code to mark areas needing improvement.
• Offers refactoring suggestions but does not include previews or code complexity metrics.

• AI-powered tool that continuously reviews code and suggests refactorings in real-time.
• Focuses on enhancing readability, reducing duplication, and simplifying complex logic.
• Provides side-by-side previews and explanations for suggested changes, but emphasizes readability over performance metrics.

• Uses AI with Graph Neural Networks (GNNs) to detect complex logical issues and vulnerabilities in code.
• Supports Python, JavaScript, TypeScript, C, C++, and Java.
• Provides explanations and actionable recommendations for detected issues.

• Analyzes code for maintainability and code smells using metaheuristic algorithms.
• Highlights issues like duplication and cyclomatic complexity, offering improvement options to reduce code bloat.
• Focused on maintainability, with limited preview capabilities but a strong emphasis on reducing complexity.

The tool is built around a three-component architecture, as illustrated in the diagram:

1. VS Code Extension (JavaScript):

   • Role: This component serves as the user-facing part of the tool. It allows the user to interact directly with the functionality through commands within VS Code. When a user selects code to analyze, the extension captures this input and sends it to the backend for processing.
   • Communication: The VS Code Extension sends commands to the backend via HTTP requests.

2. reFactorX Backend (TypeScript):

   • Role: This TypeScript-based backend is responsible for preparing and formatting the code selections for the AI system. It collects code snippets, constructs prompts, and manages API calls to the Gemini AI system. Additionally, it handles API keys, error processing, and prompt adjustments to ensure high-quality outputs from the AI.
   • Communication: The backend receives commands from the VS Code Extension and, using HTTP with a private API key, sends requests to the Gemini AI API.

3. Gemini API (Software System):

   • Role: This is an external AI service hosted by Google, responsible for generating code reviews, comments, and metrics based on the prompts. It takes a processed prompt from the backend and returns relevant outputs for code analysis and improvement.
   • Communication: The backend calls the Gemini API via HTTP and processes the AI’s responses to pass them back to the VS Code Extension for display to the user.

The design is set up in a modular way, splitting user interaction, backend processing, and AI generation. This keeps things flexible and scalable. The TypeScript backend acts as a central hub, making it easy to add support for other APIs down the line, so the tool can grow as needed. Plus, the VS Code Extension has a simple, lightweight interface that makes it easy for users, while the backend handles all the heavy lifting.

Overall, the architecture supports current needs effectively while laying the groundwork for potential future enhancements, making it robust and well-suited for scaling.

1. VS Code Extension API (JavaScript)

   • Description: This is used to create the VS Code extension, allowing users to interact directly within the editor to generate code comments and reviews.
   • Client Restriction: Yes. The client required the solution to integrate directly with VS Code to streamline the developer workflow.
   • Justification: Using the VS Code API is essential for building commands that can be triggered within the editor. This allows seamless interaction for code review and commenting, directly improving the user experience.

2. TypeScript (Backend Processing in reFactorX)

   • Description: TypeScript is used for building the backend logic that processes code selections, builds prompts, and interacts with the Gemini AI API.
   • Client Restriction: No. TypeScript was chosen for its type safety and improved maintainability.
   • Justification: TypeScript ensures more robust code by reducing runtime errors through static type-checking. It also improves developer productivity with features like autocompletion and better error detection, which are essential for backend logic that handles API responses and data transformation.

3. Google Gemini API

   • Description: Google’s Gemini API, accessed via the Google Generative AI SDK, provides the AI-powered text generation capabilities for creating code comments and reviews.
   • Client Restriction: Yes. The client specified the use of Gemini API for its advanced generative capabilities and integration with Google AI Studio.
   • Justification: Gemini API provides state-of-the-art generative text processing, which is critical for generating meaningful and contextually accurate code comments and reviews. It simplifies the implementation of AI-driven features by offering pre-trained models suitable for code understanding and improvement tasks.

In Sprint 0, the main focus was to develop a proof-of-concept to demonstrate the workflow of code review and comment generation within VS Code. The prototype involved setting up the core functionality of the extension, including:

• Basic VS Code command setup to capture selected code.
• Backend prompt-building logic for the Gemini API.
• Initial integration with Gemini API to fetch generative responses.

This prototype proved the feasibility of the integration and clarified the requirements for handling API responses, error handling, and user interaction. It also highlighted the need for further refinement of prompt-building and response formatting. This early stage helped shape subsequent sprints, establishing a foundation for a more robust backend and user-friendly experience.

This guide provides an overview for new developers on setting up, running, and contributing to the project. Follow these steps to get the development environment up and running, understand the coding conventions, and get familiar with the APIs and tools used.

To get started, make sure you have the following installed:

• Node.js
• VS Code

You may also need TypeScript. To install it, run:

npm install -g typescript

Once everything is set up, open this project in VS Code and install dependencies:

npm install

Now run the extension by pressing F5 or by running the command Start Debugging.

It should open a new vscode window with the extension running.

Open the command palette by pressing Ctrl+Shift+P and type Preferences: Open Settings (UI). In the settings window, search for Gemini: Api Key and set your Gemini API key there.

Now test the extension by opening the command palette and typing reFactorX: and run one of the commands.

Note: If a out folder is not created when you run the extension, you might need to run the command tsc in the terminal to compile the typescript files before running it.

Constants: Constants are defined with const and in uppercase (e.g., CODE_LABEL, REVIEW_LABEL), which aligns with best practices.

Identify potential security vulnerabilities classes and explain what the team has done to mitigate them.

Describe which tools are used for quality assurance and link to relevant resources. Namely, provide access to reports for coverage and mutation analysis, static analysis, and other tools that may be used for QA.

The extension is not currently published, so the only way to use it is by cloning and building it.

Simply clone the repository, take a look at the issues in the scrum board and follow the documentation in this wiki to familiarize yourself.

Below, a summary of the current features of reFactorX:

• Code refactoring suggestions - reFactorX analyzes the existing code and gives refactoring suggestions;
• Space Complexity analysis - reFactorX analyzes the existing code and calculates/gives info on the space complexity;
• Time Complexity analysis - reFactorX analyzes the existing code and calculates/gives info on the time complexity;
• Multi-file analysis - reFactorX analyzes all of the files in the project, instead of only the current one, in order to better understand interactions between them when suggesting refactoring;
• Code previews - Every suggestion is visible and explained before applying, so the developer can make an informed choice;

The following images illustrate the current features:

In Sprint 1, we successfully completed all the planned PBIs, and everyone managed to finish their assigned tasks on time. We had productive discussions and decided to merge the "reFactorX" plugin with "WhatTheDuck" and "ModifAI." This decision allowed us to consolidate efforts and streamline our approach moving forward.

Time management was a big problem. Additionally, we wero not able to deploy to the Hero Alliance and our Git workflow was not the best.

We still need to ensure that the backlog is continuously updated with the right priorities as other groups work on their respective tasks. Additionally, while we’re merged the plugins, further coordination may be necessary to ensure smooth integration across the entire system.

Deprecated, see: WhatTheDuck

• Team 4
  • João Coelho (PO)
  • Vasco Oliveira (SM)
  • João Mota
  • Pedro Oliveira
  • Ricardo Vieira
  • David Castro