91 lines
2.3 KiB
TypeScript
91 lines
2.3 KiB
TypeScript
import React from 'react';
|
|
import { Link } from 'react-router-dom';
|
|
import { Button, Popconfirm, message } from 'antd';
|
|
import { UserProposal } from 'types';
|
|
import { deletePendingProposal } from 'modules/users/actions';
|
|
import { connect } from 'react-redux';
|
|
import { AppState } from 'store/reducers';
|
|
import './ProfilePending.less';
|
|
|
|
interface OwnProps {
|
|
proposal: UserProposal;
|
|
}
|
|
|
|
interface StateProps {
|
|
user: AppState['auth']['user'];
|
|
}
|
|
|
|
interface DispatchProps {
|
|
deletePendingProposal: typeof deletePendingProposal;
|
|
}
|
|
|
|
type Props = OwnProps & StateProps & DispatchProps;
|
|
|
|
interface State {
|
|
isDeleting: boolean;
|
|
}
|
|
|
|
class ProfilePending extends React.Component<Props, State> {
|
|
state: State = {
|
|
isDeleting: false,
|
|
};
|
|
|
|
render() {
|
|
const { status, title, proposalId, rejectReason } = this.props.proposal;
|
|
const { isDeleting } = this.state;
|
|
|
|
const isDisableActions = isDeleting;
|
|
|
|
return (
|
|
<div className="ProfilePending">
|
|
<div className="ProfilePending-block">
|
|
<Link to={`/proposals/${proposalId}`} className="ProfilePending-title">
|
|
{title}
|
|
</Link>
|
|
<div className={`ProfilePending-status is-${status.toLowerCase()}`}>
|
|
<div>This proposal has been rejected permanently:</div>
|
|
<q>{rejectReason}</q>
|
|
<div>You may not re-submit it for approval.</div>
|
|
</div>
|
|
</div>
|
|
<div className="ProfilePending-block is-actions">
|
|
<Popconfirm
|
|
key="delete"
|
|
title="Are you sure?"
|
|
onConfirm={() => this.handleDelete()}
|
|
>
|
|
<Button type="default" disabled={isDisableActions} loading={isDeleting}>
|
|
Delete
|
|
</Button>
|
|
</Popconfirm>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
private handleDelete = async () => {
|
|
const {
|
|
user,
|
|
proposal: { proposalId },
|
|
} = this.props;
|
|
if (!user) return;
|
|
this.setState({ isDeleting: true });
|
|
try {
|
|
await this.props.deletePendingProposal(user.userid, proposalId);
|
|
message.success('Proposal deleted.');
|
|
} catch (e) {
|
|
message.error(e.message || e.toString());
|
|
}
|
|
this.setState({ isDeleting: false });
|
|
};
|
|
}
|
|
|
|
export default connect<StateProps, DispatchProps, OwnProps, AppState>(
|
|
state => ({
|
|
user: state.auth.user,
|
|
}),
|
|
{
|
|
deletePendingProposal,
|
|
},
|
|
)(ProfilePending);
|