add per app builder support when adding groups

packages/builder/src/pages/builder/app/[application]/_components/BuilderSidePanel.svelte

@@ -29,7 +29,7 @@
 
   // Initially filter entities without app access
   // Show all when false
-  let filterByAppAccess = true
+  let filterByAppAccess = false
 
   let appInvites = []
   let filteredInvites = []
@@ -106,31 +106,42 @@
     })
     await usersFetch.refresh()
 
-    filteredUsers = $usersFetch.rows.map(user => {
-      const isAdminOrGlobalBuilder = sdk.users.isAdminOrGlobalBuilder(
-        user,
-        prodAppId
-      )
-      const isAppBuilder = sdk.users.hasAppBuilderPermissions(user, prodAppId)
-      let role = undefined
-      if (isAdminOrGlobalBuilder) {
-        role = Constants.Roles.ADMIN
-      } else if (isAppBuilder) {
-        role = Constants.Roles.CREATOR
-      } else {
-        const appRole = Object.keys(user.roles).find(x => x === prodAppId)
-        if (appRole) {
-          role = user.roles[appRole]
+    filteredUsers = $usersFetch.rows
+      .map(user => {
+        const isAdminOrGlobalBuilder = sdk.users.isAdminOrGlobalBuilder(
+          user,
+          prodAppId
+        )
+        const isAppBuilder = sdk.users.hasAppBuilderPermissions(user, prodAppId)
+        let role = undefined
+        if (isAdminOrGlobalBuilder) {
+          role = Constants.Roles.ADMIN
+        } else if (isAppBuilder) {
+          role = Constants.Roles.CREATOR
+        } else {
+          const appRole = Object.keys(user.roles).find(x => x === prodAppId)
+          if (appRole) {
+            role = user.roles[appRole]
+          }
         }
-      }
 
-      return {
-        ...user,
-        role,
-        isAdminOrGlobalBuilder,
-        isAppBuilder,
-      }
-    })
+        return {
+          ...user,
+          role,
+          isAdminOrGlobalBuilder,
+          isAppBuilder,
+        }
+      })
+      .sort((a, b) => {
+        const roleA = a.role
+        const roleB = b.role
+        if (roleA === undefined && roleB !== undefined) {
+          return 1
+        } else if (roleA !== undefined && roleB === undefined) {
+          return -1
+        }
+        return 0
+      })
   }
 
   const debouncedUpdateFetch = Utils.debounce(searchUsers, 250)
@@ -201,6 +212,9 @@
       return
     }
     try {
+      if (group?.builder?.apps.includes(prodAppId)) {
+        await removeGroupAppBuilder(group._id)
+      }
       await updateAppGroup(group, role)
     } catch {
       notifications.error("Group update failed")
@@ -242,9 +256,11 @@
   const enrichGroupRole = group => {
     return {
       ...group,
-      role: group.roles?.[
-        groups.actions.getGroupAppIds(group).find(x => x === prodAppId)
-      ],
+      role: group?.builder?.apps.includes(prodAppId)
+        ? Constants.Roles.CREATOR
+        : group.roles?.[
+            groups.actions.getGroupAppIds(group).find(x => x === prodAppId)
+          ],
     }
   }
 
@@ -257,7 +273,7 @@
   $: filteredGroups = searchGroups(enrichedGroups, query)
   $: groupUsers = buildGroupUsers(filteredGroups, filteredUsers)
   $: allUsers = [...filteredUsers, ...groupUsers]
-
+  $: console.log(filteredGroups)
   /*  
     Create pseudo users from the "users" attribute on app groups.
     These users will appear muted in the UI and show the ROLE
@@ -393,6 +409,14 @@
     await users.removeAppBuilder(userId, prodAppId)
   }
 
+  const addGroupAppBuilder = async groupId => {
+    await groups.actions.addGroupAppBuilder(groupId, prodAppId)
+  }
+
+  const removeGroupAppBuilder = async groupId => {
+    await groups.actions.removeGroupAppBuilder(groupId, prodAppId)
+  }
+
   const initSidePanel = async sidePaneOpen => {
     if (sidePaneOpen === true) {
       await groups.actions.init()
@@ -577,9 +601,13 @@
                     allowRemove={group.role}
                     allowPublic={false}
                     quiet={true}
+                    allowCreator={true}
                     on:change={e => {
                       onUpdateGroup(group, e.detail)
                     }}
+                    on:addcreator={() => {
+                      addGroupAppBuilder(group._id)
+                    }}
                     on:remove={() => {
                       onUpdateGroup(group)
                     }}
@@ -612,7 +640,7 @@
                     value={user.role}
                     allowRemove={user.role && !user.group}
                     allowPublic={false}
-                    allowCreator
+                    allowCreator={true}
                     quiet={true}
                     on:addcreator={() => {
                       addAppBuilder(user._id)

packages/builder/src/stores/portal/groups.js

@@ -80,6 +80,14 @@ export function createGroupsStore() {
     getGroupAppIds: group => {
       return Object.keys(group?.roles || {})
     },
+
+    addGroupAppBuilder: async (groupId, appId) => {
+      return await API.addGroupAppBuilder({ groupId, appId })
+    },
+
+    removeGroupAppBuilder: async (groupId, appId) => {
+      return await API.removeGroupAppBuilder({ groupId, appId })
+    },
   }
 
   return {

packages/frontend-core/src/api/groups.js

@@ -104,5 +104,27 @@ export const buildGroupsEndpoints = API => {
     removeAppsFromGroup: async (groupId, appArray) => {
       return updateGroupResource(groupId, "apps", "remove", appArray)
     },
+
+    /**
+     * Add app builder to group
+     * @param groupId The group to update
+     * @param appId The app id where the builder will be added
+     */
+    addGroupAppBuilder: async ({ groupId, appId }) => {
+      return await API.post({
+        url: `/api/global/groups/${groupId}/app/${appId}/builder`,
+      })
+    },
+
+    /**
+     * Remove app builder from group
+     * @param groupId The group to update
+     * @param appId The app id where the builder will be removed
+     */
+    removeGroupAppBuilder: async ({ groupId, appId }) => {
+      return await API.delete({
+        url: `/api/global/groups/${groupId}/app/${appId}/builder`,
+      })
+    },
   }
 }