implement modify for type

scm-ui/src/modules/failure.js

@@ -59,7 +59,6 @@ export function getFailure(
   itemId?: string | number
 ) {
   if (state.failure) {
-    console.log(state.failure);
     let identifier = actionType;
     if (itemId) {
       identifier += "/" + itemId;

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

@@ -6,7 +6,7 @@ import {
   fetchPermissions,
   getFetchPermissionsFailure,
   isFetchPermissionsPending,
-  getPermissionsOfRepo
+  getPermissionsOfRepo,
 } from "../modules/permissions";
 import Loading from "../../components/Loading";
 import ErrorPage from "../../components/ErrorPage";
@@ -52,7 +52,13 @@ class Permissions extends React.Component<Props> {
     }
 
     if (permissions.length > 0)
-      return <PermissionsTable permissions={permissions} namespace={namespace} name={name} />;
+      return (
+        <PermissionsTable
+          permissions={permissions}
+          namespace={namespace}
+          name={name}
+        />
+      );
 
     return <div />;
   }

scm-ui/src/permissions/containers/PermissionsTable.js

@@ -3,14 +3,8 @@ import React from "react";
 import { translate } from "react-i18next";
 import PermissionRow from "../components/table/PermissionRow";
 import type { Permission, PermissionCollection } from "../types/Permissions";
-import PermissionRowEditable from "../components/table/PermissionRowEditable";
-import connect from "react-redux/es/connect/connect";
-import { modifyPermission } from "../modules/permissions";
+import SinglePermission from "./SinglePermission";
 import type { History } from "history";
-import {
-  getModifyRepoFailure,
-  isModifyRepoPending
-} from "../../repos/modules/repos";
 
 type Props = {
   t: string => string,
@@ -18,12 +12,14 @@ type Props = {
   modifyPermission: (Permission, string, string, () => void) => void,
   namespace: string,
   name: string,
+  match: any,
   history: History
 };
 
 class PermissionsTable extends React.Component<Props> {
   permissionsModified = () => {
     const { history, name, namespace } = this.props;
+    console.log(history);
     history.push(`/repo/${namespace}/${name}/permissions`);
   };
 
@@ -43,17 +39,11 @@ class PermissionsTable extends React.Component<Props> {
           {permissions.map((permission, index) => {
             if (permission._links.update)
               return (
-                <PermissionRowEditable
+                <SinglePermission
                   key={index}
+                  namespace={namespace}
+                  name={name}
                   permission={permission}
-                  submitForm={permission => {
-                    this.props.modifyPermission(
-                      permission,
-                      namespace,
-                      name,
-                      this.permissionsModified
-                    );
-                  }}
                 />
               );
             else return <PermissionRow key={index} permission={permission} />;
@@ -64,21 +54,4 @@ class PermissionsTable extends React.Component<Props> {
   }
 }
 
-const mapStateToProps = (state, ownProps) => {};
-
-const mapDispatchToProps = dispatch => {
-  return {
-    modifyPermission: (
-      permission: Permission,
-      namespace: string,
-      name: string,
-      callback: () => void
-    ) => {
-      dispatch(modifyPermission(permission, namespace, name, callback));
-    }
-  };
-};
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(translate("permissions")(PermissionsTable));
+export default translate("permissions")(PermissionsTable);

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

@@ -1,22 +1,31 @@
 // @flow
 import React from "react";
-import type { Permission } from "../../types/Permissions";
-import { Checkbox, InputField } from "../../../components/forms/index";
-import { DeleteButton, SubmitButton } from "../../../components/buttons/index";
+import type { Permission } from "../types/Permissions";
+import { Checkbox } from "../../components/forms/index";
+import { DeleteButton } from "../../components/buttons/index";
 import { translate } from "react-i18next";
-import { Select } from "../../../components/forms/index";
+import { Select } from "../../components/forms/index";
+import { modifyPermission } from "../modules/permissions";
+import connect from "react-redux/es/connect/connect";
+import { withRouter } from "react-router-dom";
+import type { History } from "history";
 
 type Props = {
   submitForm: Permission => void,
+  modifyPermission: (Permission, string, string) => void,
   permission: Permission,
-  t: string => string
+  t: string => string,
+  namespace: string,
+  name: string,
+  match: any,
+  history: History
 };
 
 type State = {
   permission: Permission
 };
 
-class PermissionRowEditable extends React.Component<Props, State> {
+class SinglePermission extends React.Component<Props, State> {
   constructor(props: Props) {
     super(props);
 
@@ -43,10 +52,7 @@ class PermissionRowEditable extends React.Component<Props, State> {
       });
     }
   }
-  submit = (event: Event) => {
-    event.preventDefault();
-    this.props.submitForm(this.state.permission);
-  };
+
   render() {
     const { permission } = this.state;
     const { t } = this.props;
@@ -58,12 +64,7 @@ class PermissionRowEditable extends React.Component<Props, State> {
 
     return (
       <tr>
-        <td>
-          <InputField
-            value={permission.name ? permission.name : ""}
-            onChange={this.handleNameChange}
-          />
-        </td>
+        <td>{permission.name}</td>
         <td className="is-hidden-mobile">
           <Select
             onChange={this.handleTypeChange}
@@ -72,18 +73,7 @@ class PermissionRowEditable extends React.Component<Props, State> {
           />
         </td>
         <td>
-          <Checkbox
-            checked={
-              permission.groupPermission ? permission.groupPermission : false
-            }
-            onChange={this.handleGroupPermissionChange}
-          />
-        </td>
-        <td>
-          <SubmitButton
-            label={t("edit-permission.save-button")}
-            action={this.submit}
-          />
+          <Checkbox checked={permission ? permission.groupPermission : false} />
         </td>
         <td>{deleteButton}</td>
       </tr>
@@ -97,6 +87,17 @@ class PermissionRowEditable extends React.Component<Props, State> {
         type: type
       }
     });
+    this.modifyPermission(type);
+  };
+
+  modifyPermission = (type: string) => {
+    let permission = this.state.permission;
+    permission.type = type;
+    this.props.modifyPermission(
+      permission,
+      this.props.namespace,
+      this.props.name
+    );
   };
 
   createSelectOptions(types: string[]) {
@@ -107,24 +108,22 @@ class PermissionRowEditable extends React.Component<Props, State> {
       };
     });
   }
-
-  handleNameChange = (name: string) => {
-    this.setState({
-      permission: {
-        ...this.state.permission,
-        name: name
-      }
-    });
-  };
-
-  handleGroupPermissionChange = (groupPermission: boolean) => {
-    this.setState({
-      permission: {
-        ...this.state.permission,
-        groupPermission: groupPermission
-      }
-    });
-  };
 }
 
-export default translate("permissions")(PermissionRowEditable);
+const mapStateToProps = (state, ownProps) => {};
+
+const mapDispatchToProps = dispatch => {
+  return {
+    modifyPermission: (
+      permission: Permission,
+      namespace: string,
+      name: string
+    ) => {
+      dispatch(modifyPermission(permission, namespace, name));
+    }
+  };
+};
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(translate("permissions")(withRouter(SinglePermission)));

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

@@ -98,12 +98,15 @@ export function modifyPermission(
   callback?: () => void
 ) {
   return function(dispatch: any) {
-    dispatch(modifyPermissionPending(permission, namespace, name));
-
+    dispatch(
+      modifyPermissionPending(permission, namespace, name)
+    );
     return apiClient
       .put(permission._links.update.href, permission, CONTENT_TYPE)
       .then(() => {
-        dispatch(modifyPermissionSuccess(permission, namespace, name));
+        dispatch(
+          modifyPermissionSuccess(permission, namespace, name)
+        );
         if (callback) {
           callback();
         }
@@ -125,7 +128,7 @@ export function modifyPermissionPending(
   return {
     type: MODIFY_PERMISSION_PENDING,
     payload: permission,
-    itemId: namespace + "/" + name
+    itemId: namespace + "/" + name + "/" + permission.name
   };
 }
 
@@ -136,7 +139,9 @@ export function modifyPermissionSuccess(
 ): Action {
   return {
     type: MODIFY_PERMISSION_SUCCESS,
-    payload: permission,
+    payload: {
+      permission
+    },
     itemId: namespace + "/" + name
   };
 }
@@ -150,16 +155,28 @@ export function modifyPermissionFailure(
   return {
     type: MODIFY_PERMISSION_FAILURE,
     payload: { error, permission },
-    itemId: namespace + "/" + name
+    itemId: namespace + "/" + name + "/" + permission.name
   };
 }
 
-function newPermissions(modifiedPermission: Permission) {
-  let newPermissions = [];
-  newPermissions[0] = modifiedPermission;
-  return {
-    newPermissions
-  };
+function newPermissions(
+  oldPermissions: PermissionCollection,
+  newPermission: Permission
+) {
+  console.log("oldPermissions:");
+  console.log(oldPermissions);
+  console.log("new Permission:");
+  console.log(newPermission);
+  for (let i = 0; i < oldPermissions.length; i++) {
+    console.log("permissionname:");
+    console.log("an der stelle i: " + oldPermissions[i].name);
+    if (oldPermissions[i].name === newPermission.name) {
+      oldPermissions.splice(i, 1, newPermission);
+      console.log("new Permissions");
+      console.log(oldPermissions);
+      return oldPermissions;
+    }
+  }
 }
 
 // reducer
@@ -178,7 +195,10 @@ export default function reducer(
         [action.itemId]: action.payload._embedded.permissions
       };
     case MODIFY_PERMISSION_SUCCESS:
-      const newPermission = newPermissions(action.payload);
+      const newPermission = newPermissions(
+        state[action.itemId],
+        action.payload.permission
+      );
       return {
         ...state,
         [action.itemId]: newPermission
@@ -216,3 +236,29 @@ export function getFetchPermissionsFailure(
 ) {
   return getFailure(state, FETCH_PERMISSIONS, namespace + "/" + name);
 }
+
+export function isModifyPermissionPending(
+  state: Object,
+  namespace: string,
+  name: string,
+  permissionname: string
+) {
+  return isPending(
+    state,
+    MODIFY_PERMISSION,
+    namespace + "/" + name + "/" + permissionname
+  );
+}
+
+export function getModifyPermissionFailure(
+  state: Object,
+  namespace: string,
+  name: string,
+  permissionname: string
+) {
+  return getFailure(
+    state,
+    MODIFY_PERMISSION,
+    namespace + "/" + name + "/" + permissionname
+  );
+}

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

@@ -10,13 +10,16 @@ import reducer, {
   getFetchPermissionsFailure,
   modifyPermission,
   modifyPermissionSuccess,
+  getModifyPermissionFailure,
+  isModifyPermissionPending,
   MODIFY_PERMISSION_FAILURE,
   MODIFY_PERMISSION_PENDING,
   FETCH_PERMISSIONS,
   FETCH_PERMISSIONS_PENDING,
   FETCH_PERMISSIONS_SUCCESS,
   FETCH_PERMISSIONS_FAILURE,
-  MODIFY_PERMISSION_SUCCESS
+  MODIFY_PERMISSION_SUCCESS,
+  MODIFY_PERMISSION
 } from "./permissions";
 import type { Permission, PermissionCollection } from "../types/Permissions";
 import { modifyRepoSuccess } from "../../repos/modules/repos";
@@ -141,7 +144,14 @@ describe("permission fetch", () => {
     const store = mockStore({});
 
     return store
-      .dispatch(modifyPermission(editedPermission, "hitchhiker", "puzzle42"))
+      .dispatch(
+        modifyPermission(
+          editedPermission,
+          "hitchhiker",
+          "puzzle42",
+          "user_eins"
+        )
+      )
       .then(() => {
         const actions = store.getActions();
         expect(actions[0].type).toEqual(MODIFY_PERMISSION_PENDING);
@@ -193,7 +203,14 @@ describe("permission fetch", () => {
     const store = mockStore({});
 
     return store
-      .dispatch(modifyPermission(editedPermission, "hitchhiker", "puzzle42"))
+      .dispatch(
+        modifyPermission(
+          editedPermission,
+          "hitchhiker",
+          "puzzle42",
+          "user_eins"
+        )
+      )
       .then(() => {
         const actions = store.getActions();
         expect(actions[0].type).toEqual(MODIFY_PERMISSION_PENDING);
@@ -235,19 +252,20 @@ describe("permissions reducer", () => {
 
   it("should update permission", () => {
     const oldState = {
-      permissions: {
-        "hitchhiker/puzzle42": {
-          hitchhiker_puzzle42Permission_user_eins
-        }
-      }
+      "hitchhiker/puzzle42": [hitchhiker_puzzle42Permission_user_eins]
     };
     let permissionEdited = { ...hitchhiker_puzzle42Permission_user_eins };
     permissionEdited.type = "OWNER";
+    let expectedState = {
+      "hitchhiker/puzzle42": [permissionEdited]
+    };
     const newState = reducer(
       oldState,
       modifyPermissionSuccess(permissionEdited, "hitchhiker", "puzzle42")
     );
-    expect(newState["hitchhiker/puzzle42"]).toEqual(permissionEdited);
+    expect(newState["hitchhiker/puzzle42"]).toEqual(
+      expectedState["hitchhiker/puzzle42"]
+    );
   });
 });
 
@@ -302,4 +320,38 @@ describe("permissions selectors", () => {
       undefined
     );
   });
+
+  it("should return true, when modify permission is pending", () => {
+    const state = {
+      pending: {
+        [MODIFY_PERMISSION + "/hitchhiker/puzzle42/user_eins"]: true
+      }
+    };
+    expect(
+      isModifyPermissionPending(state, "hitchhiker", "puzzle42", "user_eins")
+    ).toEqual(true);
+  });
+
+  it("should return false, when modify permissions is not pending", () => {
+    expect(
+      isModifyPermissionPending({}, "hitchiker", "puzzle42", "user_eins")
+    ).toEqual(false);
+  });
+
+  it("should return error when modify permissions did fail", () => {
+    const state = {
+      failure: {
+        [MODIFY_PERMISSION + "/hitchhiker/puzzle42/user_eins"]: error
+      }
+    };
+    expect(
+      getModifyPermissionFailure(state, "hitchhiker", "puzzle42", "user_eins")
+    ).toEqual(error);
+  });
+
+  it("should return undefined when modify permissions did not fail", () => {
+    expect(
+      getModifyPermissionFailure({}, "hitchhiker", "puzzle42", "user_eins")
+    ).toBe(undefined);
+  });
 });