is now available! Read about the new features and fixes from September.

The open source AI code editor

Download Visual Studio Code

By using VS Code, you agree to its license and privacy statement.

Agent Sessions
Local Chat Agent Refactoring MailList component structure GitHub Copilot Cloud Agent Extract MailListItem into standalone component 10 min #1
+42 -24
GitHub Copilot CLI Agent Start CLI Agent Session
MailList.tsx MailListItem.tsx Extract MailListItem into standalone component
import { For, createSignal, createMemo } from "solid-js";
import { useNavigate, useParams } from "@tanstack/solid-router";
import { getEmailsForMailbox } from "~/data/emails";
import { MailListItem } from "~/components/MailListItem";

export function MailList() {
  const params = useParams({ strict: false }) as {
    mailbox?: string;
    id?: string;
  };
  const navigate = useNavigate();
  const [query, setQuery] = createSignal("");
  const mailbox = () => params.mailbox || "inbox";
  const list = createMemo(() => {
    const q = query().toLowerCase();
    return getEmailsForMailbox(mailbox()).filter(
      (e) =>
        !q ||
        e.subject.toLowerCase().includes(q) ||
        e.snippet.toLowerCase().includes(q)
    );
  });
  function open(id: string) {
    navigate({
      to: "/mail/$mailbox/$id",
      params: { mailbox: mailbox(), id },
      search: (prev) => prev,
    });
  }

  return (
    <For each={list()}>
      {(e) => (
        <div
          role="listitem"
          tabindex={0}
          onClick={() => open(e.id)}
          onKeyDown={(ev) => ev.key === "Enter" && open(e.id)}
          class="mail-item"
          data-selected={params.id === e.id ? "true" : undefined}
          aria-selected={params.id === e.id ? "true" : undefined}
        >
          <div>
            <div class="mail-item-subject truncate">{e.subject}</div>
            <div class="mail-item-snippet truncate">{e.snippet}</div>
          </div>
          <time
            class="text-xs muted"
            datetime={e.date}
            title={new Date(e.date).toLocaleString()}
          >
            {new Date(e.date).toLocaleDateString(undefined, {
              month: "short",
              day: "numeric",
            })}
          </time>
        </div>
        <MailListItem
          email={e}
          isSelected={params.id === e.id}
          onOpen={open}
        />
      )}
    </For>
  );
}
Chat
Please update the MailList component to abstract mail list items into their own standalone component GitHub Copilot Cloud Agent Delegate to cloud agent The agent will work asynchronously to create a pull request with your requested changes. kenzi.lawson avatar kenzi.lawson selected "Delegate" GitHub Copilot Cloud Agent [WIP] Refactor MailList to abstract mail list items - Copilot Cloud agent has begun work on Please update the Ma... and will update this pull request as work progresses. Please update the MailList component to abstract individual mail list items into their own component Created from VS Code via the GitHub Pull Request extension. ✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo. GitHub Copilot cloud agent has begun working on your request. Follow its progress in the associated chat and pull request. MailList.tsx
Describe what to build next
Agent GPT-5

Any model for any team

Choose from multiple out of the box models, or bring your own key to access models from your preferred model and hosting provider.

Agent GPT-5
Auto Variable GPT-5 mini 0x Claude Haiku 4.5 0.33x Claude Sonnet 4 1x Claude Sonnet 4.5 1x GPT-5 1x GPT-5-Codex (Preview) 1x Manage Models...

An expert on your codebase

Your codebase is indexed locally and remotely to understand what's relevant, enabling fast, context-aware interactions.

AI that works the way your team does

Personalize interactions using custom agents, custom instructions, and reusable prompt files tailored to your workflows and tools.

Compact.chatmode.md AGENTS.md docs.instructions.md
---
                        description: 'Generate compact responses, focusing on brevity and clarity.'
                        tools: ['search', 'fetch', 'githubRepo', 'usages', 'vscodeAPI', 'problems', 'changes', 'testFailure', 'todos']
                        ---
                        You are a chat mode that provides extremely concise and clear responses. 
                        Your replies should be brief, to the point, and free of unnecessary details. 
                        Focus on delivering the essential information in a straightforward manner.
                        When responding, you must adhere to the following guidelines:
                        - Use short sentences and simple language.
                        - Prioritize clarity over completeness.
                        - Do not provide explanations or justifications unless explicitly asked.
                        - Do not provide any updates as you are working on the task –– only respond when the task is complete.
                        

Use AI features in VS Code for free

No trial. No credit card required. Just your GitHub account.

Try free

Agent mode

Tackle complex, multi-step tasks. Agent mode reads your codebase, suggests edits across files, runs terminal commands, and responds to compile or test failures — all in a loop until the job is done. Further refine agent mode to fit your team's workflows with VS Code extensions and Model Context Protocol (MCP) servers.

Build with agent mode
batch.go processor.go image_processor_test.go health.go main.go
package http

