jiti-meet/react/features/room-lock/components/RoomLockPrompt.native.js

145 lines
3.8 KiB
JavaScript
Raw Normal View History

2017-10-04 22:36:09 +00:00
// @flow
2016-12-13 09:14:04 +00:00
import React, { Component } from 'react';
2019-03-19 15:42:25 +00:00
import type { Dispatch } from 'redux';
import { InputDialog } from '../../base/dialog';
2019-03-21 16:38:29 +00:00
import { connect } from '../../base/redux';
2016-12-13 09:14:04 +00:00
2017-03-01 02:55:12 +00:00
import { endRoomLockRequest } from '../actions';
/**
* The style of the {@link TextInput} rendered by {@code RoomLockPrompt}. As it
* requests the entry of a password, {@code TextInput} automatically correcting
* the entry of the password is a pain to deal with as a user.
*/
const _TEXT_INPUT_PROPS = {
autoCapitalize: 'none',
autoCorrect: false
};
2016-12-13 09:14:04 +00:00
/**
* The type of the React {@code Component} props of {@link RoomLockPrompt}.
2016-12-13 09:14:04 +00:00
*/
type Props = {
2016-12-13 09:14:04 +00:00
/**
* The JitsiConference which requires a password.
*/
conference: Object,
/**
* The number of digits to be used in the password.
*/
passwordNumberOfDigits: ?number,
/**
* Redux store dispatch function.
2016-12-13 09:14:04 +00:00
*/
dispatch: Dispatch<any>
};
2016-12-13 09:14:04 +00:00
/**
* Implements a React Component which prompts the user for a password to lock a
* conference/room.
*/
class RoomLockPrompt extends Component<Props> {
2016-12-13 09:14:04 +00:00
/**
* Initializes a new RoomLockPrompt instance.
*
2017-10-04 22:36:09 +00:00
* @param {Props} props - The read-only properties with which the new
2016-12-13 09:14:04 +00:00
* instance is to be initialized.
*/
2019-03-19 15:42:25 +00:00
constructor(props: Props) {
2016-12-13 09:14:04 +00:00
super(props);
2017-10-04 22:36:09 +00:00
// Bind event handlers so they are only bound once per instance.
2016-12-13 09:14:04 +00:00
this._onCancel = this._onCancel.bind(this);
this._onSubmit = this._onSubmit.bind(this);
this._validateInput = this._validateInput.bind(this);
2016-12-13 09:14:04 +00:00
}
/**
* Implements React's {@link Component#render()}.
*
* @inheritdoc
* @returns {ReactElement}
*/
render() {
let textInputProps = _TEXT_INPUT_PROPS;
if (this.props.passwordNumberOfDigits) {
textInputProps = {
...textInputProps,
keyboardType: 'number-pad',
maxLength: this.props.passwordNumberOfDigits
};
}
2016-12-13 09:14:04 +00:00
return (
<InputDialog
contentKey = 'dialog.passwordLabel'
2016-12-13 09:14:04 +00:00
onCancel = { this._onCancel }
onSubmit = { this._onSubmit }
textInputProps = { textInputProps }
validateInput = { this._validateInput } />
2016-12-13 09:14:04 +00:00
);
}
2017-10-04 22:36:09 +00:00
_onCancel: () => boolean;
2016-12-13 09:14:04 +00:00
/**
* Notifies this prompt that it has been dismissed by cancel.
*
* @private
* @returns {boolean} True to hide this dialog/prompt; otherwise, false.
2016-12-13 09:14:04 +00:00
*/
_onCancel() {
// An undefined password is understood to cancel the request to lock the
// conference/room.
return this._onSubmit(undefined);
2016-12-13 09:14:04 +00:00
}
2017-10-04 22:36:09 +00:00
_onSubmit: (?string) => boolean;
2016-12-13 09:14:04 +00:00
/**
* Notifies this prompt that it has been dismissed by submitting a specific
* value.
*
2017-10-04 22:36:09 +00:00
* @param {string|undefined} value - The submitted value.
2016-12-13 09:14:04 +00:00
* @private
* @returns {boolean} False because we do not want to hide this
* dialog/prompt as the hiding will be handled inside endRoomLockRequest
* after setting the password is resolved.
2016-12-13 09:14:04 +00:00
*/
2017-10-04 22:36:09 +00:00
_onSubmit(value: ?string) {
2016-12-13 09:14:04 +00:00
this.props.dispatch(endRoomLockRequest(this.props.conference, value));
return false; // Do not hide.
2016-12-13 09:14:04 +00:00
}
_validateInput: (string) => boolean;
/**
* Verifies input in case only digits are required.
*
* @param {string|undefined} value - The submitted value.
* @private
* @returns {boolean} False when the value is not valid and True otherwise.
*/
_validateInput(value: string) {
// we want only digits, but both number-pad and numeric add ',' and '.' as symbols
if (this.props.passwordNumberOfDigits
&& value.length > 0
&& !/^\d+$/.test(value)) {
return false;
}
return true;
}
2016-12-13 09:14:04 +00:00
}
export default connect()(RoomLockPrompt);