Footer in menu. Remove admin

packages/frontend-2/components/settings/workspaces/members/UpdateActionsMenu.vue

@@ -71,7 +71,8 @@ const isActiveUserTargetUser = computed(
 )
 
 const filteredActionsItems = computed(() => {
-  const baseItems: LayoutMenuItem[][] = []
+  const mainItems: LayoutMenuItem[] = []
+  const footerItems: LayoutMenuItem[] = []
 
   Object.entries(UPDATE_WORKSPACE_MEMBER_CONFIG).forEach(([type, config]) => {
     if (
@@ -85,11 +86,24 @@ const filteredActionsItems = computed(() => {
         targetUserCurrentSeatType: props.targetUser.seatType
       })
     ) {
-      baseItems.push([{ title: config.menu.title, id: type as UserUpdateActionTypes }])
+      const item = { title: config.menu.title, id: type as UserUpdateActionTypes }
+
+      // Add remove/leave actions to footer, others to main section
+      if (
+        type === UserUpdateActionTypes.RemoveMember ||
+        type === UserUpdateActionTypes.LeaveWorkspace
+      ) {
+        footerItems.push(item)
+      } else {
+        mainItems.push(item)
+      }
     }
   })
 
-  return baseItems
+  const result: LayoutMenuItem[][] = []
+  if (mainItems.length) result.push(mainItems)
+  if (footerItems.length) result.push(footerItems)
+  return result
 })
 
 const onActionChosen = (actionItem: LayoutMenuItem) => {
@@ -156,6 +170,7 @@ const onDialogConfirm = async () => {
     case UserUpdateActionTypes.MakeGuest:
       await onUpdateRole(Roles.Workspace.Guest)
       break
+    case UserUpdateActionTypes.RemoveAdmin:
     case UserUpdateActionTypes.MakeMember:
       await onUpdateRole(Roles.Workspace.Member)
       break

packages/frontend-2/lib/settings/helpers/constants.ts

@@ -30,7 +30,7 @@ export const UPDATE_WORKSPACE_MEMBER_CONFIG: Record<
         targetUserCurrentRole !== Roles.Workspace.Guest
     },
     dialog: {
-      title: 'Make Admin',
+      title: 'Make admin',
       mainMessage: (seatType) =>
         seatType === WorkspaceSeatType.Editor
           ? 'They will become project owner for all existing and new workspace projects.'
@@ -40,6 +40,26 @@ export const UPDATE_WORKSPACE_MEMBER_CONFIG: Record<
       seatCountMessage: true
     }
   },
+  [UserUpdateActionTypes.RemoveAdmin]: {
+    menu: {
+      title: 'Remove as admin...',
+      show: ({
+        isActiveUserWorkspaceAdmin = false,
+        isActiveUserTargetUser,
+        targetUserCurrentRole
+      }) =>
+        isActiveUserWorkspaceAdmin &&
+        !isActiveUserTargetUser &&
+        targetUserCurrentRole === Roles.Workspace.Admin
+    },
+    dialog: {
+      title: 'Remove as admin',
+      mainMessage: 'They will lose admin privileges and become a member.',
+      showRoleInfo: false,
+      buttonText: 'Remove as admin',
+      seatCountMessage: false
+    }
+  },
   [UserUpdateActionTypes.MakeGuest]: {
     menu: {
       title: 'Make guest...',
@@ -53,7 +73,7 @@ export const UPDATE_WORKSPACE_MEMBER_CONFIG: Record<
         targetUserCurrentRole !== Roles.Workspace.Guest
     },
     dialog: {
-      title: 'Make Guest',
+      title: 'Make guest',
       mainMessage: 'They will lose access to all existing workspace projects.',
       showRoleInfo: true,
       buttonText: 'Make a guest'
@@ -72,7 +92,7 @@ export const UPDATE_WORKSPACE_MEMBER_CONFIG: Record<
         targetUserCurrentRole === Roles.Workspace.Guest
     },
     dialog: {
-      title: 'Make Member',
+      title: 'Make member',
       mainMessage: (seatType) =>
         seatType === WorkspaceSeatType.Editor
           ? 'They will be given a viewer seat and lose project ownership.'

packages/frontend-2/lib/settings/helpers/types.ts

@@ -16,6 +16,7 @@ export enum UserUpdateActionTypes {
   RemoveMember = 'remove-member',
   LeaveWorkspace = 'leave-workspace',
   MakeAdmin = 'make-admin',
+  RemoveAdmin = 'remove-admin',
   MakeGuest = 'make-guest',
   MakeMember = 'make-member',
   UpgradeEditor = 'upgrade-editor',