feat(dashboard): support group semantics in dashboard

adrianAzoitei · adrianAzoitei · commit 9c32aa2b617b · 2026-06-13T22:32:05.000+02:00
Signed-off-by: Adrian Azoitei &lt;azo.adrian@gmail.com&gt;
diff --git a/components/centraldashboard/app/api_workgroup.ts b/components/centraldashboard/app/api_workgroup.ts
@@ -13,6 +13,7 @@ const EMAIL_RGX = /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]
 
 // Valid actions for handling a contributor
 type ContributorActions = 'create' | 'remove';
+type ContributorType = 'user' | 'group';
 
 interface CreateProfileRequest {
     namespace?: string;
@@ -21,6 +22,7 @@ interface CreateProfileRequest {
 
 interface AddOrRemoveContributorRequest {
     contributor?: string;
+    cType?: ContributorType;
 }
 
 interface HasWorkgroupResponse {
@@ -53,6 +55,7 @@ export interface SimpleBinding {
     namespace: string;
     role: SimpleRole;
     subject: string;
+    kind?: string;
 }
 
 export interface WorkgroupInfo {
@@ -68,6 +71,7 @@ export function mapWorkgroupBindingToSimpleBinding (bindings: WorkgroupBinding[]
         subject: n.subject.name,
         namespace: n.referredNamespace,
         role: roleMap.get(n.roleRef.name as Role) as SimpleRole,
+        kind: n.subject.kind,
     }));
 }
 
@@ -87,10 +91,10 @@ export function mapNamespacesToSimpleBinding (subject: string, namespaces: V1Nam
  * Converts SimpleBinding to Workgroup Binding from Profile Controller
  */
 export function mapSimpleBindingToWorkgroupBinding (binding: SimpleBinding): WorkgroupBinding {
-    const {subject, namespace, role} = binding;
+    const {subject, namespace, role, kind: subjectKind} = binding;
     return {
         subject: {
-            kind: 'User',
+            kind: subjectKind.charAt(0).toUpperCase() + subjectKind.slice(1),
             name: subject,
         },
         referredNamespace: namespace,
@@ -191,7 +195,7 @@ export class WorkgroupApi {
     }
     async handleContributor(action: ContributorActions, req: Request, res: Response) {
         const {namespace} = req.params;
-        const {contributor} = req.body as AddOrRemoveContributorRequest;
+        const {contributor, cType} = req.body as AddOrRemoveContributorRequest;
         const {profilesService} = this;
         if (!contributor || !namespace) {
             const missing = [];
@@ -204,7 +208,7 @@ export class WorkgroupApi {
                 error: `Missing ${missing.join(' and ')} field${missing.length-1?'s':''}.`,
             });
         }
-        if (!EMAIL_RGX.test(contributor)) {
+        if (cType === "user" && !EMAIL_RGX.test(contributor)) {
             return apiError({
                 res,
                 error: `Contributor doesn't look like a valid email address`,
@@ -214,6 +218,7 @@ export class WorkgroupApi {
         try {
             const binding = mapSimpleBindingToWorkgroupBinding({
                 subject: contributor,
+                kind: cType,
                 namespace,
                 role: 'contributor',
             });
@@ -226,8 +231,8 @@ export class WorkgroupApi {
             const actionAPI = action === 'create' ? 'createBinding' : 'deleteBinding';
             await profilesService[actionAPI](binding, {headers});
             errIndex++;
-            const users = await this.getContributors(namespace);
-            res.json(users);
+            const contributors = await this.getContributors(namespace);
+            res.json(contributors);
         } catch (err) {
             const errMessage = [
                 `Unable to add new contributor for ${namespace}. HTTP ${err.response.statusCode || '???'} - ${err.response.statusMessage || 'Unknown'}`,
@@ -244,13 +249,19 @@ export class WorkgroupApi {
      * Given an owned namespace, list all contributors under it
      * @param namespace Namespace to find contributors for
      */
-    async getContributors(namespace: string) {
+    async getContributors(namespace: string): Promise<Array<{name: string, kind?: string}>> {
         const {body} = await this.profilesService
             .readBindings(undefined, namespace);
-        const users = mapWorkgroupBindingToSimpleBinding(body.bindings)
+        const simpleBindings = mapWorkgroupBindingToSimpleBinding(body.bindings);
+        console.log(simpleBindings);
+        const contributors = simpleBindings
             .filter((b) => b.role === 'contributor')
-            .map((b) => b.subject);
-        return users;
+            .map((b) => ({
+                name: b.subject,
+                kind: b.kind,
+            }));
+        console.log(contributors);
+        return contributors;
     }
     routes() {return Router()
         .get('/exists', async (req: Request, res: Response) => {
@@ -374,8 +385,8 @@ export class WorkgroupApi {
         .get('/get-contributors/:namespace', async (req: Request, res: Response) => {
             const {namespace} = req.params;
             try {
-                const users = await this.getContributors(namespace);
-                res.json(users);
+                const contributors = await this.getContributors(namespace);
+                res.json(contributors);
             } catch (err) {
                 surfaceProfileControllerErrors({
                     res,
diff --git a/components/centraldashboard/app/api_workgroup_test.ts b/components/centraldashboard/app/api_workgroup_test.ts
@@ -152,6 +152,7 @@ describe('Workgroup API', () => {
                         {
                             subject: 'test@testdomain.com',
                             namespace: 'test',
+                            kind: 'user',
                             role: 'contributor',
                         },
                     ],
diff --git a/components/centraldashboard/public/components/logout-button.js b/components/centraldashboard/public/components/logout-button.js
@@ -1,4 +1,4 @@
-import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
+import {html, PolymerElement} from '@polymer/polymer/polymer-element.js';
 import '@polymer/paper-button/paper-button.js';
 import css from './logout-button.css';
 
@@ -18,7 +18,6 @@ export class LogoutButton extends PolymerElement {
                 </paper-button>
             </a>
         `]);
-        ;
     }
 
     /**
diff --git a/components/centraldashboard/public/components/manage-users-view-contributor.js b/components/centraldashboard/public/components/manage-users-view-contributor.js
@@ -31,6 +31,9 @@ export class ManageUsersViewContributor extends utilitiesMixin(PolymerElement) {
             user: {type: String, value: 'Loading...'},
             ownedNamespace: {type: Object, value: () => ({})},
             newContribEmail: String,
+            newGroupName: String,
+            userContributorList: {type: Array, value: () => []},
+            groupContributorList: {type: Array, value: () => []},
             contribError: Object,
             contributorInputEl: Object,
         };
@@ -44,23 +47,51 @@ export class ManageUsersViewContributor extends utilitiesMixin(PolymerElement) {
     }
 
     /**
-     * Triggers an API call to create a new Contributor
+     * Triggers an API call to create a new user Contributor
      */
     addNewContrib() {
-        // Need to call the api directly here.
         const api = this.$.AddContribAjax;
-        api.body = {contributor: this.newContribEmail};
+        api.body = {contributor: this.newContribEmail, cType: 'user'};
         api.generateRequest();
     }
     /**
-     * Triggers an API call to remove a Contributor
+     * Triggers an API call to create a new group Contributor
+     */
+    addNewGroupContrib() {
+        const api = this.$.AddContribAjax;
+        api.body = {contributor: this.newGroupName, cType: 'group'};
+        api.generateRequest();
+    }
+    /**
+     * Triggers an API call to remove a user Contributor
      * @param {Event} e
      */
     removeContributor(e) {
         const api = this.$.RemoveContribAjax;
-        api.body = {contributor: e.model.item};
+        api.body = {contributor: e.model.item, cType: 'user'};
+        api.generateRequest();
+    }
+    /**
+     * Triggers an API call to remove a group Contributor
+     * @param {Event} e
+     */
+    removeGroupContributor(e) {
+        const api = this.$.RemoveContribAjax;
+        api.body = {contributor: e.model.item, cType: 'group'};
         api.generateRequest();
     }
+    /**
+     * Splits a contributors response array into user and group lists.
+     * @param {Array} contribs
+     */
+    _updateContributorLists(contribs) {
+        this.groupContributorList = contribs
+            .filter((c) => c.kind && c.kind.toLowerCase() === 'group')
+            .map((c) => c.name);
+        this.userContributorList = contribs
+            .filter((c) => c.kind && c.kind.toLowerCase() === 'user')
+            .map((c) => c.name);
+    }
     /**
      * Takes an event from iron-ajax and isolates the error from a request that
      * failed
@@ -81,8 +112,8 @@ export class ManageUsersViewContributor extends utilitiesMixin(PolymerElement) {
             this.contribCreateError = error;
             return;
         }
-        this.contributorList = e.detail.response;
-        this.newContribEmail = this.contribCreateError = '';
+        this._updateContributorLists(e.detail.response);
+        this.newContribEmail = this.newGroupName = this.contribCreateError = '';
     }
     /**
      * Iron-Ajax response / error handler for removeContributor
@@ -94,8 +125,19 @@ export class ManageUsersViewContributor extends utilitiesMixin(PolymerElement) {
             this.contribCreateError = error;
             return;
         }
-        this.contributorList = e.detail.response;
-        this.newContribEmail = this.contribCreateError = '';
+        this._updateContributorLists(e.detail.response);
+        this.newContribEmail = this.newGroupName = this.contribCreateError = '';
+    }
+    /**
+     * Iron-Ajax response handler for getContributors
+     * @param {IronAjaxEvent} e
+     */
+    handleContribFetch(e) {
+        if (e.detail.error) {
+            this.onContribFetchError(e);
+            return;
+        }
+        this._updateContributorLists(e.detail.response);
     }
     /**
      * Iron-Ajax error handler for getContributors
diff --git a/components/centraldashboard/public/components/manage-users-view-contributor.pug b/components/centraldashboard/public/components/manage-users-view-contributor.pug
@@ -3,18 +3,24 @@ iron-ajax#RemoveContribAjax(method='DELETE', url='/api/workgroup/remove-contribu
 iron-ajax#AddContribAjax(method='POST', url='/api/workgroup/add-contributor/[[ownedNamespace.namespace]]',
     on-response='handleContribCreate', on-error='handleContribCreate', handle-as='json', content-type='application/json')
 iron-ajax#GetContribsAjax(auto='[[!empty(ownedNamespace)]]', url='/api/workgroup/get-contributors/[[ownedNamespace.namespace]]',
-    last-response='{{contributorList}}', on-error='onContribFetchError', handle-as='json')
+    on-response='handleContribFetch', on-error='onContribFetchError', handle-as='json')
 h2
     iron-icon.icon(icon='kubeflow:account-group')
     span.text
         | Contributors for -
         |
         code [[ownedNamespace.namespace]]
 .content.small
-    md2-input(label='Email Addresses', value='{{newContribEmail}}', on-submit='addNewContrib', placeholder='Add by email address', error$='[[contribCreateError]]')
+    h3 Users
+    md2-input(label='Email Addresses', value='{{newContribEmail}}', on-submit='addNewContrib', placeholder='Add user by email address', error$='[[contribCreateError]]')
         .prefix(slot='prefix')
-            template(is='dom-repeat', items='[[contributorList]]')
+            template(is='dom-repeat', items='[[userContributorList]]')
                 paper-chip(on-remove='removeContributor') [[item]]
+    h3 Groups
+    md2-input(label='Groups', value='{{newGroupName}}', on-submit='addNewGroupContrib', placeholder='Add group by name', error$='[[contribCreateError]]')
+        .prefix(slot='prefix')
+            template(is='dom-repeat', items='[[groupContributorList]]')
+                paper-chip(on-remove='removeGroupContributor') [[item]]
 paper-toast#ContribError(duration=5000)
     | Failed to fetch contributor list for {{ownedNamespace.namespace}}, because:
     strong [[contribError]]
diff --git a/components/centraldashboard/public/components/manage-users-view-contributor_test.js b/components/centraldashboard/public/components/manage-users-view-contributor_test.js

Original file line number	Diff line number	Diff line change
`@@ -152,6 +152,7 @@ describe('Workgroup API', () => {`
`152`	`152`	`{`
`153`	`153`	`subject: 'test@testdomain.com',`
`154`	`154`	`namespace: 'test',`
	`155`	`+ kind: 'user',`
`155`	`156`	`role: 'contributor',`
`156`	`157`	`},`
`157`	`158`	`],`