diff --git a/app/cheat-sheet-print.css b/app/cheat-sheet-print.css index 289a83af0..2c406e3a5 100644 --- a/app/cheat-sheet-print.css +++ b/app/cheat-sheet-print.css @@ -135,11 +135,6 @@ font-size: 5.5pt !important; } - .cheat-sheet-section .prose code, - .cheat-sheet-section .markdown code { - font-size: 5.5pt !important; - } - /* Hide Nextra's terminal UI wrapper */ .my-4.overflow-hidden.rounded-lg.border > .flex.items-center.justify-between { display: none !important; @@ -185,6 +180,11 @@ margin: 2pt 0 !important; } + .cheat-sheet-section .prose code, + .cheat-sheet-section .markdown code { + font-size: 5.5pt !important; + } + /* Code blocks inside pre elements */ pre code, .cheat-sheet-section pre code, diff --git a/app/en/get-started/mcp-clients/_meta.tsx b/app/en/get-started/mcp-clients/_meta.tsx index c54cd6ef1..ab290a78b 100644 --- a/app/en/get-started/mcp-clients/_meta.tsx +++ b/app/en/get-started/mcp-clients/_meta.tsx @@ -23,6 +23,9 @@ const meta: MetaRecord = { "copilot-studio": { title: "Microsoft Copilot Studio", }, + "github-copilot": { + title: "GitHub Copilot", + }, }; export default meta; diff --git a/app/en/get-started/mcp-clients/github-copilot/page.mdx b/app/en/get-started/mcp-clients/github-copilot/page.mdx new file mode 100644 index 000000000..d0cdc799d --- /dev/null +++ b/app/en/get-started/mcp-clients/github-copilot/page.mdx @@ -0,0 +1,209 @@ +import { Steps, Callout, Tabs } from "nextra/components"; +import { SignupLink } from "@/app/_components/analytics"; +import Image from "next/image"; + +export const IMAGE_SCALE_FACTOR = 2; +export const JETBRAINS_START_WIDTH = 318; +export const JETBRAINS_START_HEIGHT = 184; +export const VISUAL_STUDIO_STEP_1_WIDTH = 276; +export const VISUAL_STUDIO_STEP_1_HEIGHT = 120; +export const VISUAL_STUDIO_STEP_2_WIDTH = 1606; +export const VISUAL_STUDIO_STEP_2_HEIGHT = 270; +export const VISUAL_STUDIO_STEP_3_WIDTH = 674; +export const VISUAL_STUDIO_STEP_3_HEIGHT = 288; +export const VISUAL_STUDIO_STEP_4_WIDTH = 1070; +export const VISUAL_STUDIO_STEP_4_HEIGHT = 898; +export const VISUAL_STUDIO_STEP_5_WIDTH = 660; +export const VISUAL_STUDIO_STEP_5_HEIGHT = 362; +export const VISUAL_STUDIO_STEP_6_WIDTH = 1632; +export const VISUAL_STUDIO_STEP_6_HEIGHT = 360; + +# Use Arcade in GitHub Copilot + + + + +Connect GitHub Copilot to an Arcade MCP Gateway. + + + + + +1. Create an Arcade account +2. Get an [Arcade API key](/get-started/setup/api-keys) +3. Create an [Arcade MCP Gateway](/guides/mcp-gateways) and select the tools you want to use + + + + + +### Set up GitHub Copilot + + + + In VS Code, Github Copilot will automatically detect the configured MCP + servers. Read the [VS Code + instructions](/get-started/mcp-clients/visual-studio-code) to set both of + them up. + + + + The GitHub Copilot extension for JetBrains IDEs does not currently support remote MCP servers with Dynamic Client Registration. To use an Arcade MCP Gateway with GitHub Copilot on a JetBrains IDE, you must configure the MCP gateway as `Arcade Headers` in the dashboard. + + + 1. In the lower right corner, click the GitHub Copilot icon. + 2. From the menu, select "Open Chat", make sure you are in Agent mode, then click the tools icon. + 3. A dialog will open with a list of tools. On the bottom left, click "+ Add More Tools..." + 4. This will open the `mcp.json` file in the editor. In the `mcp.json` file, define your MCP servers. + + + + + ```json + { + "servers": { + "mcp-arcade": { + "url": "https://api.arcade.dev/mcp/", + "requestInit": { + "headers": { + "Authorization": "Bearer {arcade_api_key}", + "Arcade-User-ID": "{arcade_user_id}" + } + } + } + } + } + ``` + + + + The GitHub Copilot extension for JetBrains IDEs does not currently support remote MCP servers with Dynamic Client Registration. To use an Arcade MCP Gateway with GitHub Copilot on a JetBrains IDE, you must configure the MCP gateway as `Arcade Auth` in the dashboard. + + + + Once you save the `mcp.json` file, a start button will appear over the new server name. Click it to start the MCP server. + {"Start + + + MCP tools are only available in Agent mode. + + + + + + The GitHub Copilot extension for Visual Studio does not currently support every remote MCP server with Dynamic Client Registration. To use an Arcade MCP Gateway with GitHub Copilot on Visual Studio, you must configure the MCP gateway as `Arcade Headers` in the dashboard. + + In Visual Studio, + + 1. In the upper right corner, click the GitHub Copilot icon. + + {"GitHub + + 2. On the bottom of the GitHub Copilot panel, click the tools icon (two wrenches). + + {"GitHub + + 3. A dialog will open with a list of tools. On the top right corner of this dialog, click the "+" icon to add a new tool. + + {"GitHub + + 4. This will open another dialog. Fill in the information for your MCP server. You will need to choose: + - **Destination**: The path to the MCP configuration file, if you choose "Global", the MCP gateway will be added to all solutions. If you choose "Solution", the MCP gateway will be added to the current solution only. + - **Server ID**: The ID of the MCP server you're adding, this is how it will be displayed in the list of servers. + - **Type**: For MCP gateways, you must select "HTTP". + - **URL**: The URL of the MCP gateway. + - **Headers**: The headers to pass to the MCP gateway. + - Click "Save" to add the MCP server. + + {"GitHub + + 5. Once you save the MCP server, it will be added to the list of servers. It will be disabled by default. To enable it, click the checkbox next to the server name. + + {"GitHub + + 6. Once the server is enabled, it will be available in the list of tools. If tools are not available, you may need to open the `.mcp.json` file you picked as the destination. Visual Studio will display a "Configure" and "Reconnect" buttons on top of each entry. Clicking "Reconnect" should fix any issues. + + {"GitHub + + + + + ```json + { + "servers": { + "mcp-arcade": { + "url": "https://api.arcade.dev/mcp/", + "headers": { + "Authorization": "Bearer {arcade_api_key}", + "Arcade-User-ID": "{arcade_user_id}" + } + } + } + } + ``` + + + + The GitHub Copilot extension for Visual Studio does not currently support every remote MCP server with Dynamic Client Registration. To use an Arcade MCP Gateway with GitHub Copilot on Visual Studio, you must configure the MCP gateway as `Arcade Headers` in the dashboard. + + + + + + Coming soon... + + + Coming soon... + + + +### Try it out + +1. Open the chat pane (typically command-l) +1. Make sure you are in **Agent** mode +1. Ask the agent to use a tool. diff --git a/app/en/home/landing-page.tsx b/app/en/home/landing-page.tsx index 080df88c8..79ea3f719 100644 --- a/app/en/home/landing-page.tsx +++ b/app/en/home/landing-page.tsx @@ -205,10 +205,10 @@ export function LandingPage() {