The Freddy AI Copilot for Developers extension helps developers accelerate app development on the Freshworks platform through AI-assisted code generation, design translation, migration, and productivity tools. Below are the key features available in the extension.
Conversation to code
Interact with Freddy in plain language to generate, explain, or debug code. Freddy understands context from your project, helping you complete coding tasks faster.
Examples:
- “Explain how this API call works.”
- “Generate code to fetch contacts from Freshdesk API.”
- “Fix this validation logic.”
Freddy AI supports two ways of interaction that help you generate, refine, and manage code efficiently: Ask mode and Agent mode.
These modes describe how Freddy AI responds to prompts and the level of automation involved when working with your app project.
Ask mode
Ask mode is a conversational and prompt-driven interaction model. In this mode, you can ask Freddy questions or describe the functionality you want to build. Freddy responds with explanations or code snippets that you can review and incorporate into your app.
To use Ask mode,
Open Visual Studio Code and launch the Freddy AI Copilot for Developers sidebar.
In the Agent | Ask toggle, select Ask.
Enter prompt, for example, “Generate a function to validate ticket fields.”
Freddy returns an explanation or code snippet based on your request.
Review the generated output and choose whether to copy the code or insert it directly into the currently open file.
Freddy AI supports implicit context awareness. When enabled, Freddy automatically includes relevant code from your workspace when responding to prompts in Ask mode, even if you do not explicitly reference a file or code block. This improves response accuracy for natural-language queries but may increase token consumption. This setting does not modify your files and applies only to Ask mode. To learn more about this setting, see Configure the extension > Enable Implicit Context Awareness.
Agent mode
Agent mode is an action-oriented workflow where Freddy can do tasks that modify your project files. While you still initiate the action, Freddy applies the updates directly, reducing the amount of manual editing you need to do.
To use agent mode,
Open Visual Studio Code and launch the Freddy AI Copilot for Developers sidebar.
In the Agent | Ask toggle, select Agent.
Enter prompt, for example, “Add deal module to manifest.json file”
Freddy analyzes your existing project and detects where the deal module should be added in the manifest.json file.
Review the proposed changes and choose to approve, discard, or preview them before finalizing the update.
Use case to code
Convert natural language descriptions into working app code.
You can describe what you want your app to do, and Freddy generates the required app structure, boilerplate code, and components.
Follow these steps to create a new app using the Use case to Code feature:
Open Visual Studio Code and launch the Freddy AI Copilot for Developers sidebar.
Under the Start a New App section, click Use-case to Code.
When prompted, enter a name for your new folder.
- By default, the folder is created in your home directory (~/).
- The folder name is also used as the app name.
When prompted, enter your app use case in the text box and click Generate Description.
Freddy AI generates an app description and displays it for review.
- To edit the generated description, click Modify Description.
- To approve it and continue building the app, click Approve Description & Build.
After you approve the app description, Freddy AI begins generating the app code.
The time taken may vary depending on the complexity of your use case.
Once the app code is generated, Freddy prompts you to review it.
- To accept the generated code, click Accept app code.
- To reject and regenerate, click Reject all.
After you accept the app code, a success message confirms that the generated app code is available in the folder you created.
You can now open the folder to review the generated files, explore the app structure, and begin customizing the app logic and UI.
AI-assisted app migration
Upgrade your apps to the latest platform versions safely and efficiently. Freddy analyzes changelogs, detects deprecated methods, and automatically suggests or applies code updates.
Key capabilities:
- Identify outdated APIs and configurations.
- Propose version-compatible replacements.
- Review and apply migration suggestions directly in VS Code.
Important:This feature is supported on FDK versions 9.0.x to 9.7.4.
To perform app migration,
Launch Visual Studio Code and navigate to the app project that is currently on platform version 2.X.
Open the Freddy AI Copilot for Developers panel and click AI-Assisted App Migration to start the migration.
Migrations can take a few minutes (2-5 minutes) to complete. You can choose to wait or provide your email address so we can notify you once migration is complete. Come back later when a completion email is received.
Once migration is initiated, you will see following messages :
"Migration has started..."
"Migration is in progress..."
Once the migration is complete, you will be notified either via email or through a direct message in Visual Studio Code.
Once migration completes open the project if not already opened, and go to migration tab to review the changes :
- Merge Selected Files: Click Merge Selected Files to merge proposed code changes.
- Reject Changes: Click Reject All Changes to discard all updates and abort the migration process.
After accepting the changes, you will see the message: "Migration is successfully completed."
Test your app thoroughly to ensure all functionalities are working as expected.
If any errors occur, you can address them using Freddy AI or manually.
Once verified, submit the migrated app for review to ensure compliance with the latest standards.
Code refinement actions
Enhance your daily development workflow with built-in automation and analysis tools.
To use the code refinement actions,
Navigate to your app in Visual Studio Code.
Select a specific segment of the code.
Tip:It is recommended not to use large code blocks at once.
Right-click and select any of the following options:
- Freddy: Explain selection: Analyze the selection and provide insights into its functionality, helping you understand complex or unfamiliar code sections of the app.
- Freddy: Refactor selection: Improve readability and performance by letting Freddy restructure or optimize your code intelligently.
- Freddy: Review selection: Ask Freddy to review your code for structure, maintainability, and adherence to best practices.
- Freddy: Generate documentation: Generate markdown documentation for selected code blocks or entire modules, helping to keep the documentation up-to-date with minimal efforts.
- Freddy: Generate code comments: Automatically create inline comments that describe the purpose and logic of your code.
- Freddy: Generate Unit test (experimental): Automatically create test case stubs for your functions or modules.
- Freddy: Security Check: Run a security scan on your code to detect potential vulnerabilities and receive recommendations for fixes.
Once you select the appropriate option, Freddy AI generates the result and displays it in the conversation pane.
Incorporate the generated content or code in the selected segment.
Design to code (Experimental)
Note:Design to code is an experimental feature. Behavior and functionality may change in future releases. Transform visual designs into functional frontend code. Freddy converts Figma designs or uploaded images into responsive HTML and CSS code that follow Freshworks design guidelines and CRAYONS components. To use this feature,
Open Visual Studio Code and launch the Freddy AI Copilot for Developers sidebar.
Click the "Image" icon.
You will be prompted to upload files in JPEG/PNG format with image size being less than 15 MB.
Optionally, if you have added Figma API key under the extension settings, you can give figma URL
Preview, edit, or delete the uploaded image to ensure the right image is attached
Click Submit and enter the prompt.
The generated response will contain HTML code for the given design, you can preview the code, download the file, copy the content or use it in an existing file.