First: The extension for use AI in VSCODE

Bito AI User Guide for Visual Studio Code

Installation

1. Open Visual Studio Code (VSCode) on your computer.
2. Go to the Extensions view by clicking on the square icon on the left sidebar or by pressing Ctrl+Shift+X ( Cmd+Shift+X on macOS).
3. In the search bar, type "Bito AI" and press Enter.
4. Click on the "Bito AI" extension from the search results.
5. Click the "Install" button to install the Bito AI extension.
6. Wait for the installation to complete.

Configuration

1. After installing the Bito AI extension, go to the VSCode settings by clicking on the gear icon on the left sidebar or by pressing Ctrl+, ( Cmd+, on macOS).
2. In the settings, search for "Bito AI".
3. Configure the following settings according to your preferences:
   • bito-ai.apiKey : Enter your Bito AI API key.
   • bito-ai.defaultLanguage : Set the default language for Bito AI.
   • bito-ai.maxTokens : Set the maximum number of tokens to generate per request.
   • bito-ai.temperature : Set the temperature for text generation (higher values for more randomness).
   • bito-ai.topP : Set the top-p value for text generation (higher values for more diversity).
4. Save the settings.

Using Bito AI

1. Open a new or existing file in VSCode.
2. To generate text using Bito AI, use the following steps:
   • Select the text or position the cursor where you want to generate text.
   • Open the command palette by pressing Ctrl+Shift+P ( Cmd+Shift+P on macOS).
   • Type "Bito AI" in the command palette and select the "Bito AI: Generate Text" command.
   • Bito AI will generate text based on the selected context and display it in the editor.
3. To customize the generated text, you can modify the Bito AI settings or adjust the selected context.

\

Second: Prompt Templates examples

Access the template area

Create a new prompt template

Define the prompt for you documentation task.

An example for media wiki documentation task:

Your task is to analyze the code given below for create documentation in english.
Generate all lines of documentation without any whitespace at the beginning of the line.
The documentation generatede was based on the mediawiki standard following the template below:

-----
=== '''<Here show the function name>''' === 

''<Explain code in paragraph>''

{{Codesample
| code = {{%code%}}

| lang = javascript
| name = <Here show the function name>
| line = 1
| start = 1
| scheme = light
}}

===='''Inputs:'''====  
''<Bulleted List and explain each function inputs. If no inputs is found, output "No input parameters for this function.">''

===='''Output:'''====  
''<Bulleted List and explain each function outputs.''

===='''Use'''====

''<Here describe in bullet steps and in datails, the function utilization>''

{{Codesample
| code = <Given a code example for the call function>;
| lang = javascript
| name = Use example:
| line = 1
| start = 1
| scheme = light
}}
<hr>

An example for generate a diagram based in plantUML

Generate a colorful PlantUML activity diagram based on the following complex react code snippet
 detail user interaction for all steps. In steps show the funtions call and your parameters.  In diagram, use diferente colours.The snippet code from above.

An example for generate a diagram based in plantUML

Generate a colourful PlantUML activity diagram based on the following complex react code snippet
 with user interaction: (include the react code snippet from above)