Add permissions for new user

scm-ui/src/repos/permissions/components/CreatePermissionForm.js

@@ -4,14 +4,17 @@ import { translate } from "react-i18next";
 import { Autocomplete, SubmitButton } from "@scm-manager/ui-components";
 import TypeSelector from "./TypeSelector";
 import type {
+  AvailableRepositoryPermissions,
   PermissionCollection,
   PermissionCreateEntry,
   SelectValue
 } from "@scm-manager/ui-types";
 import * as validator from "./permissionValidation";
+import { findMatchingRoleName } from "../modules/permissions";
 
 type Props = {
   t: string => string,
+  availablePermissions: AvailableRepositoryPermissions,
   createPermission: (permission: PermissionCreateEntry) => void,
   loading: boolean,
   currentPermissions: PermissionCollection,
@@ -21,7 +24,7 @@ type Props = {
 
 type State = {
   name: string,
-  type: string,
+  verbs: string[],
   groupPermission: boolean,
   valid: boolean,
   value?: SelectValue
@@ -33,7 +36,7 @@ class CreatePermissionForm extends React.Component<Props, State> {
 
     this.state = {
       name: "",
-      type: "READ",
+      verbs: props.availablePermissions.availableRoles[0].verbs,
       groupPermission: false,
       valid: true,
       value: undefined
@@ -121,9 +124,14 @@ class CreatePermissionForm extends React.Component<Props, State> {
   };
 
   render() {
-    const { t, loading } = this.props;
+    const { t, availablePermissions, loading } = this.props;
 
-    const { type } = this.state;
+    const { verbs } = this.state;
+
+    const availableRoleNames = availablePermissions.availableRoles.map(
+      r => r.name
+    );
+    const matchingRole = findMatchingRoleName(availablePermissions, verbs);
 
     return (
       <div>
@@ -161,10 +169,15 @@ class CreatePermissionForm extends React.Component<Props, State> {
             </div>
             <div className="column is-one-quarter">
               <TypeSelector
+                availableTypes={availableRoleNames}
                 label={t("permission.type")}
                 helpText={t("permission.help.typeHelpText")}
                 handleTypeChange={this.handleTypeChange}
-                    type={type ? type : "READ"}
+                type={
+                  matchingRole
+                    ? matchingRole
+                    : availablePermissions.availableRoles[0].name
+                }
               />
             </div>
           </div>
@@ -185,7 +198,7 @@ class CreatePermissionForm extends React.Component<Props, State> {
   submit = e => {
     this.props.createPermission({
       name: this.state.name,
-      type: this.state.type,
+      verbs: this.state.verbs,
       groupPermission: this.state.groupPermission
     });
     this.removeState();
@@ -195,17 +208,24 @@ class CreatePermissionForm extends React.Component<Props, State> {
   removeState = () => {
     this.setState({
       name: "",
-      type: "READ",
+      verbs: this.props.availablePermissions.availableRoles[0].verbs,
       groupPermission: false,
       valid: true
     });
   };
 
   handleTypeChange = (type: string) => {
+    const selectedRole = this.findAvailableRole(type);
     this.setState({
-      type: type
+      verbs: selectedRole.verbs
     });
   };
+
+  findAvailableRole = (type: string) => {
+    return this.props.availablePermissions.availableRoles.find(
+      role => role.name === type
+    );
+  };
 }
 
 export default translate("repos")(CreatePermissionForm);

scm-ui/src/repos/permissions/containers/Permissions.js

@@ -128,6 +128,7 @@ class Permissions extends React.Component<Props> {
 
     const createPermissionForm = hasPermissionToCreate ? (
       <CreatePermissionForm
+        availablePermissions={availablePermissions}
         createPermission={permission => this.createPermission(permission)}
         loading={loadingCreatePermission}
         currentPermissions={permissions}

scm-ui/src/repos/permissions/containers/SinglePermission.js

@@ -9,7 +9,8 @@ import {
   modifyPermission,
   isModifyPermissionPending,
   deletePermission,
-  isDeletePermissionPending
+  isDeletePermissionPending,
+  findMatchingRoleName
 } from "../modules/permissions";
 import { connect } from "react-redux";
 import type { History } from "history";
@@ -57,9 +58,12 @@ class SinglePermission extends React.Component<Props, State> {
   }
 
   componentDidMount() {
-    const { permission } = this.props;
+    const { availablePermissions, permission } = this.props;
 
-    const matchingRole = this.findMatchingRoleName();
+    const matchingRole = findMatchingRoleName(
+      availablePermissions,
+      permission.verbs
+    );
 
     if (permission) {
       this.setState({
@@ -74,33 +78,6 @@ class SinglePermission extends React.Component<Props, State> {
     }
   }
 
-  findMatchingRoleName = () => {
-    const { availablePermissions, permission } = this.props;
-    if (!permission) {
-      return "";
-    }
-    const matchingRole = availablePermissions.availableRoles.find(role => {
-      return this.equalVerbs(role.verbs, permission.verbs);
-    });
-
-    if (matchingRole) {
-      return matchingRole.name;
-    } else {
-      return "";
-    }
-  };
-  equalVerbs = (verbs1: string[], verbs2: string[]) => {
-    if (!verbs1 || !verbs2) {
-      return false;
-    }
-
-    if (verbs1.length !== verbs2.length) {
-      return false;
-    }
-
-    return verbs1.every(verb => verbs2.includes(verb));
-  };
-
   deletePermission = () => {
     this.props.deletePermission(
       this.props.permission,
@@ -150,18 +127,25 @@ class SinglePermission extends React.Component<Props, State> {
   }
 
   handleTypeChange = (type: string) => {
+    const selectedRole = this.findAvailableRole(type);
     this.setState({
       permission: {
         ...this.state.permission,
-        type: type
+        verbs: selectedRole.verbs
       }
     });
-    this.modifyPermission(type);
+    this.modifyPermission(selectedRole.verbs);
   };
 
-  modifyPermission = (type: string) => {
+  findAvailableRole = (type: string) => {
+    return this.props.availablePermissions.availableRoles.find(
+      role => role.name === type
+    );
+  };
+
+  modifyPermission = (verbs: string[]) => {
     let permission = this.state.permission;
-    permission.type = type;
+    permission.verbs = verbs;
     this.props.modifyPermission(
       permission,
       this.props.namespace,

scm-ui/src/repos/permissions/modules/permissions.js

@@ -700,3 +700,33 @@ export function getModifyPermissionsFailure(
   }
   return null;
 }
+
+export function findMatchingRoleName(
+  availablePermissions: AvailableRepositoryPermissions,
+  verbs: string[]
+) {
+  if (!verbs) {
+    return "";
+  }
+  const matchingRole = availablePermissions.availableRoles.find(role => {
+    return equalVerbs(role.verbs, verbs);
+  });
+
+  if (matchingRole) {
+    return matchingRole.name;
+  } else {
+    return "";
+  }
+}
+
+function equalVerbs(verbs1: string[], verbs2: string[]) {
+  if (!verbs1 || !verbs2) {
+    return false;
+  }
+
+  if (verbs1.length !== verbs2.length) {
+    return false;
+  }
+
+  return verbs1.every(verb => verbs2.includes(verb));
+}