PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Merge pull request #4049 from matrix-org/bwindels/verifybuttonsdisable

Browse source 
Disable verification buttons after clicking to avoid double submission
This commit is contained in:
Bruno Windels 2020-02-11 15:35:00 +00:00 committed by GitHub
commit 1d39aa6a81
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/components/views/messages/MKeyVerificationRequest.js
View file

@ -27,6 +27,7 @@ import {RIGHT_PANEL_PHASES} from "../../../stores/RightPanelStorePhases";
export default class MKeyVerificationRequest extends React.Component { export default class MKeyVerificationRequest extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = {};
} }
componentDidMount() { componentDidMount() {
@ -58,6 +59,7 @@ export default class MKeyVerificationRequest extends React.Component {
}; };
_onAcceptClicked = async () => { _onAcceptClicked = async () => {
this.setState({acceptOrCancelClicked: true});
const request = this.props.mxEvent.verificationRequest; const request = this.props.mxEvent.verificationRequest;
if (request) { if (request) {
try { try {
@ -70,6 +72,7 @@ export default class MKeyVerificationRequest extends React.Component {
}; };
_onRejectClicked = async () => { _onRejectClicked = async () => {
this.setState({acceptOrCancelClicked: true});
const request = this.props.mxEvent.verificationRequest; const request = this.props.mxEvent.verificationRequest;
if (request) { if (request) {
try { try {
@ -135,9 +138,10 @@ export default class MKeyVerificationRequest extends React.Component {
subtitle = (<div className="mx_cryptoEvent_subtitle">{ subtitle = (<div className="mx_cryptoEvent_subtitle">{
userLabelForEventRoom(request.requestingUserId, mxEvent.getRoomId())}</div>); userLabelForEventRoom(request.requestingUserId, mxEvent.getRoomId())}</div>);
if (request.requested && !request.observeOnly) { if (request.requested && !request.observeOnly) {
const disabled = this.state.acceptOrCancelClicked;
stateNode = (<div className="mx_cryptoEvent_buttons"> stateNode = (<div className="mx_cryptoEvent_buttons">
<FormButton kind="danger" onClick={this._onRejectClicked} label={_t("Decline")} /> <FormButton disabled={disabled} kind="danger" onClick={this._onRejectClicked} label={_t("Decline")} />
<FormButton onClick={this._onAcceptClicked} label={_t("Accept")} /> <FormButton disabled={disabled} onClick={this._onAcceptClicked} label={_t("Accept")} />
</div>); </div>);
} }
} else { // request sent by us } else { // request sent by us

4
src/components/views/right_panel/VerificationPanel.js
View file

@ -101,8 +101,9 @@ export default class VerificationPanel extends React.PureComponent {
if (pending) { if (pending) {
button = <Spinner />; button = <Spinner />;
} else { } else {
const disabled = this.state.emojiButtonClicked;
button = ( button = (
<AccessibleButton kind="primary" className="mx_UserInfo_wideButton" onClick={this._startSAS}> <AccessibleButton disabled={disabled} kind="primary" className="mx_UserInfo_wideButton" onClick={this._startSAS}>
{_t("Verify by emoji")} {_t("Verify by emoji")}
</AccessibleButton> </AccessibleButton>
); );
@ -219,6 +220,7 @@ export default class VerificationPanel extends React.PureComponent {
} }
_startSAS = async () => { _startSAS = async () => {
this.setState({emojiButtonClicked: true});
const verifier = this.props.request.beginKeyVerification(verificationMethods.SAS); const verifier = this.props.request.beginKeyVerification(verificationMethods.SAS);
try { try {
await verifier.verify(); await verifier.verify();