DEV Community

Cover image for Live Share Integration with Peacock and VS Code
John Papa for Microsoft Azure

Posted on • Originally published at johnpapa.net

Live Share Integration with Peacock and VS Code

One the of the coolest part of creating Open Source Software (OSS) is that ideas can be extended by any of us in the community to create even more valuable software! This past week I reviewed, collaborated, and merged some Pull Requests into Peacock that enable it to work with both VS Code's Remote Development and Live Share features!

Live Share

Peacock detects when the Live Share extension is installed and automatically adds two commands that allow the user to change color of their Live Share sessions as a Host or a Guest, depending on their role.

Live Share is a VS Code extension that adds collaboration capabilities to the editor. Using Live Share one can share their local files, terminals, local servers and debugging sessions with someone remote.

The commands allow users to pick a color from the favorites that can be used during Live Share session.

Command Description
Peacock: Change Live Share Color (Host) Prompts user to select a color for Live Share Host session from the Favorites
Peacock: Change Live Share Color (Guest) Prompts user to select a color for Live Share Guest session from the Favorites

When a Live Share session is started, the selected workspace color will be applied. When the session is finished, the workspace color is reverted back to the previous one (if set).

Remote Development

Peacock also now has support for the Remote Development feature of VS Code.

VS Code distinguishes two classes of extensions: UI Extensions and Workspace Extensions. Peacock is classified as a UI extension as it makes contributions to the VS Code user interface and is always run on the user's local machine. UI Extensions cannot directly access files in the workspace, or run scripts/tools installed in that workspace or on the machine. Example UI Extensions include: themes, snippets, language grammars, and keymaps.

In version 2.1.2 Peacock enabled integration with the Remote Development by adding "extensionKind": "ui" in the extension's package.json.

Thanks!

Special thanks to both Oleg Solomka and Jonathan Carter for implementing the Live Share integration. Also to Matt Bierner for implementing the Remote Development integration.

Top comments (2)

Collapse
 
jericomanapsal profile image
jericomanapsal

Amazing update. The extension is simple yet very useful for multiple projects. Great job!

Collapse
 
john_papa profile image
John Papa

Thanks. Glad you like it