WIP

TODO

• Support autocomplete outside of localhost
• Allows user to select LLM
• Code selection for autocomplete
• RAG for code in directory

AI Code Editor Features

highlight-code-change.mov

code-autocomplete.mov

code-fim.mov

tab-nav.mov

code-summary.mov

code-updates.mov

Features

• Code Editing: Supports editing Python code with line numbers.
• Syntax Highlighting: Uses Prism.js with a light theme.
• Autocomplete: Fetches code suggestions from an OpenAI API server based on the provided code.
• Keyboard Shortcuts:
  • Press Alt to fetch autocomplete suggestions.
  • Press Tab to insert suggestions into the editor.
  • Press Escape to clear suggestions.

Installation

1. Clone the repository:

   git clone https://github.com/tmickleydoyle/code-editor.git
   cd code-editor

2. Install dependencies:

   npm install

3. Start the development server:

   npm run dev

Usage

1. Open the application in your browser.
2. Edit Python code in the editor.
3. Press Alt to generate autocomplete suggestions.
4. Press Tab to merge the suggested code into your editor.

Note: For autocomplete, run an Ollama server locally.

Key Components

• CodeEditor Component: Handles the core functionality of the editor.
• monaco-editor: Lightweight code editor library.
• Prism.js: Provides syntax highlighting.