From 666471e644fc1bb50284e5108a7942f620300dc3 Mon Sep 17 00:00:00 2001 From: Enrique Alcantara Date: Mon, 17 Mar 2025 10:15:26 +0100 Subject: [PATCH 1/2] chore: Fix workspaces setup in GitLab UI - Replace storybook build task with workspace initialization script - Add initialization script to set up asdf and yarn dependencies - Add documentation for using GitLab Workspaces - Update container image to use gitlab-build-images:workspaces-web-ide --- .devfile.yaml | 2 +- .vscode/tasks.json | 23 ++++++++++++++--------- bin/initialize-workspaces.sh | 19 +++++++++++++++++++ doc/contributing/workspaces.md | 14 ++++++++++++++ 4 files changed, 48 insertions(+), 10 deletions(-) create mode 100755 bin/initialize-workspaces.sh create mode 100644 doc/contributing/workspaces.md diff --git a/.devfile.yaml b/.devfile.yaml index 43c5d753cf..f13a6b3e37 100644 --- a/.devfile.yaml +++ b/.devfile.yaml @@ -4,7 +4,7 @@ components: attributes: gl/inject-editor: true container: - image: registry.gitlab.com/gitlab-org/remote-development/gitlab-remote-development-docs/debian-bullseye-ruby-3.2.patched-golang-1.20-rust-1.65-node-18.16-postgresql-15@sha256:216b9bf0555349f4225cd16ea37d7a627f2dad24b7e85aa68f4d364319832754 + image: registry.gitlab.com/gitlab-org/gitlab-build-images:workspaces-web-ide env: - name: STORYBOOK_HOST value: "0.0.0.0" diff --git a/.vscode/tasks.json b/.vscode/tasks.json index dffab3daac..ed4b09432f 100644 --- a/.vscode/tasks.json +++ b/.vscode/tasks.json @@ -2,13 +2,18 @@ "version": "2.0.0", "tasks": [ { - "label": "Build and run storybook", - "type": "shell", - "command": "yarn install && yarn storybook", - "presentation": { - "echo": true, - "reveal": "always" - } - } + "type": "shell", + "command": "${workspaceFolder}/bin/initialize-workspaces.sh", + "isBackground": false, + "group": "none", + "problemMatcher": [], + "label": "Workspaces: Set up workspaces", + "runOptions": { + "runOn": "folderOpen" + }, + "presentation": { + "close": true + } + } ] -} \ No newline at end of file +} diff --git a/bin/initialize-workspaces.sh b/bin/initialize-workspaces.sh new file mode 100755 index 0000000000..16cb52ec1e --- /dev/null +++ b/bin/initialize-workspaces.sh @@ -0,0 +1,19 @@ +#!/usr/bin/env bash + +# See https://www.gnu.org/software/bash/manual/html_node/The-Set-Builtin.html +set -e # Abort script at first error, when a command exits with non-zero status (except in until or while loops, if-tests, list constructs) +set -u # Attempt to use undefined variable outputs error message, and forces an exit +set -o pipefail # Causes a pipeline to return the exit status of the last command in the pipe that returned a non-zero return value. + +if [[ -z "${GL_TOOLS_DIR:-}" ]]; then + echo "This environment is not a GitLab Workspaces. Skipping setup step..." + exit 0 +else + echo "Detected GitLab Workspaces environment. Running additional setup step..." +fi + +# Install dependencies managed by asdf +asdf install + +# Install dependencies managed by yarn +yarn install diff --git a/doc/contributing/workspaces.md b/doc/contributing/workspaces.md new file mode 100644 index 0000000000..cb05c4e730 --- /dev/null +++ b/doc/contributing/workspaces.md @@ -0,0 +1,14 @@ +# Using workspaces to develop the GitLab UI + +GitLab team members can use [GitLab Workspaces](https://docs.gitlab.com/ee/user/workspace/) +to develop the GitLab VSCode Extension. Follow these instructions to create a new Workspace: + +1. Open to the [GitLab UI's project page](https://gitlab.com/gitlab-org/gitlab-ui). +1. In the Git revision dropdown, select the branch you want to work on. +1. Select the "Edit" button. In the dropdown, select the "New workspace" button. +1. You will navigate to the "New Workspace" form. +1. Select the "Create Workspace" button. +1. Once the Workspace has been created, you can open it in VSCode for the Web. +1. Once you are in the Workspace for the first time, a VSCode task will install asdf dependencies + and npm dependencies. It will take a few minutes to complete. +1. Start developing on Workspaces! -- GitLab From 4d8b5d8e0808e22931cb48549b6e09dd684d1f51 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Enrique=20Alc=C3=A1ntara?= Date: Mon, 17 Mar 2025 14:31:51 +0100 Subject: [PATCH 2/2] chore: Code review feedback Documentation and UI text improvements --- .vscode/tasks.json | 2 +- bin/initialize-workspaces.sh | 2 +- doc/contributing/workspaces.md | 10 +++++----- 3 files changed, 7 insertions(+), 7 deletions(-) diff --git a/.vscode/tasks.json b/.vscode/tasks.json index ed4b09432f..18fbcdfa27 100644 --- a/.vscode/tasks.json +++ b/.vscode/tasks.json @@ -7,7 +7,7 @@ "isBackground": false, "group": "none", "problemMatcher": [], - "label": "Workspaces: Set up workspaces", + "label": "GitLab Workspaces: Set up workspace", "runOptions": { "runOn": "folderOpen" }, diff --git a/bin/initialize-workspaces.sh b/bin/initialize-workspaces.sh index 16cb52ec1e..c428a52ac5 100755 --- a/bin/initialize-workspaces.sh +++ b/bin/initialize-workspaces.sh @@ -6,7 +6,7 @@ set -u # Attempt to use undefined variable outputs error message, and forces an set -o pipefail # Causes a pipeline to return the exit status of the last command in the pipe that returned a non-zero return value. if [[ -z "${GL_TOOLS_DIR:-}" ]]; then - echo "This environment is not a GitLab Workspaces. Skipping setup step..." + echo "This environment is not a GitLab Workspace. Skipping setup step..." exit 0 else echo "Detected GitLab Workspaces environment. Running additional setup step..." diff --git a/doc/contributing/workspaces.md b/doc/contributing/workspaces.md index cb05c4e730..e587ce2c30 100644 --- a/doc/contributing/workspaces.md +++ b/doc/contributing/workspaces.md @@ -1,14 +1,14 @@ # Using workspaces to develop the GitLab UI GitLab team members can use [GitLab Workspaces](https://docs.gitlab.com/ee/user/workspace/) -to develop the GitLab VSCode Extension. Follow these instructions to create a new Workspace: +to develop the GitLab UI. Follow these instructions to create a new Workspace: -1. Open to the [GitLab UI's project page](https://gitlab.com/gitlab-org/gitlab-ui). +1. Open the [GitLab UI's project page](https://gitlab.com/gitlab-org/gitlab-ui). 1. In the Git revision dropdown, select the branch you want to work on. 1. Select the "Edit" button. In the dropdown, select the "New workspace" button. -1. You will navigate to the "New Workspace" form. +1. You'll be redirected to the "New Workspace" form. 1. Select the "Create Workspace" button. 1. Once the Workspace has been created, you can open it in VSCode for the Web. -1. Once you are in the Workspace for the first time, a VSCode task will install asdf dependencies - and npm dependencies. It will take a few minutes to complete. +1. Once you are in the Workspace for the first time, a VSCode task will install `asdf` dependencies + and `npm` dependencies. It will take a few minutes to complete. 1. Start developing on Workspaces! -- GitLab