Nemcio/SCM-Manager
1
0
Fork 0
mirror of https://github.com/scm-manager/scm-manager.git synced 2025-11-11 07:55:47 +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": { "set-permissions-button": {
"label": "Set permissions" "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", "displayName": "Administer users",
"description": "May administer all 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": { "password": {
"set-password-successful": "Password successfully set" "set-password-successful": "Password successfully set"
}, },
"permissions": {
"set-permissions-successful": "Permissions successfully set"
},
"help": { "help": {
"usernameHelpText": "Unique name of the user.", "usernameHelpText": "Unique name of the user.",
"displayNameHelpText": "Display 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 { translate } from "react-i18next";
import EditGroup from "./EditGroup"; import EditGroup from "./EditGroup";
import { getGroupsLink } from "../../modules/indexResource"; import { getGroupsLink } from "../../modules/indexResource";
import SetGroupPermissions from "../components/SetGroupPermissions"; import SetPermissions from "../../permissions/components/SetPermissions";
type Props = { type Props = {
name: string, name: string,
@@ -110,7 +110,9 @@ class SingleGroup extends React.Component<Props> {
<Route <Route
path={`${url}/permissions`} path={`${url}/permissions`}
exact exact
component={() => <SetGroupPermissions group={group} />} component={() => (
<SetPermissions selectedPermissionsLink={group._links.permissions} />
)}
/> />
</div> </div>
<div className="column"> <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 React from "react";
import { translate } from "react-i18next"; import { translate } from "react-i18next";
import { Checkbox } from "@scm-manager/ui-components"; import { Checkbox } from "../../../../scm-ui-components/packages/ui-components/src";
type Props = { type Props = {
permission: string, permission: string,

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

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