Reorganize remote development directory structure
Issue: Reorganize remote development frontend director... (#458383 - closed)
What does this MR do and why?
Reorganize remote development directory structure
The Remote Development frontend is scaling into multiple frontend functionalities scattered across the GitLab application. From a high-level implementation perspective, each functionality is an independent Vue application. These applications share functionality via a shared library of components and GraphQL queries.
This commit reorganizes the ee/app/assets/javascripts/remote_development
directory into multiple root directories that contain a single app. Functionality shared between applications is placed in a common
directory that adopt the same inner structure as the application directories.
This is a detailed tree visualization of the new directory structure:
ee/app/assets/javascripts/workspaces/
├── agent
│ ├── components
│ │ └── agent_workspaces_list.vue
│ ├── constants.js
│ └── graphql
│ └── queries
│ └── agent_workspaces_list.query.graphql
├── common
│ ├── components
│ │ ├── get_project_details_query.vue
│ │ ├── update_workspace_mutation.vue
│ │ ├── workspace_actions.vue
│ │ ├── workspace_state_indicator.vue
│ │ └── workspaces_list
│ │ ├── empty_state.vue
│ │ ├── workspaces_list.vue
│ │ ├── workspaces_list_pagination.vue
│ │ └── workspaces_table.vue
│ ├── constants.js
│ ├── graphql
│ │ ├── fragments
│ │ │ └── workspace_item.fragment.graphql
│ │ ├── mutations
│ │ │ └── workspace_update.mutation.graphql
│ │ └── queries
│ │ ├── get_group_cluster_agents.query.graphql
│ │ ├── get_project_details.query.graphql
│ │ ├── get_projects_details.query.graphql
│ │ ├── get_remote_development_cluster_agents.query.graphql
│ │ └── user_workspaces_list.query.graphql
│ └── services
│ └── utils.js
├── dropdown_group
│ ├── components
│ │ ├── workspace_dropdown_item.vue
│ │ ├── workspaces_dropdown_group.stories.js
│ │ └── workspaces_dropdown_group.vue
│ └── constants.js
└── user
├── components
│ ├── search_projects_listbox.vue
│ └── workspaces_breadcrumbs.vue
├── constants.js
├── graphql
│ ├── mutations
│ │ └── workspace_create.mutation.graphql
│ └── queries
│ └── search_projects.query.graphql
├── init_user_workspaces_app.js
├── pages
│ ├── app.vue
│ ├── create.vue
│ ├── list.stories.js
│ └── list.vue
├── router
│ └── index.js
└── services
└── apollo_cache_mutators.js
MR acceptance checklist
Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Screenshots or screen recordings
This merge request is a refactoring. It shouldn't modify the behavior or visual appearance of any feature. These features have extensive test coverage by the following feature specs https://gitlab.com/gitlab-org/gitlab/-/tree/master/ee/spec/features/remote_development
How to set up and validate locally
This merge request is a refactoring. It shouldn't modify the behavior or visual appearance of any feature.
Related to #444837 (closed)