MR: Pending <!-- The first line of this issue description must be one of the following: 1. `MR: Pending` 2. `MR: <MR link with trailing +>`, 3. If there are multiple MRs: ``` MRs: - <MR 1 link with trailing +>` - <MR 2 link with trailing +>` - ... ``` 4. `MR: No MR` ...and the first description line of the MR should be `Issue: <Issue link with trailing +>` For more context, see: https://about.gitlab.com/handbook/engineering/development/dev/create/ide/index.html#relationship-of-issues-to-mrs --> <!-- The following sections should be filled out as part of the refinement process before the issue is prioritized. For more context, see: https://about.gitlab.com/handbook/engineering/development/dev/create/ide/#2-pre-iteration-planning-meeting --> ## Description We want to extend the `gitlab-vscode-extension` with a new feature for workspace_ports which will allow workspace users to manage their ports through the UI of the VSCode editor injected in a workspace. By default every workspace comes with the `gitlab-vscode-extension` pre-installed, we want to add a desktop specific feature for the workspace ports that is only enabled when the extension is running inside a workspace container. References: - [Gitlab vscode extension - [POC] Workspace Ports Feature](https://gitlab.com/daniyalAD/gitlab-vscode-extension/-/merge_requests/2) - [Gitlab vscode extension - Architecture](https://gitlab.com/gitlab-org/gitlab-vscode-extension/-/blob/main/docs/developer/architecture.md#environments) - [VScode commands](https://code.visualstudio.com/api/extension-guides/command) - [VScode viewsContainers](https://code.visualstudio.com/api/references/contribution-points#contributes.viewsContainers) ## Acceptance Criteria - [ ] Review [Coding guidelines](https://gitlab.com/gitlab-org/gitlab-vscode-extension/-/blob/main/docs/developer/coding-guidelines.md) for the gitlab-vscode-extension - [ ] A new tab for workspace ports in the Panel area - [ ] Workspace ports feature/UI only enabled inside a workspace - [ ] Authenticate/authorize API requests for workspace_ports - [ ] View/Create/Delete ports through the extension - [ ] Write unit tests for the feature following the [developer docs](https://gitlab.com/gitlab-org/gitlab-vscode-extension/-/blob/main/docs/developer/writing-tests.md) ## Technical Requirements - The following user command should be registered: - gl.openWorkspacePortsWebview (Opens the UI for workspace ports) - Entry added for the workspace ports panel in the `viewsContainers` object in `desktop.package.json` - A new service class for mapping the graphql query/mutations and executing the Gitlab API requests - Fetch the workspace_id from the ENV variable `GL_WORKSPACE_ID`, use this global ID to make relevant requests for workspace ports - A new controller and webview containing event handlers to enable message passing between the controller and view for events including - A new port is opened - A port is closed - The port list is updated - Update the extension documentation in README.md ## Design Requirements TODO: Fill out or delete (optional) [If applicable, please provide a link to the design specifications for this feature/enhancement.] <!-- Replace with other type, e.g. bug or maintenance, if appropriate --> <!-- Replace with other subtype if appropriate --> <!-- By default, all issues start in the unprioritized status. See https://handbook.gitlab.com/handbook/engineering/development/dev/create/remote-development/#-planning-process --> <!-- For simplicity and to avoid triage bot warnings about missing workflow labels, we will default to issues starting at the refinement phase -->