Import members feature for Workspace and MCP creation

public/locales/en.json

@@ -7,7 +7,8 @@
   },
   "Entities": {
     "ManagedControlPlane": "Managed Control Plane",
-    "Project": "Project"
+    "Project": "Project",
+    "Workspace": "Workspace"
   },
   "ComponentList": {
     "tableComponentHeader": "Name",
@@ -142,7 +143,7 @@
     "subtitle": "Fetching data..."
   },
   "MemberTable": {
-    "columnEmailHeader": "Email",
+    "columnNameHeader": "Name",
     "columnRoleHeader": "Role",
     "columnTypeHeader": "Type",
     "columnNamespaceHeader": "Namespace"
@@ -165,9 +166,9 @@
     "membersHeader": "Members"
   },
   "EditMembers": {
-    "addButton": "Add new member or service account",
-    "editHeader": "Edit member or service account",
-    "addHeader": "Add new member or service account",
+    "addButton": "Add User or ServiceAccount",
+    "editHeader": "Edit User or ServiceAccount",
+    "addHeader": "Add User or ServiceAccount",
     "saveButton": "Save changes",
     "defaultNamespaceInfo": "Leave empty to use <span>default</span> namespace",
     "serviceAccoutsGuide": "You can also use our <link1>Service Account Guide</link1> for more information."
@@ -312,6 +313,7 @@
     "maxChars": "Max length is {{maxLength}} characters.",
     "userExists": "User with this name already exists!",
     "atLeastOneUser": "You need to have at least one member assigned.",
+    "selectAtLeastOneOption": "Select at least one option",
     "notValidChargingTargetFormat": "Use lowercase letters a-f, numbers 0-9, and hyphens (-) in the format: aaaaaaaa-aaaa-aaaa-aaaa-aaaaaaaaaaaa"
   },
   "common": {
@@ -421,4 +423,14 @@
       "activate": "Activate"
     }
   }
+  ,
+  "ImportMembersDialog": {
+    "dialogTitle": "Reuse",
+    "chooseParentLabel": "Choose parent resource to reuse members from",
+    "whatToImportLabel": "What would you like to import?",
+    "serviceAccountsLabel": "Service Accounts",
+    "addMembersButton": "Add members",
+    "selectAllButton": "Select all",
+    "deselectAllButton": "Deselect all"
+  }
 }

src/components/Dialogs/CreateProjectWorkspaceDialog.tsx

@@ -35,7 +35,7 @@ export interface CreateProjectWorkspaceDialogProps {
   errors: FieldErrors<CreateDialogProps>;
   setValue: UseFormSetValue<CreateDialogProps>;
   projectName?: string;
-  type: 'workspace' | 'project';
+  type: 'workspace' | 'project' | 'mcp';
   watch: UseFormWatch<CreateDialogProps>;
 }
 
