Add interface to modify permissions for a user

This commit is contained in:
René Pfeuffer
2019-01-18 10:49:35 +01:00
parent f3531f6715
commit 34a7c34bb9
10 changed files with 342 additions and 3 deletions

View File

@@ -0,0 +1,22 @@
{
"repository": {
"read": {
"*": {
"displayName": "Read all repositories",
"description": "Read access to all repositories"
}
},
"write": {
"*": {
"displayName": "Modify all repositories",
"description": "May modify/configure all repositories"
}
}
},
"user":{
"*": {
"displayName": "Administer users",
"description": "May administer all users"
}
}
}

View File

@@ -32,6 +32,9 @@
"set-password-button": {
"label": "Set password"
},
"set-permissions-button": {
"label": "Set permissions"
},
"user-form": {
"submit": "Submit"
},
@@ -55,6 +58,9 @@
"password": {
"set-password-successful": "Password successfully set"
},
"permissions": {
"set-permissions-successful": "Permissions successfully set"
},
"help": {
"usernameHelpText": "Unique name of the user.",
"displayNameHelpText": "Display name of the user.",

View File

@@ -0,0 +1,32 @@
// @flow
import React from "react";
import { translate } from "react-i18next";
import { Checkbox } from "@scm-manager/ui-components";
type Props = {
permission: string,
checked: boolean,
onChange: (value: boolean, name: string) => void,
disabled: boolean,
t: string => string
};
class PermissionCheckbox extends React.Component<Props> {
render() {
const { t, permission, checked, onChange, disabled } = this.props;
const key = permission.split(":").join(".");
return (
<Checkbox
name={permission}
label={t(key + ".displayName")}
checked={checked}
onChange={onChange}
disabled={disabled}
helpText={t(key + ".description")}
/>
);
}
}
export default translate("permissions")(PermissionCheckbox);

View File

@@ -0,0 +1,196 @@
// @flow
import React from "react";
import type { User } from "@scm-manager/ui-types";
import {
Notification,
ErrorNotification,
SubmitButton
} from "@scm-manager/ui-components";
import { translate } from "react-i18next";
import { setPermissions } from "./setPermissions";
import { apiClient } from "@scm-manager/ui-components";
import PermissionCheckbox from "./PermissionCheckbox";
import { connect } from "react-redux";
import { getLink } from "../../modules/indexResource";
type Props = {
user: User,
t: string => string,
permissionLink: string
};
type State = {
permissions: { [string]: boolean },
loading: boolean,
error?: Error,
permissionsChanged: boolean,
permissionsSubmitted: boolean,
modifiable: boolean
};
class SetUserPermissions extends React.Component<Props, State> {
constructor(props: Props) {
super(props);
this.state = {
permissions: { perm1: false, perm2: false },
loading: true,
permissionsChanged: false,
permissionsSubmitted: false,
modifiable: false
};
}
setLoadingState = () => {
this.setState({
...this.state,
loading: true
});
};
setErrorState = (error: Error) => {
this.setState({
...this.state,
error: error,
loading: false
});
};
setSuccessfulState = () => {
this.setState({
...this.state,
loading: false,
permissionsSubmitted: true,
permissionsChanged: false
});
};
componentDidMount(): void {
apiClient
.get(this.props.permissionLink)
.then(response => {
return response.json();
})
.then(response => {
const availablePermissions = response.permissions;
const permissions = {};
availablePermissions.forEach(p => {
permissions[p] = false;
});
this.setState({ permissions }, this.loadPermissionsForUser);
});
}
loadPermissionsForUser = () => {
apiClient
.get(this.props.user._links.permissions.href)
.then(response => {
return response.json();
})
.then(response => {
const checkedPermissions = response.permissions;
const modifiable = !!response._links.overwrite;
this.setState(state => {
const newPermissions = state.permissions;
checkedPermissions.forEach(name => (newPermissions[name] = true));
return {
loading: false,
modifiable: modifiable,
permissions: newPermissions
};
});
});
};
submit = (event: Event) => {
event.preventDefault();
if (this.state.permissions) {
const { user } = this.props;
const { permissions } = this.state;
this.setLoadingState();
const selectedPermissions = Object.entries(permissions)
.filter(e => e[1])
.map(e => e[0]);
setPermissions(user._links.permissions.href, selectedPermissions)
.then(result => {
if (result.error) {
this.setErrorState(result.error);
} else {
this.setSuccessfulState();
}
})
.catch(err => {});
}
};
render() {
const { t } = this.props;
const { loading, permissionsSubmitted, error } = this.state;
let message = null;
if (permissionsSubmitted) {
message = (
<Notification
type={"success"}
children={t("permissions.set-permissions-successful")}
onClose={() => this.onClose()}
/>
);
} else if (error) {
message = <ErrorNotification error={error} />;
}
return (
<form onSubmit={this.submit}>
{message}
{this.renderPermissions()}
<SubmitButton
disabled={!this.state.permissionsChanged}
loading={loading}
label={t("user-form.submit")}
/>
</form>
);
}
renderPermissions = () => {
const { modifiable, permissions } = this.state;
return Object.keys(permissions).map(p => (
<div key={p}>
<PermissionCheckbox
permission={p}
checked={permissions[p]}
onChange={this.valueChanged}
disabled={!modifiable}
/>
</div>
));
};
valueChanged = (value: boolean, name: string) => {
this.setState(state => {
const newPermissions = state.permissions;
newPermissions[name] = value;
return {
permissions: newPermissions,
permissionsChanged: true
};
});
};
onClose = () => {
this.setState({
permissionsSubmitted: false
});
};
}
const mapStateToProps = state => {
const permissionLink = getLink(state, "permissions");
return {
permissionLink
};
};
export default connect(mapStateToProps)(translate("users")(SetUserPermissions));

View File

@@ -0,0 +1,28 @@
//@flow
import React from "react";
import { translate } from "react-i18next";
import type { User } from "@scm-manager/ui-types";
import { NavLink } from "@scm-manager/ui-components";
type Props = {
t: string => string,
user: User,
permissionsUrl: String
};
class ChangePermissionNavLink extends React.Component<Props> {
render() {
const { t, permissionsUrl } = this.props;
if (!this.hasPermissionToSetPermission()) {
return null;
}
return <NavLink label={t("set-permissions-button.label")} to={permissionsUrl} />;
}
hasPermissionToSetPermission = () => {
return this.props.user._links.permissions;
};
}
export default translate("users")(ChangePermissionNavLink);

View File

@@ -0,0 +1,31 @@
import React from "react";
import { shallow } from "enzyme";
import "../../../tests/enzyme";
import "../../../tests/i18n";
import SetPermissionsNavLink from "./SetPermissionsNavLink";
it("should render nothing, if the permissions link is missing", () => {
const user = {
_links: {}
};
const navLink = shallow(
<SetPermissionsNavLink user={user} permissionsUrl="/user/permissions" />
);
expect(navLink.text()).toBe("");
});
it("should render the navLink", () => {
const user = {
_links: {
permissions: {
href: "/permissions"
}
}
};
const navLink = shallow(
<SetPermissionsNavLink user={user} permissionsUrl="/user/permissions" />
);
expect(navLink.text()).not.toBe("");
});

View File

@@ -1,3 +1,4 @@
export { default as DeleteUserNavLink } from "./DeleteUserNavLink";
export { default as EditUserNavLink } from "./EditUserNavLink";
export { default as SetPasswordNavLink } from "./SetPasswordNavLink";
export { default as SetPermissionsNavLink } from "./SetPermissionsNavLink";

View File

@@ -0,0 +1,13 @@
//@flow
import { apiClient } from "@scm-manager/ui-components";
export const CONTENT_TYPE_PERMISSIONS =
"application/vnd.scmm-permissionCollection+json;v=2";
export function setPermissions(url: string, permissions: string[]) {
return apiClient
.put(url, { permissions: permissions }, CONTENT_TYPE_PERMISSIONS)
.then(response => {
return response;
});
}

View File

@@ -27,11 +27,13 @@ import {
import {
DeleteUserNavLink,
EditUserNavLink,
SetPasswordNavLink
SetPasswordNavLink,
SetPermissionsNavLink
} from "./../components/navLinks";
import { translate } from "react-i18next";
import { getUsersLink } from "../../modules/indexResource";
import SetUserPassword from "../components/SetUserPassword";
import SetUserPermissions from "../components/SetUserPermissions";
type Props = {
name: string,
@@ -106,6 +108,10 @@ class SingleUser extends React.Component<Props> {
path={`${url}/password`}
component={() => <SetUserPassword user={user} />}
/>
<Route
path={`${url}/permissions`}
component={() => <SetUserPermissions user={user} />}
/>
</div>
<div className="column">
<Navigation>
@@ -119,6 +125,10 @@ class SingleUser extends React.Component<Props> {
user={user}
passwordUrl={`${url}/password`}
/>
<SetPermissionsNavLink
user={user}
permissionsUrl={`${url}/permissions`}
/>
</Section>
<Section label={t("single-user.actions-label")}>
<DeleteUserNavLink user={user} deleteUser={this.deleteUser} />

View File

@@ -38,11 +38,11 @@
</permission>
<permission>
<value>repository:*:WRITE</value>
<value>repository:write:*</value>
</permission>
<permission>
<value>repository:*:OWNER</value>
<value>user:*</value>
</permission>
</permissions>