mirror of
https://github.com/scm-manager/scm-manager.git
synced 2025-11-09 15:05:44 +01:00
added loading and error state
This commit is contained in:
@@ -2,9 +2,18 @@
|
||||
import React from "react";
|
||||
import { translate } from "react-i18next";
|
||||
import type { Group } from "@scm-manager/ui-types";
|
||||
import { Subtitle, DeleteButton, confirmAlert } from "@scm-manager/ui-components";
|
||||
import {
|
||||
Subtitle,
|
||||
DeleteButton,
|
||||
confirmAlert
|
||||
} from "@scm-manager/ui-components";
|
||||
import { getDeleteGroupFailure, isDeleteGroupPending } from "../modules/groups";
|
||||
import { connect } from "react-redux";
|
||||
import { ErrorNotification } from "@scm-manager/ui-components";
|
||||
|
||||
type Props = {
|
||||
loading: boolean,
|
||||
error: Error,
|
||||
group: Group,
|
||||
confirmDialog?: boolean,
|
||||
deleteGroup: (group: Group) => void,
|
||||
@@ -43,7 +52,7 @@ export class DeleteGroup extends React.Component<Props> {
|
||||
};
|
||||
|
||||
render() {
|
||||
const { confirmDialog, t } = this.props;
|
||||
const { loading, error, confirmDialog, t } = this.props;
|
||||
const action = confirmDialog ? this.confirmDelete : this.deleteGroup;
|
||||
|
||||
if (!this.isDeletable()) {
|
||||
@@ -53,11 +62,13 @@ export class DeleteGroup extends React.Component<Props> {
|
||||
return (
|
||||
<>
|
||||
<Subtitle subtitle={t("deleteGroup.subtitle")} />
|
||||
<ErrorNotification error={error} />
|
||||
<div className="columns">
|
||||
<div className="column">
|
||||
<DeleteButton
|
||||
label={t("deleteGroup.button")}
|
||||
action={action}
|
||||
loading={loading}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -66,4 +77,13 @@ export class DeleteGroup extends React.Component<Props> {
|
||||
}
|
||||
}
|
||||
|
||||
export default translate("groups")(DeleteGroup);
|
||||
const mapStateToProps = (state, ownProps) => {
|
||||
const loading = isDeleteGroupPending(state, ownProps.group.name);
|
||||
const error = getDeleteGroupFailure(state, ownProps.group.name);
|
||||
return {
|
||||
loading,
|
||||
error
|
||||
};
|
||||
};
|
||||
|
||||
export default connect(mapStateToProps)(translate("groups")(DeleteGroup));
|
||||
|
||||
@@ -7,8 +7,6 @@ import {
|
||||
deleteGroup,
|
||||
getModifyGroupFailure,
|
||||
isModifyGroupPending,
|
||||
getDeleteGroupFailure,
|
||||
isDeleteGroupPending,
|
||||
modifyGroupReset
|
||||
} from "../modules/groups";
|
||||
import type { History } from "history";
|
||||
@@ -67,7 +65,7 @@ class EditGroup extends React.Component<Props> {
|
||||
};
|
||||
|
||||
render() {
|
||||
const { group, loading, error } = this.props;
|
||||
const { loading, error, group } = this.props;
|
||||
return (
|
||||
<div>
|
||||
<ErrorNotification error={error} />
|
||||
@@ -80,17 +78,15 @@ class EditGroup extends React.Component<Props> {
|
||||
loadUserSuggestions={this.loadUserAutocompletion}
|
||||
/>
|
||||
<hr />
|
||||
<DeleteGroup
|
||||
group={group}
|
||||
deleteGroup={this.deleteGroup} />
|
||||
<DeleteGroup group={group} deleteGroup={this.deleteGroup} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const mapStateToProps = (state, ownProps) => {
|
||||
const loading = isModifyGroupPending(state, ownProps.group.name) || isDeleteGroupPending(state, ownProps.group.name);
|
||||
const error = getModifyGroupFailure(state, ownProps.group.name) || getDeleteGroupFailure(state, ownProps.group.name);
|
||||
const loading = isModifyGroupPending(state, ownProps.group.name);
|
||||
const error = getModifyGroupFailure(state, ownProps.group.name);
|
||||
const autocompleteLink = getUserAutoCompleteLink(state);
|
||||
return {
|
||||
loading,
|
||||
|
||||
@@ -2,9 +2,18 @@
|
||||
import React from "react";
|
||||
import { translate } from "react-i18next";
|
||||
import type { Repository } from "@scm-manager/ui-types";
|
||||
import { Subtitle, DeleteButton, confirmAlert } from "@scm-manager/ui-components";
|
||||
import {
|
||||
Subtitle,
|
||||
DeleteButton,
|
||||
confirmAlert
|
||||
} from "@scm-manager/ui-components";
|
||||
import { getDeleteRepoFailure, isDeleteRepoPending } from "../modules/repos";
|
||||
import { connect } from "react-redux";
|
||||
import { ErrorNotification } from "@scm-manager/ui-components";
|
||||
|
||||
type Props = {
|
||||
loading: boolean,
|
||||
error: Error,
|
||||
repository: Repository,
|
||||
confirmDialog?: boolean,
|
||||
|
||||
@@ -47,7 +56,7 @@ class DeleteRepo extends React.Component<Props> {
|
||||
};
|
||||
|
||||
render() {
|
||||
const { confirmDialog, t } = this.props;
|
||||
const { loading, error, confirmDialog, t } = this.props;
|
||||
const action = confirmDialog ? this.confirmDelete : this.deleteRepo;
|
||||
|
||||
if (!this.isDeletable()) {
|
||||
@@ -57,11 +66,13 @@ class DeleteRepo extends React.Component<Props> {
|
||||
return (
|
||||
<>
|
||||
<Subtitle subtitle={t("deleteRepo.subtitle")} />
|
||||
<ErrorNotification error={error} />
|
||||
<div className="columns">
|
||||
<div className="column">
|
||||
<DeleteButton
|
||||
label={t("deleteRepo.button")}
|
||||
action={action}
|
||||
loading={loading}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -70,4 +81,14 @@ class DeleteRepo extends React.Component<Props> {
|
||||
}
|
||||
}
|
||||
|
||||
export default translate("repos")(DeleteRepo);
|
||||
const mapStateToProps = (state, ownProps) => {
|
||||
const { namespace, name } = ownProps.repository;
|
||||
const loading = isDeleteRepoPending(state, namespace, name);
|
||||
const error = getDeleteRepoFailure(state, namespace, name);
|
||||
return {
|
||||
loading,
|
||||
error
|
||||
};
|
||||
};
|
||||
|
||||
export default connect(mapStateToProps)(translate("repos")(DeleteRepo));
|
||||
|
||||
@@ -2,9 +2,18 @@
|
||||
import React from "react";
|
||||
import { translate } from "react-i18next";
|
||||
import type { User } from "@scm-manager/ui-types";
|
||||
import { Subtitle, DeleteButton, confirmAlert } from "@scm-manager/ui-components";
|
||||
import {
|
||||
Subtitle,
|
||||
DeleteButton,
|
||||
confirmAlert
|
||||
} from "@scm-manager/ui-components";
|
||||
import { getDeleteUserFailure, isDeleteUserPending } from "../modules/users";
|
||||
import { connect } from "react-redux";
|
||||
import { ErrorNotification } from "@scm-manager/ui-components";
|
||||
|
||||
type Props = {
|
||||
loading: boolean,
|
||||
error: Error,
|
||||
user: User,
|
||||
confirmDialog?: boolean,
|
||||
|
||||
@@ -47,7 +56,7 @@ class DeleteUser extends React.Component<Props> {
|
||||
};
|
||||
|
||||
render() {
|
||||
const { confirmDialog, t } = this.props;
|
||||
const { loading, error, confirmDialog, t } = this.props;
|
||||
const action = confirmDialog ? this.confirmDelete : this.deleteUser;
|
||||
|
||||
if (!this.isDeletable()) {
|
||||
@@ -57,11 +66,13 @@ class DeleteUser extends React.Component<Props> {
|
||||
return (
|
||||
<>
|
||||
<Subtitle subtitle={t("deleteUser.subtitle")} />
|
||||
<ErrorNotification error={error} />
|
||||
<div className="columns">
|
||||
<div className="column">
|
||||
<DeleteButton
|
||||
label={t("deleteUser.button")}
|
||||
action={action}
|
||||
loading={loading}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -70,4 +81,13 @@ class DeleteUser extends React.Component<Props> {
|
||||
}
|
||||
}
|
||||
|
||||
export default translate("users")(DeleteUser);
|
||||
const mapStateToProps = (state, ownProps) => {
|
||||
const loading = isDeleteUserPending(state, ownProps.user.name);
|
||||
const error = getDeleteUserFailure(state, ownProps.user.name);
|
||||
return {
|
||||
loading,
|
||||
error
|
||||
};
|
||||
};
|
||||
|
||||
export default connect(mapStateToProps)(translate("users")(DeleteUser));
|
||||
|
||||
@@ -71,8 +71,8 @@ class EditUser extends React.Component<Props> {
|
||||
}
|
||||
|
||||
const mapStateToProps = (state, ownProps) => {
|
||||
const loading = isModifyUserPending(state, ownProps.user.name) || isDeleteUserPending(state, ownProps.user.name);
|
||||
const error = getModifyUserFailure(state, ownProps.user.name) || getDeleteUserFailure(state, ownProps.user.name);
|
||||
const loading = isModifyUserPending(state, ownProps.user.name);
|
||||
const error = getModifyUserFailure(state, ownProps.user.name);
|
||||
return {
|
||||
loading,
|
||||
error
|
||||
|
||||
Reference in New Issue
Block a user