mirror of
https://github.com/scm-manager/scm-manager.git
synced 2025-11-13 17:05:43 +01:00
reorder directory structure, add PermissionRoleDetail and Root
This commit is contained in:
@@ -10,8 +10,9 @@ import type { Links } from "@scm-manager/ui-types";
|
||||
import { Page, Navigation, NavLink, Section } from "@scm-manager/ui-components";
|
||||
import { getLinks } from "../../modules/indexResource";
|
||||
import GlobalConfig from "./GlobalConfig";
|
||||
import GlobalPermissionRoles from "./GlobalPermissionRoles";
|
||||
import GlobalPermissionRoleForm from "./GlobalPermissionRoleForm";
|
||||
import PermissionRolesOverview from "../roles/containers/PermissionRolesOverview";
|
||||
import PermissionRoleRoot from "../roles/containers/PermissionRoleRoot";
|
||||
import CreatePermissionRole from "../roles/containers/CreatePermissionRole";
|
||||
|
||||
type Props = {
|
||||
links: Links,
|
||||
@@ -36,7 +37,7 @@ class Config extends React.Component<Props> {
|
||||
|
||||
matchesRoles = (route: any) => {
|
||||
const url = this.matchedUrl();
|
||||
const regex = new RegExp(`${url}/role/.+/edit`);
|
||||
const regex = new RegExp(`${url}/role/.+/info`);
|
||||
return route.location.pathname.match(regex);
|
||||
};
|
||||
|
||||
@@ -54,16 +55,19 @@ class Config extends React.Component<Props> {
|
||||
<div className="columns">
|
||||
<div className="column is-three-quarters">
|
||||
<Route path={url} exact component={GlobalConfig} />
|
||||
<Route
|
||||
path={`${url}/role/:role`}
|
||||
component={() => <PermissionRoleRoot baseUrl={`${url}/roles`} />}
|
||||
/>
|
||||
<Route
|
||||
path={`${url}/roles`}
|
||||
exact
|
||||
render={() => (
|
||||
<GlobalPermissionRoles
|
||||
baseUrl={`${url}/role`}
|
||||
/>
|
||||
)}
|
||||
render={() => <PermissionRolesOverview baseUrl={`${url}/role`} />}
|
||||
/>
|
||||
<Route
|
||||
path={`${url}/roles/create`}
|
||||
render={() => <CreatePermissionRole />}
|
||||
/>
|
||||
<Route path={`${url}/role`} component={GlobalPermissionRoleForm} />
|
||||
<ExtensionPoint
|
||||
name="config.route"
|
||||
props={extensionProps}
|
||||
@@ -78,9 +82,10 @@ class Config extends React.Component<Props> {
|
||||
label={t("config.globalConfigurationNavLink")}
|
||||
/>
|
||||
<NavLink
|
||||
to={`${url}/roles`}
|
||||
to={`${url}/roles/`}
|
||||
label={t("roles.navLink")}
|
||||
activeWhenMatch={this.matchesRoles}
|
||||
activeOnlyWhenExact={false}
|
||||
/>
|
||||
<ExtensionPoint
|
||||
name="config.navigation"
|
||||
|
||||
@@ -1,179 +0,0 @@
|
||||
// @flow
|
||||
import React from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { translate } from "react-i18next";
|
||||
import type { Role } from "@scm-manager/ui-types";
|
||||
import { InputField, SubmitButton } from "@scm-manager/ui-components";
|
||||
import PermissionCheckbox from "../../repos/permissions/components/PermissionCheckbox";
|
||||
import {
|
||||
fetchAvailableVerbs,
|
||||
getFetchVerbsFailure,
|
||||
getVerbsFromState,
|
||||
isFetchVerbsPending
|
||||
} from "../modules/roles";
|
||||
import { getRepositoryVerbsLink } from "../../modules/indexResource";
|
||||
|
||||
type Props = {
|
||||
role?: Role,
|
||||
loading?: boolean,
|
||||
disabled: boolean,
|
||||
availableVerbs: string[],
|
||||
verbsLink: string,
|
||||
|
||||
// context objects
|
||||
t: string => string,
|
||||
|
||||
// dispatch functions
|
||||
fetchAvailableVerbs: (link: string) => void
|
||||
};
|
||||
|
||||
type State = {
|
||||
role: Role
|
||||
};
|
||||
|
||||
class GlobalPermissionRoleForm extends React.Component<Props, State> {
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
role: {
|
||||
name: "",
|
||||
verbs: [],
|
||||
system: false,
|
||||
_links: {}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
const { fetchAvailableVerbs, verbsLink, role } = this.props;
|
||||
fetchAvailableVerbs(verbsLink);
|
||||
|
||||
if (role) {
|
||||
this.setState({
|
||||
role: {
|
||||
...role,
|
||||
role: { verbs: role.verbs }
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
isFalsy(value) {
|
||||
return !value;
|
||||
}
|
||||
|
||||
isValid = () => {
|
||||
const { role } = this.state;
|
||||
return !(
|
||||
this.isFalsy(role) ||
|
||||
this.isFalsy(role.name) ||
|
||||
this.isFalsy(role.verbs)
|
||||
);
|
||||
};
|
||||
|
||||
handleNameChange = (name: string) => {
|
||||
this.setState({
|
||||
role: {
|
||||
...this.state.role,
|
||||
name
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
handleVerbChange = (value: boolean, name: string) => {
|
||||
const { role } = this.state;
|
||||
|
||||
const newVerbs = value
|
||||
? [...role.verbs, name]
|
||||
: role.verbs.filter(v => v !== name);
|
||||
|
||||
this.setState({
|
||||
...this.state,
|
||||
role: {
|
||||
...role,
|
||||
verbs: newVerbs
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
submit = (event: Event) => {
|
||||
event.preventDefault();
|
||||
if (this.isValid()) {
|
||||
// this.props.submitForm(this.state.role);
|
||||
//TODO ADD createRole here
|
||||
}
|
||||
};
|
||||
|
||||
render() {
|
||||
const { loading, availableVerbs, disabled, t } = this.props;
|
||||
const { role } = this.state;
|
||||
|
||||
const verbSelectBoxes = !availableVerbs
|
||||
? null
|
||||
: availableVerbs.map(verb => (
|
||||
<PermissionCheckbox
|
||||
key={verb}
|
||||
// disabled={readOnly}
|
||||
name={verb}
|
||||
checked={role.verbs.includes(verb)}
|
||||
onChange={this.handleVerbChange}
|
||||
/>
|
||||
));
|
||||
|
||||
return (
|
||||
<form onSubmit={this.submit}>
|
||||
<div className="columns">
|
||||
<div className="column">
|
||||
<InputField
|
||||
name="name"
|
||||
label={t("roles.form.name")}
|
||||
onChange={this.handleNameChange}
|
||||
value={role.name ? role.name : ""}
|
||||
disabled={!!role.name || disabled}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{verbSelectBoxes}
|
||||
<hr />
|
||||
<div className="columns">
|
||||
<div className="column">
|
||||
<SubmitButton
|
||||
loading={loading}
|
||||
label={t("roles.form.submit")}
|
||||
disabled={disabled || !this.isValid()}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const mapStateToProps = (state, ownProps) => {
|
||||
const loading = isFetchVerbsPending(state);
|
||||
const error = getFetchVerbsFailure(state);
|
||||
const verbsLink = getRepositoryVerbsLink(state);
|
||||
const availableVerbs = getVerbsFromState(state);
|
||||
|
||||
return {
|
||||
loading,
|
||||
error,
|
||||
verbsLink,
|
||||
availableVerbs
|
||||
};
|
||||
};
|
||||
|
||||
const mapDispatchToProps = dispatch => {
|
||||
return {
|
||||
fetchAvailableVerbs: (link: string) => {
|
||||
dispatch(fetchAvailableVerbs(link));
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
export default connect(
|
||||
mapStateToProps,
|
||||
mapDispatchToProps
|
||||
)(translate("config")(GlobalPermissionRoleForm));
|
||||
@@ -1,122 +0,0 @@
|
||||
// @flow
|
||||
import React from "react";
|
||||
import { connect } from "react-redux";
|
||||
import {withRouter} from "react-router-dom";
|
||||
import { translate } from "react-i18next";
|
||||
import type { History } from "history";
|
||||
import type { Role, PagedCollection } from "@scm-manager/ui-types";
|
||||
import {
|
||||
Title,
|
||||
Loading,
|
||||
Notification,
|
||||
LinkPaginator,
|
||||
urls,
|
||||
CreateButton
|
||||
} from "@scm-manager/ui-components";
|
||||
import {
|
||||
fetchRolesByPage,
|
||||
getRolesFromState,
|
||||
selectListAsCollection,
|
||||
isPermittedToCreateRoles,
|
||||
isFetchRolesPending,
|
||||
getFetchRolesFailure
|
||||
} from "../modules/roles";
|
||||
import PermissionRoleTable from "../components/table/PermissionRoleTable";
|
||||
import { getRolesLink } from "../../modules/indexResource";
|
||||
type Props = {
|
||||
baseUrl: string,
|
||||
roles: Role[],
|
||||
loading: boolean,
|
||||
error: Error,
|
||||
canAddRoles: boolean,
|
||||
list: PagedCollection,
|
||||
page: number,
|
||||
rolesLink: string,
|
||||
|
||||
// context objects
|
||||
t: string => string,
|
||||
history: History,
|
||||
|
||||
// dispatch functions
|
||||
fetchRolesByPage: (link: string, page: number) => void
|
||||
};
|
||||
|
||||
class GlobalPermissionRoles extends React.Component<Props> {
|
||||
componentDidMount() {
|
||||
const { fetchRolesByPage, rolesLink, page } = this.props;
|
||||
fetchRolesByPage(rolesLink, page);
|
||||
}
|
||||
|
||||
render() {
|
||||
const { t, loading } = this.props;
|
||||
|
||||
if (loading) {
|
||||
return <Loading />;
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Title title={t("roles.title")} />
|
||||
{this.renderPermissionsTable()}
|
||||
{this.renderCreateButton()}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
renderPermissionsTable() {
|
||||
const { baseUrl, roles, list, page, t } = this.props;
|
||||
if (roles && roles.length > 0) {
|
||||
return (
|
||||
<>
|
||||
<PermissionRoleTable baseUrl={baseUrl} roles={roles} />
|
||||
<LinkPaginator collection={list} page={page} />
|
||||
</>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<Notification type="info">{t("roles.noPermissionRoles")}</Notification>
|
||||
);
|
||||
}
|
||||
|
||||
renderCreateButton() {
|
||||
const { canAddRoles, baseUrl, t } = this.props;
|
||||
if (canAddRoles) {
|
||||
return <CreateButton label={t("roles.createButton")} link={`${baseUrl}/create`} />;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
const mapStateToProps = (state, ownProps) => {
|
||||
const { match } = ownProps;
|
||||
const roles = getRolesFromState(state);
|
||||
const loading = isFetchRolesPending(state);
|
||||
const error = getFetchRolesFailure(state);
|
||||
const page = urls.getPageFromMatch(match);
|
||||
const canAddRoles = isPermittedToCreateRoles(state);
|
||||
const list = selectListAsCollection(state);
|
||||
const rolesLink = getRolesLink(state);
|
||||
|
||||
return {
|
||||
roles,
|
||||
loading,
|
||||
error,
|
||||
canAddRoles,
|
||||
list,
|
||||
page,
|
||||
rolesLink
|
||||
};
|
||||
};
|
||||
|
||||
const mapDispatchToProps = dispatch => {
|
||||
return {
|
||||
fetchRolesByPage: (link: string, page: number) => {
|
||||
dispatch(fetchRolesByPage(link, page));
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
export default withRouter(connect(
|
||||
mapStateToProps,
|
||||
mapDispatchToProps
|
||||
)(translate("config")(GlobalPermissionRoles)));
|
||||
Reference in New Issue
Block a user