import (
    "io"
    "log/slog"
    "mime/multipart"
    "net/http"
    "strings"
)

type BatchItemResult struct {
    Name string `json:"name"`
    Metadata *struct {
        Format string `json:"format"`
        Width  int    `json:"width"`
        Height int    `json:"height"`
        Bytes  int    `json:"bytes"`
    } `json:"metadata,omitempty"`
    Error string `json:"error,omitempty"`
}

type BatchResponse struct {
    Results []*BatchItemResult `json:"results"`
    Count   int                `json:"count"`
    Success int                `json:"success"`
    Failed  int                `json:"failed"`
}

// handleProcessBatch processes multiple uploaded images (multipart/form-data) under the field name "files".
// It returns metadata for each image or an error per item without failing the whole batch unless the request is malformed.
func (s *Server) handleProcessBatch(w http.ResponseWriter, r *http.Request) {
    // Enforce max body size overall.
    r.Body = http.MaxBytesReader(w, r.Body, s.cfg.MaxUploadBytes)
    if ct := r.Header.Get("Content-Type"); !strings.HasPrefix(ct, "multipart/form-data") {
        s.writeJSON(w, http.StatusBadRequest, map[string]string{"error": "content type must be multipart/form-data"})
        return
    }
    if err := r.ParseMultipartForm(s.cfg.MaxUploadBytes); err != nil {
        status := http.StatusBadRequest
        if strings.Contains(err.Error(), "request body too large") {
            status = http.StatusRequestEntityTooLarge
        }
        s.writeJSON(w, status, map[string]string{"error": "invalid multipart form: " + err.Error()})
        return
    }

    // Accept files under the key "files". If absent, attempt to fallback to any file parts.
    var fileHeaders []*multipart.FileHeader
    if r.MultipartForm != nil && len(r.MultipartForm.File["files"]) > 0 {
        fileHeaders = r.MultipartForm.File["files"]
    } else if r.MultipartForm != nil {
        // Fallback: gather all files across keys.
        for _, fhs := range r.MultipartForm.File {
            fileHeaders = append(fileHeaders, fhs...)
        }
    }

    if len(fileHeaders) == 0 {
        s.writeJSON(w, http.StatusBadRequest, map[string]string{"error": "no files provided (expect key 'files')"})
        return
    }

    resp := &BatchResponse{Results: make([]*BatchItemResult, 0, len(fileHeaders))}

    for _, fh := range fileHeaders {
        item := &BatchItemResult{Name: fh.Filename}
        f, err := fh.Open()
        if err != nil {
            item.Error = "open file: " + err.Error()
            resp.Results = append(resp.Results, item)
            resp.Failed++
            continue
        }
        data, err := io.ReadAll(f)
        _ = f.Close()
        if err != nil {
            item.Error = "read file: " + err.Error()
            resp.Results = append(resp.Results, item)
            resp.Failed++
            continue
        }
        meta, err := s.proc.ExtractMetadata(data)
        if err != nil {
            item.Error = err.Error()
            resp.Results = append(resp.Results, item)
            resp.Failed++
            continue
        }
        // Copy into anonymous struct to decouple from internal type if it changes.
        item.Metadata = &struct {
            Format string `json:"format"`
            Width  int    `json:"width"`
            Height int    `json:"height"`
            Bytes  int    `json:"bytes"`
        }{Format: meta.Format, Width: meta.Width, Height: meta.Height, Bytes: meta.Bytes}
        resp.Results = append(resp.Results, item)
        resp.Success++
    }

    resp.Count = len(resp.Results)
    s.log.LogAttrs(r.Context(), slog.LevelInfo, "batch processed", slog.Int("count", resp.Count), slog.Int("success", resp.Success), slog.Int("failed", resp.Failed))
    s.writeJSON(w, http.StatusOK, resp)
}
Copilot Claude Code Claude Code Codex Codex Cline Cline Gemini Gemini Chat
I'm building an image processing service. Can you please create a new endpoint that implements support for batch image processing?
Creating a todo list I'm starting with the todo list creation, managing tasks like reading the existing server and processor code, designing the batch endpoint contract, and implementing a new file with a handler. I want to wire the handler into server routes and maybe add a minimal test for the batch endpoint, though that's optional. I'll also plan to run tests and build everything afterward. Let's get this executed!
Creating a structured todo list for implementing the batch image processing endpoint. Created 7 todos Reading core files to understand current server and image processing implementation before adding batch endpoint. Read server.go Read processor.go Read logging.go Read health.go
Improving file processing... I could modify server.go, but they've asked for a new file. So, I need to create a route, let's call it /process/batch. I'll enforce a max body size and ensure the content type is multipart/form-data. Next, I'm going to parse the form and iterate over form.File["files"]. For each FileHeader, I'll open it and read the bytes, then call ExtractMetadata to collect results. Finally, I'll return a structured JSON response with results and handle edge cases for no files and max batch limits. I think it might not be absolutely necessary, but I'm considering a small improvement by using sync.WaitGroup to process each file sequentially while limiting concurrency. This would make the initial commit simpler. I need to add the code file and import the internal/image referencing alias. Next, I'll check out the existing tests in tests/image_processor_test.go to see the style and determine if I should create a new test file for the batch handler. I'll read through that and then update the todo statuses, marking tasks one and two as completed.
Reading existing test to mirror style before adding batch endpoint and then will proceed with design and implementation. Read image_processor_test.go
Preparing for HTTP test I need to run an HTTP test, but I notice that the current test package is in 'tests' and not within the main modules. To conduct the HTTP test, I'll have to set up a few things like the config, processor, logger, and server, plus send a multipart request. My next step is to check the config in config.go to understand what required fields I need to include. Let's dive into that!
Reading config to construct server in HTTP test. Read config.go
Managing updates and patches I need to use the manage_todo_list to keep everything organized, ensuring I don't lose track of any tasks. Once that's done, I can proceed with applying the patch. It will involve adding a new file and making edits to server.go. I want to make sure everything is clear and accurate during this process to avoid any mistakes along the way. Let's keep moving forward!
Starting (3/7) Design batch contract
Implementing updates and tests I'm marking the design contract as complete, and then I need to implement the updates. I'll proceed with managing the todo list and apply the patch to add a file and update server.go. It seems I might need to add a route for /process/batch in server.go and implement a new file internal/http/batch.go. After writing the code, I'll add a test file, run the tests with go test, and use run_in_terminal commands. Let's get to it!
Completed (3/7) Design batch contract Applying patch to add batch handler and route plus test. server.go +1 -0 batch.go +106 -0 batch_endpoint_test.go +123 -0 Implemented a new batch image processing endpoint: Files changed / added
  • server.go: Registered new route POST /process/batch.
  • batch.go: New handler handleProcessBatch that:
    • Accepts multipart/form-data.
    • Reads multiple files under the files key (falls back to any file parts if files missing).
    • Returns per-file success/error without failing the whole batch.
    • Aggregates counts: count, success, failed.
  • batch_endpoint_test.go: Tests happy path (1 valid + 1 invalid file) and missing files error case.
