This repository was archived by the owner on May 20, 2026. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 2k
feat: Sidecar; mobile bridge for Copilot Chat on-the-go access #5073
Open
Davidobot
wants to merge
3
commits into
microsoft:main
Choose a base branch
from
Davidobot:sidecar
base: main
Could not load branches
Branch not found: {{ refName }}
Loading
Could not load tags
Nothing to show
Loading
Are you sure you want to change the base?
Some commits from the old base branch may be removed from the timeline,
and old review comments may become outdated.
Open
Changes from all commits
Commits
File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| name: Deploy PWA | ||
|
|
||
| on: | ||
| push: | ||
| branches: | ||
| - sidecar | ||
| paths: | ||
| - pwa/** | ||
| - .github/workflows/deploy-pwa.yml | ||
| workflow_dispatch: | ||
|
|
||
| permissions: | ||
| contents: read | ||
| pages: write | ||
| id-token: write | ||
|
|
||
| concurrency: | ||
| group: pages | ||
| cancel-in-progress: true | ||
|
|
||
| jobs: | ||
| deploy: | ||
| runs-on: ubuntu-latest | ||
| steps: | ||
| - name: Checkout | ||
| uses: actions/checkout@v4 | ||
|
|
||
| - name: Configure Pages | ||
| uses: actions/configure-pages@v5 | ||
|
|
||
| - name: Upload PWA Artifact | ||
| uses: actions/upload-pages-artifact@v3 | ||
| with: | ||
| path: pwa | ||
|
|
||
| - name: Deploy | ||
| id: deployment | ||
| uses: actions/deploy-pages@v4 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,90 +1,151 @@ | ||
| # GitHub Copilot - Your autonomous AI peer programmer | ||
| # Sidecar for VS Code's GitHub Copilot | ||
|
|
||
| **[GitHub Copilot](https://code.visualstudio.com/docs/copilot/overview)** is an AI peer programming tool that transforms how you write code in Visual Studio Code. | ||
| **Dispatch into VS Code's Copilot Chat from your phone, from anywhere** | ||
|
|
||
| GitHub Copilot agents handle complete coding tasks end-to-end, autonomously planning work, editing files, running commands, and self-correcting when they hit errors. You can also leverage inline suggestions for quick coding assistance and inline chat for precise, focused edits directly in the editor. | ||
| > prototype; this is an early-stage experiment. It works, but expect rough edges. PRs are very welcome. | ||
|
|
||
| **Sign up for [GitHub Copilot Free](https://github.com/settings/copilot?utm_source=vscode-chat-readme&utm_medium=first&utm_campaign=2025mar-em-MSFT-signup)!** | ||
| *Sidecar* is a lightweight orchestration layer for mobile access to your active Copilot Chat workflow. It lets a phone sync with and interact with the same chat session that is open on desktop, without adding relay infrastructure or installing a native phone app. | ||
|
|
||
|  | ||
| ## Why this exists | ||
|
|
||
| Primarily because I like VS Code and don't use Claude Code - the former fits my workflow well, and I like the flexibilty Copilot provides whereby I can swap models on the fly. | ||
|
|
||
| ## Getting access to GitHub Copilot | ||
| Actual features of sidear: | ||
| - **Resume desktop context, not just repo context** | ||
| Continue the exact repo/branch/chat thread already running in your desktop editor. | ||
| - **Work with local-first state** | ||
| Interact with unpushed changes, local files, and the real host machine state. | ||
| - **Phone-first access to your IDE** | ||
| Open from a QR pairing flow and use a touch-optimised UI. | ||
| - **Faster pick-up flow** | ||
| Useful for quickly continuing one thread, answering a follow-up, or checking progress while you're grabbing lunch and left your Copilot running. | ||
|
|
||
| Sign up for [GitHub Copilot Free](https://github.com/settings/copilot?utm_source=vscode-chat-readme&utm_medium=second&utm_campaign=2025mar-em-MSFT-signup), or request access from your enterprise admin. | ||
| ## Quickstart: Install as a VSIX | ||
|
|
||
| To access GitHub Copilot, an active GitHub Copilot subscription is required. You can read more about our business and individual offerings at [github.com/features/copilot](https://github.com/features/copilot?utm_source=vscode-chat&utm_medium=readme&utm_campaign=2025mar-em-MSFT-signup). | ||
| If you just want to run Sidecar without setting up the full dev environment, you can package and install it as a `.vsix`: | ||
|
|
||
| ## Build with autonomous agents | ||
| 1. Install dependencies: | ||
|
|
||
| **Let AI agents implement complex features end-to-end**. Give an agent a high-level task and it breaks the work into steps, edits multiple files, runs terminal commands, and self-corrects when it hits errors or failing tests. Agents excel at [building new features](https://code.visualstudio.com/docs/copilot/agents/overview), [debugging and fixing failing tests](https://code.visualstudio.com/docs/copilot/guides/debug-with-copilot), refactoring codebases, and [collaborating via pull requests](https://code.visualstudio.com/docs/copilot/agents/cloud-agents). | ||
| ``` | ||
| npm ci | ||
| ``` | ||
|
|
||
| **Manage sessions from a central view.** Run multiple [agent sessions](https://code.visualstudio.com/docs/copilot/chat/chat-sessions) in parallel and track them in one place. Monitor session status, switch between active work, review file changes, and resume where you left off. | ||
| 2. Disable the official `Github Copilot Chat` extension | ||
|
|
||
| **Run agents with your preferred harness.** Use agents locally in VS Code, in the background via Copilot CLI, or Cloud via Copilot Coding Agent. You can also work with providers like Claude and Codex, and hand tasks off between agent types with context preserved all within the VS Code. | ||
| 2. Run the VS Code task **Package & Install VSIX** (Terminal → Run Task), or run it manually: | ||
|
|
||
|  | ||
| ``` | ||
| npm run compile && npx vsce package --out copilot-chat-sidecar.vsix --allow-package-secrets sendgrid | ||
| ``` | ||
|
|
||
| **Use agents to [plan before you build](https://code.visualstudio.com/docs/copilot/agents/planning) with the Plan agent**, which breaks tasks into structured implementation plans and asks clarifying questions. When your plan is ready, hand it off to an implementation agent to execute it. You can also [delegate tasks to cloud agents](https://code.visualstudio.com/docs/copilot/agents/cloud-agents) that create branches, implement changes, and open pull requests for your team to review. | ||
| Then install: | ||
|
|
||
| ## More ways to code with AI | ||
| ``` | ||
| code-insiders --install-extension copilot-chat-sidecar.vsix --force | ||
| # or: code --install-extension copilot-chat-sidecar.vsix --force | ||
| ``` | ||
|
|
||
| **Receive intelligent inline suggestions** as you type with [ghost text suggestions](https://aka.ms/vscode-completions) and [next edit suggestions](https://aka.ms/vscode-nes), helping you write code faster. Copilot predicts your next logical change, and you can accept suggestions with the Tab key. | ||
| 3. Reload VS Code and re-enable the `Github Copilot Chat` - this over-rides it. The Sidecar extension is now installed - **click the "Sidecar" panel at the bottom-right-hand-corner of your VS Code window** to launch. | ||
|
|
||
|  | ||
| 4. Accept the default URL (`https://davidobot.net/vscode-copilot-chat-sidecar/`) unless you're self-hosting; this is just the visual layer | ||
|
|
||
| **Use inline chat for targeted edits** by pressing `Ctrl+I`/`Cmd+I` to open a chat prompt directly in the editor. Describe a change and Copilot suggests edits in place for refactoring methods, adding error handling, or explaining complex algorithms without leaving your editor. | ||
| ## Development | ||
|
|
||
|  | ||
| ### Sidecar architecture | ||
|
|
||
| - The extension starts a local HTTP + WebSocket bridge server on localhost. | ||
| - Sidecar bootstraps Dev Tunnels directly by running `devtunnel host -p <port> --allow-anonymous` and using the resulting `*.devtunnels.ms` endpoint. | ||
| - If direct devtunnel bootstrap is unavailable or fails, Sidecar prompts you to [install it](https://learn.microsoft.com/en-us/azure/developer/dev-tunnels/get-started). | ||
| - A QR code in VS Code opens the PWA with a signed pairing URL (`ws` + session `token`). | ||
| - The phone PWA syncs conversation list, history, and streaming assistant chunks. | ||
| - Prompts sent from the phone are forwarded back into Copilot Chat on desktop. | ||
| - The status bar entry is `Sidecar` on the **bottom-right-hand-corner** of your window: | ||
| - Disconnected state shows a disconnect icon. | ||
| - Clicking `Sidecar` starts the bridge and then opens the pairing panel. | ||
|
|
||
| ## Customize AI for your workflow | ||
| ### PWA deployment | ||
|
|
||
| **Agents work best when they understand your project's conventions and have the right tools**. Tailor Copilot so it generates code that fits your codebase from the start. | ||
| The `pwa/` directory is a static web app designed for GitHub Pages deployment. This repository includes `.github/workflows/deploy-pwa.yml`, which deploys `pwa/` to Pages on pushes to `main`. | ||
|
|
||
| **Project context.** Use [custom instructions](https://code.visualstudio.com/docs/copilot/customization/custom-instructions) to specify project-wide or task-specific context and coding guidelines. | ||
| Use my deployed Github pages URL (`https://davidobot.net/vscode-copilot-chat-sidecar/`) in the Sidecar panel when generating pairing QR codes, or deploy your own. | ||
|
|
||
| **Add specialized capabilities**. Teach Copilot specialized capabilities with [agent skills](https://code.visualstudio.com/docs/copilot/customization/agent-skills) or define specialized personas with [custom agents](https://code.visualstudio.com/docs/copilot/customization/custom-agents). | ||
| ### Local PWA dev server | ||
|
|
||
| **Connect to external tools and services**. Extend agents further with tools from [MCP servers](https://code.visualstudio.com/docs/copilot/customization/mcp-servers) and extensions to give Copilot a gateway to external data sources, APIs, or specialized tools. | ||
| You can test without deploying GitHub Pages. | ||
|
|
||
| ### Supported languages and frameworks | ||
| 1. Start the local PWA server: | ||
|
|
||
| GitHub Copilot works on any language, including Java, PHP, Python, JavaScript, Ruby, Go, C#, or C++. Because it’s been trained on languages in public repositories, it works for most popular languages, libraries and frameworks. | ||
| ``` | ||
| npm run pwa:dev | ||
| ``` | ||
|
|
||
| ### Version compatibility | ||
| (or run the VS Code task `PWA: Dev Server`) | ||
|
|
||
| As Copilot Chat releases in lockstep with VS Code due to its deep UI integration, every new version of Copilot Chat is only compatible with the latest and newest release of VS Code. This means that if you are using an older version of VS Code, you will not be able to use the latest Copilot Chat. | ||
| 2. Point Sidecar to your local PWA URL: | ||
|
|
||
| Only the latest Copilot Chat versions will use the latest models provided by the Copilot service, as even minor model upgrades require prompt changes and fixes in the extension. | ||
| - For phone testing on same Wi-Fi: `http://<your-lan-ip>:4173/` | ||
| - For desktop-only testing: `http://localhost:4173/` | ||
|
|
||
| ### Privacy and preview terms | ||
| 3. Optional override: set `COPILOT_PWA_DEV_URL` before launching the extension host. | ||
|
|
||
| By using Copilot Chat you agree to [GitHub Copilot chat preview terms](https://docs.github.com/en/early-access/copilot/github-copilot-chat-technical-preview-license-terms). Review the [transparency note](https://aka.ms/CopilotChatTransparencyNote) to understand about usage, limitations and ways to improve Copilot Chat during the technical preview. | ||
| - Example: `COPILOT_PWA_DEV_URL=http://<your-lan-ip>:4173/` | ||
| - Sidecar prefers this env value over saved settings. | ||
|
|
||
| Please refer to our [Privacy Statement](https://docs.github.com/en/site-policy/privacy-policies/github-privacy-statement) to learn about the data we collect, how we use it, and the controls available to you. | ||
| ### Run and test locally | ||
|
|
||
| To get the latest security fixes, please use the latest version of the Copilot extension and VS Code. | ||
| 1. Install dependencies in the repo root: | ||
|
|
||
| ### Resources & next steps | ||
| * **[Sign up for GitHub Copilot Free](https://github.com/settings/copilot?utm_source=vscode-chat-readme&utm_medium=third&utm_campaign=2025mar-em-MSFT-signup)**: Explore Copilot's AI capabilities at no cost before upgrading to a paid plan. | ||
| * If you're using Copilot for your business, check out [Copilot Business](https://docs.github.com/en/copilot/copilot-business/about-github-copilot-business) and [Copilot Enterprise](https://docs.github.com/en/copilot/github-copilot-enterprise/overview/about-github-copilot-enterprise). | ||
| * **[Copilot Quickstart](https://code.visualstudio.com/docs/copilot/getting-started)**: Discover the key features of Copilot in VS Code. | ||
| * **[Agents Tutorial](https://code.visualstudio.com/docs/copilot/agents/agents-tutorial)**: Get started with autonomous agents across different environments. | ||
| * **[VS Code on YouTube](https://www.youtube.com/@code)**: Watch the latest demos and updates on the VS Code channel. | ||
| * **[Frequently Asked Questions](https://code.visualstudio.com/docs/copilot/faq)**: Get answers to commonly asked questions about Copilot in VS Code. | ||
| * **[Provide Feedback](https://github.com/microsoft/vscode-copilot-release/issues)**: Send us your feedback and feature request to help us make GitHub Copilot better! | ||
| ``` | ||
| npm ci | ||
| ``` | ||
|
|
||
| ## Data and telemetry | ||
| 2. Build and launch the extension host (VS Code task): | ||
|
|
||
| The GitHub Copilot Extension for Visual Studio Code collects usage data and sends it to Microsoft to help improve our products and services. Read our [privacy statement](https://privacy.microsoft.com/privacystatement) to learn more. This extension respects the `telemetry.telemetryLevel` setting which you can learn more about at https://code.visualstudio.com/docs/supporting/faq#_how-to-disable-telemetry-reporting. | ||
| ``` | ||
| Compile & Launch Extension Host | ||
| ``` | ||
|
|
||
| ## Trademarks | ||
| The task prefers VS Code Insiders. If `code-insiders` is not installed, it falls back to `code` with `--enable-proposed-api github.copilot-chat`. | ||
|
|
||
| This project may contain trademarks or logos for projects, products, or services. Authorized use of Microsoft trademarks or logos is subject to and must follow Microsoft's Trademark & Brand Guidelines. Use of Microsoft trademarks or logos in modified versions of this project must not cause confusion or imply Microsoft sponsorship. Any use of third-party trademarks or logos are subject to those third-party's policies. | ||
| 3. In the Extension Development Host window: | ||
|
|
||
| - Disable the official GitHub Copilot Chat extension to avoid conflicts. | ||
| - Sign in to GitHub Copilot. | ||
| - Install [Azure Dev Tunnels CLI](https://learn.microsoft.com/en-us/azure/developer/dev-tunnels/get-started) and sign in for direct tunnel bootstrap: | ||
| - Open a workspace and open the Chat view. | ||
|
|
||
| 4. In the status bar, confirm Sidecar starts in disconnected state (`$(debug-disconnect) Sidecar`). | ||
|
|
||
| 5. Click `Sidecar` to start the bridge and open the pairing panel. | ||
|
|
||
| 6. Set a PWA URL: | ||
| - Default hosted URL: https://davidobot.net/vscode-copilot-chat-sidecar/ | ||
| - Local dev URL: `http://0.0.0.0:4173/` | ||
|
|
||
| 7. Scan the QR code from your phone and open the PWA. | ||
|
|
||
| 8. Validate bidirectional sync: | ||
| - Send a desktop chat prompt and confirm it appears on phone. | ||
| - Send a phone prompt and confirm it appears in desktop chat. | ||
| - Confirm assistant streaming chunks render live on phone. | ||
| - Confirm status bar item updates from disconnected yellow to active Sidecar after startup. | ||
| - Confirm the Sidecar panel shows a non-loopback bridge endpoint (if it shows a loopback warning, phone pairing will fail). | ||
|
|
||
| 9. Validate reconnect behavior: | ||
| - Disconnect/reconnect phone network. | ||
| - Confirm status changes to reconnecting, then connected, and conversation list refreshes. | ||
|
|
||
| 10. If pairing fails: | ||
| - Verify `devtunnel` CLI is installed and signed in. | ||
| - Regenerate token from the Sidecar panel and rescan. | ||
| - Reopen the Sidecar panel to refresh the pairing URL. | ||
|
|
||
| ## Original Repo | ||
|
|
||
| This is just a fork. The original repo can be found [here](https://github.com/microsoft/vscode-copilot-chat/). | ||
|
|
||
| ## License | ||
|
|
||
| Copyright (c) Microsoft Corporation. All rights reserved. | ||
| Original repo licensed under the [MIT](LICENSE.txt) license. | ||
|
|
||
| Licensed under the [MIT](LICENSE.txt) license. | ||
| New changes in this fork are also licensed under the [MIT](LICENSE.txt) license. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| 1. Some chat histories are still not appearing correctly |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| const fs = require('fs'); | ||
| let code = fs.readFileSync('src/extension/conversation/vscode-node/sidecarContribution.ts', 'utf8'); | ||
|
|
||
| const regexes = [ | ||
| /^[ \t]*private async tryResolveViaCodeTunnelCli[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private async tryAutoCreateDevTunnel[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private async tryActivateVsCodeTunnelResources[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private async tryRunTunnelBootstrapCommands[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private async tryRunCodeTunnelBootstrap[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private ensureWorkspacePathOnVsCodeTunnelUri[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private async tryStartCodeTunnelProcessForUri[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private getCodeTunnelWorkingDirectory[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private waitForVsCodeTunnelUri[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private getCodeCliCandidates[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private runCodeCliCommand[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private extractTunnelUriFromCommandResult[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private extractVsCodeTunnelUri[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private attachCodeTunnelProcessLifecycle[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private stopCodeTunnelProcess[\s\S]*?\n[ \t]*\}\n/gm, | ||
| /^[ \t]*private terminateCodeTunnelProcess[\s\S]*?\n[ \t]*\}\n/gm | ||
| ]; | ||
|
|
||
| for (const r of regexes) { | ||
| code = code.replace(r, '\n'); | ||
| } | ||
|
|
||
| fs.writeFileSync('src/extension/conversation/vscode-node/sidecarContribution.ts', code); | ||
|
Comment on lines
+23
to
+27
|
||
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This script rewrites a TypeScript source file in-place using regex transforms. That is brittle (easy to desync with refactors), makes builds non-reproducible, and can silently produce broken TypeScript. Recommendation (mandatory): avoid modifying tracked source files during packaging; implement pruning via packaging config/excludes, build-time transforms that write to an output directory, or feature-flag/conditional compilation at runtime.