Nemcio/SCM-Manager
1
0
Fork 0
mirror of https://github.com/scm-manager/scm-manager.git synced 2025-11-10 23:45:44 +01:00
Code Issues Packages Projects Releases Activity

Extract single permission editor

Browse Source
This commit is contained in:
René Pfeuffer
2019-01-18 14:16:26 +01:00
parent 0711475d78
commit 8e77b55a15
10 changed files with 52 additions and 251 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
scm-ui/public/locales/en/groups.json
View File

@@ -66,8 +66,5 @@
},
"set-permissions-button": {
"label": "Set permissions"
},
"permissions": {
"set-permissions-successful": "Permissions successfully set"
}
}

6
scm-ui/public/locales/en/permissions.json
View File

@@ -18,5 +18,11 @@
"displayName": "Administer users",
"description": "May administer all users"
}
},
"form": {
"submit-button": {
"label": "Set permissions"
},
"set-permissions-successful": "Permissions set successfully"
}
}

3
scm-ui/public/locales/en/users.json
View File

@@ -58,9 +58,6 @@
"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.",

198
scm-ui/src/groups/components/SetGroupPermissions.js
View File

@@ -1,198 +0,0 @@
// @flow
import React from "react";
import type { Group } 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 "../../users/components/PermissionCheckbox";
import { connect } from "react-redux";
import { getLink } from "../../modules/indexResource";
type Props = {
group: Group,
t: string => string,
permissionLink: string
};
type State = {
permissions: { [string]: boolean },
loading: boolean,
error?: Error,
permissionsChanged: boolean,
permissionsSubmitted: boolean,
modifiable: boolean
};
class SetGroupPermissions 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.loadPermissionsForGroup);
});
}
loadPermissionsForGroup = () => {
apiClient
.get(this.props.group._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 { group } = this.props;
const { permissions } = this.state;
this.setLoadingState();
const selectedPermissions = Object.entries(permissions)
.filter(e => e[1])
.map(e => e[0]);
setPermissions(group._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("group-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("groups")(SetGroupPermissions)
);

6
scm-ui/src/groups/containers/SingleGroup.js
View File

@@ -31,7 +31,7 @@ import {
import { translate } from "react-i18next";
import EditGroup from "./EditGroup";
import { getGroupsLink } from "../../modules/indexResource";
import SetGroupPermissions from "../components/SetGroupPermissions";
import SetPermissions from "../../permissions/components/SetPermissions";
type Props = {
name: string,
@@ -110,7 +110,9 @@ class SingleGroup extends React.Component<Props> {
<Route
path={`${url}/permissions`}
exact
component={() => <SetGroupPermissions group={group} />}
component={() => (
<SetPermissions selectedPermissionsLink={group._links.permissions} />
)}
/>
</div>
<div className="column">

2
scm-ui/src/users/components/PermissionCheckbox.js → scm-ui/src/permissions/components/PermissionCheckbox.js
View File

@@ -2,7 +2,7 @@
import React from "react";
import { translate } from "react-i18next";
import { Checkbox } from "@scm-manager/ui-components";
import { Checkbox } from "../../../../scm-ui-components/packages/ui-components/src";
type Props = {
permission: string,

64
scm-ui/src/users/components/SetUserPermissions.js → scm-ui/src/permissions/components/SetPermissions.js
View File

@@ -1,6 +1,6 @@
// @flow
import React from "react";
import type { User } from "@scm-manager/ui-types";
import type { Link } from "@scm-manager/ui-types";
import {
Notification,
ErrorNotification,
@@ -14,9 +14,9 @@ import { connect } from "react-redux";
import { getLink } from "../../modules/indexResource";
type Props = {
user: User,
t: string => string,
permissionLink: string
availablePermissionLink: string,
selectedPermissionsLink: Link
};
type State = {
@@ -25,19 +25,20 @@ type State = {
error?: Error,
permissionsChanged: boolean,
permissionsSubmitted: boolean,
modifiable: boolean
overwritePermissionsLink?: Link
};
class SetUserPermissions extends React.Component<Props, State> {
class SetPermissions extends React.Component<Props, State> {
constructor(props: Props) {
super(props);
this.state = {
permissions: { perm1: false, perm2: false },
permissions: {},
loading: true,
permissionsChanged: false,
permissionsSubmitted: false,
modifiable: false
modifiable: false,
overwritePermissionsLink: undefined
};
}
@@ -67,7 +68,7 @@ class SetUserPermissions extends React.Component<Props, State> {
componentDidMount(): void {
apiClient
.get(this.props.permissionLink)
.get(this.props.availablePermissionLink)
.then(response => {
return response.json();
})
@@ -83,20 +84,19 @@ class SetUserPermissions extends React.Component<Props, State> {
loadPermissionsForUser = () => {
apiClient
.get(this.props.user._links.permissions.href)
.get(this.props.selectedPermissionsLink.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
permissions: newPermissions,
overwritePermissionsLink: response._links.overwrite
};
});
});
@@ -105,21 +105,25 @@ class SetUserPermissions extends React.Component<Props, State> {
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 => {});
if (this.state.overwritePermissionsLink) {
setPermissions(
this.state.overwritePermissionsLink.href,
selectedPermissions
)
.then(result => {
if (result.error) {
this.setErrorState(result.error);
} else {
this.setSuccessfulState();
}
})
.catch(err => {});
}
}
};
@@ -133,7 +137,7 @@ class SetUserPermissions extends React.Component<Props, State> {
message = (
<Notification
type={"success"}
children={t("permissions.set-permissions-successful")}
children={t("form.set-permissions-successful")}
onClose={() => this.onClose()}
/>
);
@@ -148,21 +152,21 @@ class SetUserPermissions extends React.Component<Props, State> {
<SubmitButton
disabled={!this.state.permissionsChanged}
loading={loading}
label={t("user-form.submit")}
label={t("form.submit-button.label")}
/>
</form>
);
}
renderPermissions = () => {
const { modifiable, permissions } = this.state;
const { overwritePermissionsLink, permissions } = this.state;
return Object.keys(permissions).map(p => (
<div key={p}>
<PermissionCheckbox
permission={p}
checked={permissions[p]}
onChange={this.valueChanged}
disabled={!modifiable}
disabled={!overwritePermissionsLink}
/>
</div>
));
@@ -187,10 +191,12 @@ class SetUserPermissions extends React.Component<Props, State> {
}
const mapStateToProps = state => {
const permissionLink = getLink(state, "permissions");
const availablePermissionLink = getLink(state, "permissions");
return {
permissionLink
availablePermissionLink
};
};
export default connect(mapStateToProps)(translate("users")(SetUserPermissions));
export default connect(mapStateToProps)(
translate("permissions")(SetPermissions)
);

0
scm-ui/src/groups/components/setPermissions.js → scm-ui/src/permissions/components/setPermissions.js
View File

13
scm-ui/src/users/components/setPermissions.js
View File

@@ -1,13 +0,0 @@
//@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;
});
}

8
scm-ui/src/users/containers/SingleUser.js
View File

@@ -33,7 +33,7 @@ import {
import { translate } from "react-i18next";
import { getUsersLink } from "../../modules/indexResource";
import SetUserPassword from "../components/SetUserPassword";
import SetUserPermissions from "../components/SetUserPermissions";
import SetPermissions from "../../permissions/components/SetPermissions";
type Props = {
name: string,
@@ -110,7 +110,11 @@ class SingleUser extends React.Component<Props> {
/>
<Route
path={`${url}/permissions`}
component={() => <SetUserPermissions user={user} />}
component={() => (
<SetPermissions
selectedPermissionsLink={user._links.permissions}
/>
)}
/>
</div>
<div className="column">