Suggested next steps (optional)
  • Add a configurable max files per batch (e.g., via config).
  • Stream processing with limited memory (process + discard) for very large images.
  • Optional parallelism with a worker pool and context cancellation.
  • Add size validation per file before decoding.
  • Support JSON-based batch (URLs or base64) for non-multipart clients.
Let me know if you'd like any of those enhancements or prefer a different request/response format.
batch.go
Describe what to build next
Agent GPT-5

Next edit suggestions

VS Code predicts your next move as you code. Use the Tab key to accept AI-powered suggestions right in your editor. It intelligently recommends what to change — and where — based on the edits you're already making.

Code with AI-powered suggestions
main.py
import numpy as np
import pandas as pd

iris_data = pd.read_csv("iris_dataset.csv")

def describe(species: str) -> pd.Series:
7
subset = data[data["species"] == species]           subset = iris_data[iris_data["species"] == species] if subset.empty: raise ValueError(f"{species} missing from sample") return subset[["petal", "sepal"]].agg(["mean", "std"]).loc["mean"] def summary():
13
for species in np.sort(data["species"].unique()):      for species in np.sort(iris_data["species"].unique()): try: stats = describe(species) except ValueError: print(f"{species}: no records") continue print(f"{species}: petal={stats['petal']:.2f} sepal={stats['sepal']:.2f}") if __name__ == "__main__": summary()

Code in any language

VS Code supports almost every major programming language. Several ship in the box, like JavaScript, TypeScript, CSS, and HTML, but extensions for others can be found in the VS Code Marketplace.

JavaScript iconJavaScript
TypeScript iconTypeScript
Python iconPython
C# iconC#
C++ iconC++
HTML iconHTML
Java iconJava
JSON iconJSON
PHP iconPHP
Markdown iconMarkdown
Powershell iconPowershell
YAML iconYAML

Fully customizable

Customize your VS Code UI and layout so that it fits your coding style.

Color themes let you modify the colors in VS Code's user interface to suit your preferences and work environment.

Settings Sync enables you to share your user settings across your VS Code instances with the Settings Sync feature.

Profiles let you create sets of customizations and quickly switch between them or share them with others.

Selecting the GitHub Dark theme with a quick pick Selecting the GitHub Dark theme with a quick pick

Code anywhere

Code wherever you're most productive, whether you're connected to the cloud, a remote repository, or in the browser with VS Code for the Web (vscode.dev).

Built-in Source Control empowers you with Git support out-of-the-box. Many other source control providers are available through extensions.

GitHub Codespaces provides cloud-powered development environments for any activity - whether it's a long-term project, or a short-term task like reviewing a pull request.

vscode.dev in an Edge browser tab vscode.dev in an Edge browser tab

Code with rich features

There's a lot more to an editor. Whether it's using built-in features or rich extensions, there's something for everyone.