Skip to content

Pass admin paths from backend to frontend in Vue Admin Groups page

Background

In app/assets/javascripts/admin/groups/index/constants.js#L17 we are constructing the admin URL on the frontend which isn't ideal. We should figure out how to pass this to the frontend from the backend

Implementation guide

⚠️ IMPORTANT ⚠️

Ensure multi-version compatibility by splitting the backend and frontend changes. Add @gl_introduced directive based on https://docs.gitlab.com/development/api_graphql_styleguide/#multi-version-compatibility

Feel free to create child items for each part if necessary.

Once Allow read-only access to `Admin Area > Project... (#557844 - closed) has been completed and a new Query.adminGroups query has been added, we should:

  1. Add adminPath and adminEditPath fields to the query.
  2. Remove the URL construction in the frontend:
Index: app/assets/javascripts/admin/groups/index/constants.js
IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
===================================================================
diff --git a/app/assets/javascripts/admin/groups/index/constants.js b/app/assets/javascripts/admin/groups/index/constants.js
--- a/app/assets/javascripts/admin/groups/index/constants.js	(revision 36d708309b774f23ac8804778e9a2ffd87ddecb0)
+++ b/app/assets/javascripts/admin/groups/index/constants.js	(date 1755487931736)
@@ -16,12 +16,9 @@
 const baseTab = {
   formatter: (groups) =>
     formatGraphQLGroups(groups, (group) => {
-      const adminPath = joinPaths('/', gon.relative_url_root, '/admin/groups/', group.fullPath);
       const canAdminAllResources = get(group.userPermissions, 'adminAllResources', true);
 
       return {
-        avatarLabelLink: adminPath,
-        editPath: `${adminPath}/edit`,
         availableActions: canAdminAllResources ? group.availableActions : [],
       };
     }),
  1. Add the new fields in the query
 fragment AdminGroup on Group {
+  avatarLabelLink: adminPath
+  adminEditPath
   projectStatistics {
     storageSize
   }
  • Alternatively, we could update this line instead of adding an alias to adminPath.
Edited by Shane Maglangit