From da79c3ee696edf68e7dee5e58d00d218ba939e4d Mon Sep 17 00:00:00 2001 From: hubwriter Date: Wed, 24 Aug 2022 10:11:39 +0100 Subject: [PATCH] Codespaces: Explain how to display the Remote Explorer (#29988) * Initial draft commit * Add more instances of the reusable * Add reusable note box to new article added in another PR --- .../developing-in-codespaces/renaming-a-codespace.md | 2 ++ .../working-with-support-for-github-codespaces.md | 7 ++++--- .../codespaces/click-remote-explorer-icon-vscode.md | 5 ++++- data/reusables/codespaces/remote-explorer.md | 9 +++++++++ 4 files changed, 19 insertions(+), 4 deletions(-) create mode 100644 data/reusables/codespaces/remote-explorer.md diff --git a/content/codespaces/developing-in-codespaces/renaming-a-codespace.md b/content/codespaces/developing-in-codespaces/renaming-a-codespace.md index 75527a37cf..b296745717 100644 --- a/content/codespaces/developing-in-codespaces/renaming-a-codespace.md +++ b/content/codespaces/developing-in-codespaces/renaming-a-codespace.md @@ -27,7 +27,9 @@ To find the display name of a codespace: ![Screenshot of the Remote Explorer in VS Code](/assets/images/help/codespaces/codespaces-remote-explorer.png) +{% indented_data_reference reusables.codespaces.remote-explorer spaces=2 %} - In a terminal window on your local machine, use this {% data variables.product.prodname_cli %} command: `gh codespace list`. + ### Permanent codespace names In addition to the display name, when you create a codespace, a permanent name is also assigned to the codespace. The name is a combination of your {% data variables.product.company_short %} handle, the repository name, and some random characters. For example: `octocat-myrepo-gmc7`. You can't change this name. diff --git a/content/codespaces/troubleshooting/working-with-support-for-github-codespaces.md b/content/codespaces/troubleshooting/working-with-support-for-github-codespaces.md index 42b9c218ea..8c7d89240c 100644 --- a/content/codespaces/troubleshooting/working-with-support-for-github-codespaces.md +++ b/content/codespaces/troubleshooting/working-with-support-for-github-codespaces.md @@ -32,7 +32,8 @@ The name the codespace is also included in many of the log files. For example, i Every codespace also has an ID (identifier). This is not shown by default in {% data variables.product.prodname_vscode %} so you may need to update the settings for the {% data variables.product.prodname_github_codespaces %} extension before you can access the ID. 1. In {% data variables.product.prodname_vscode %}, browser or desktop, in the Activity Bar on the left, click **Remote Explorer** to show details for the codespace. -2. If the sidebar includes a "Codespace Performance" section, hover over the "Codespace ID" and click the clipboard icon to copy the ID. -3. If the information is not shown, click {% octicon "gear" aria-label="The gear icon" %}, in the bottom-left corner of the Activity Bar, to display the "Settings" tab. -4. Expand **Extensions** and click **{% data variables.product.prodname_github_codespaces %}** to display the settings for the extension. Then enable **Show Performance Explorer** to display the "Codespace Performance" section in the sidebar. +{% indented_data_reference reusables.codespaces.remote-explorer spaces=3 %} +1. If the sidebar includes a "Codespace Performance" section, hover over the "Codespace ID" and click the clipboard icon to copy the ID. +1. If the information is not shown, click {% octicon "gear" aria-label="The gear icon" %}, in the bottom-left corner of the Activity Bar, to display the "Settings" tab. +1. Expand **Extensions** and click **{% data variables.product.prodname_github_codespaces %}** to display the settings for the extension. Then enable **Show Performance Explorer** to display the "Codespace Performance" section in the sidebar. ![Codespace ID and settings required to display performance information](/assets/images/help/codespaces/find-codespace-id.png) diff --git a/data/reusables/codespaces/click-remote-explorer-icon-vscode.md b/data/reusables/codespaces/click-remote-explorer-icon-vscode.md index 83bf494e4d..37d359b854 100644 --- a/data/reusables/codespaces/click-remote-explorer-icon-vscode.md +++ b/data/reusables/codespaces/click-remote-explorer-icon-vscode.md @@ -1,2 +1,5 @@ 1. In {% data variables.product.prodname_vscode_shortname %}, in the left sidebar, click the Remote Explorer icon. - ![The Remote Explorer icon in {% data variables.product.prodname_vscode %}](/assets/images/help/codespaces/click-remote-explorer-icon-vscode.png) + + ![The Remote Explorer icon in {% data variables.product.prodname_vscode %}](/assets/images/help/codespaces/click-remote-explorer-icon-vscode.png) + +{% indented_data_reference reusables.codespaces.remote-explorer spaces=3 %} \ No newline at end of file diff --git a/data/reusables/codespaces/remote-explorer.md b/data/reusables/codespaces/remote-explorer.md new file mode 100644 index 0000000000..c46ed9b539 --- /dev/null +++ b/data/reusables/codespaces/remote-explorer.md @@ -0,0 +1,9 @@ +{% note %} + +**Note**: If the Remote Explorer is not displayed in the Activity Bar: + +1. Access the command palette. For example, by pressing Shift+Command+P (Mac) / Ctrl+Shift+P (Windows/Linux). +1. Type: `codespaces`. +1. Click **Codespaces: Details**. + +{% endnote %}