@@ -93,7 +93,13 @@ export function CreateProjectWorkspaceDialog({
           requireChargingTarget={type === 'project'}
           sideFormContent={
             <FormGroup headerText={t('CreateProjectWorkspaceDialog.membersHeader')}>
-              <EditMembers members={members} isValidationError={!!errors.members} onMemberChanged={setMembers} />
+              <EditMembers
+                type={type}
+                members={members}
+                isValidationError={!!errors.members}
+                projectName={projectName}
+                onMemberChanged={setMembers}
+              />
             </FormGroup>
           }
         />

src/components/Members/EditMembers.tsx

@@ -1,36 +1,46 @@
-import { FC, useCallback, useState } from 'react';
+import { FC, useCallback, useMemo, useState } from 'react';
 import { Button, FlexBox } from '@ui5/webcomponents-react';
 import { MemberTable } from './MemberTable.tsx';
 import { Member } from '../../lib/api/types/shared/members';
 import { useTranslation } from 'react-i18next';
 import styles from './Members.module.css';
 import { RadioButtonsSelectOption } from '../Ui/RadioButtonsSelect/RadioButtonsSelect.tsx';
 import { AddEditMemberDialog } from './AddEditMemberDialog.tsx';
+import { ImportMembersDialog } from './ImportMembersDialog.tsx';
 
 export interface EditMembersProps {
   members: Member[];
   onMemberChanged: (members: Member[]) => void;
   isValidationError?: boolean;
   requireAtLeastOneMember?: boolean;
+  projectName?: string;
+  workspaceName?: string;
+  type: 'workspace' | 'project' | 'mcp';
 }
 
 export const ACCOUNT_TYPES: RadioButtonsSelectOption[] = [
-  { value: 'User', label: 'User Account', icon: 'employee' },
+  { value: 'User', label: 'User', icon: 'employee' },
   { value: 'ServiceAccount', label: 'Service Account', icon: 'machine' },
 ];
 
 export type AccountType = 'User' | 'ServiceAccount';
 
+const removeProjectPrefix = (name?: string) => (name?.startsWith('project-') ? name.slice('project-'.length) : name);
+
 export const EditMembers: FC<EditMembersProps> = ({
   members,
   onMemberChanged,
   isValidationError = false,
   requireAtLeastOneMember = true,
+  workspaceName,
+  projectName,
+  type,
 }) => {
   const { t } = useTranslation();
 
   const [isMemberDialogOpen, setIsMemberDialogOpen] = useState(false);
   const [memberToEdit, setMemberToEdit] = useState<Member | undefined>(undefined);
+  const [isImportDialogOpen, setIsImportDialogOpen] = useState(false);
 
   const handleRemoveMember = useCallback(
     (email: string) => {
@@ -53,6 +63,26 @@ export const EditMembers: FC<EditMembersProps> = ({
     setIsMemberDialogOpen(false);
   }, []);
 
+  const handleOpenImportDialog = useCallback(() => {
+    setIsImportDialogOpen(true);
+  }, []);
+
+  const handleCloseImportDialog = useCallback(() => {
+    setIsImportDialogOpen(false);
+  }, []);
+
+  const handleImportMembers = useCallback(
+    (imported: Member[]) => {
+      const byName = new Map<string, Member>();
+      members.forEach((m) => byName.set(m.name, m));
+      imported.forEach((m) => byName.set(m.name, m));
+      const merged = Array.from(byName.values());
+      onMemberChanged(merged);
+      setIsImportDialogOpen(false);
+    },
+    [members, onMemberChanged],
+  );
+
   const handleSaveMember = useCallback(
     (member: Member, isEdit: boolean) => {
       let updatedMembers: Member[];
@@ -74,17 +104,34 @@ export const EditMembers: FC<EditMembersProps> = ({
     [members, onMemberChanged, memberToEdit],
   );
 
+  const computedProjectName = useMemo(
+    () => (type === 'mcp' ? removeProjectPrefix(projectName) : projectName),
+    [type, projectName],
+  );
+
   return (
     <FlexBox direction="Column" gap={8}>
-      <Button
-        className={styles.addButton}
-        data-testid="add-member-button"
-        design="Emphasized"
-        icon={'sap-icon://add-employee'}
-        onClick={handleOpenMemberFormDialog}
-      >
-        {t('EditMembers.addButton')}
-      </Button>
+      <FlexBox gap={8} justifyContent="SpaceBetween">
+        <Button
+          className={styles.addButton}
+          data-testid="add-member-button"
+          design="Emphasized"
+          icon={'sap-icon://add-employee'}
+          onClick={handleOpenMemberFormDialog}
+        >
+          {t('EditMembers.addButton')}
+        </Button>
+        {type !== 'project' && (
+          <Button
+            className={styles.narrowButton}
+            data-testid="import-members-button"
+            icon={'cause'}
+            onClick={handleOpenImportDialog}
+          >
+            {t('ImportMembersDialog.dialogTitle')}
+          </Button>
+        )}
+      </FlexBox>
       <AddEditMemberDialog
         open={isMemberDialogOpen}
         existingMembers={members}
@@ -93,6 +140,14 @@ export const EditMembers: FC<EditMembersProps> = ({
         onSave={handleSaveMember}
       />
 
+      <ImportMembersDialog
+        open={isImportDialogOpen}
+        workspaceName={workspaceName}
+        projectName={computedProjectName}
+        onClose={handleCloseImportDialog}
+        onImport={handleImportMembers}
+      />
+
       <MemberTable
         requireAtLeastOneMember={requireAtLeastOneMember}
         members={members}

src/components/Members/ImportMembersDialog.module.css

@@ -0,0 +1,9 @@
+.dialog {
+  min-width: 650px;
+}
+
+.table {
+  width: 100%;
+  max-height: 400px;
+  overflow-y: auto;
+}