import Button from '@atlaskit/button'; import { FieldTextStateless as TextField } from '@atlaskit/field-text'; import PropTypes from 'prop-types'; import React, { Component } from 'react'; import { connect } from 'react-redux'; import { setPassword } from '../../base/conference'; import { translate } from '../../base/i18n'; /** * A React {@code Component} for locking a JitsiConference with a password. */ class AddPasswordForm extends Component { /** * {@code AddPasswordForm}'s property types. * * @static */ static propTypes = { /** * The JitsiConference on which to lock and set a password. * * @type {JitsiConference} */ conference: PropTypes.object, /** * Invoked to set a password on the conference. */ dispatch: PropTypes.func, /** * Invoked to obtain translated strings. */ t: PropTypes.func }; /** * Initializes a new {@code AddPasswordForm} instance. * * @param {Object} props - The read-only properties with which the new * instance is to be initialized. */ constructor(props) { super(props); this.state = { /** * The current value to display in {@code AddPasswordForm} * component's input field. The value is also used as the desired * new password when creating a {@code setPassword} action. * * @type {string} */ password: '' }; /** * The internal reference to the React {@code component} for entering a * password. * * @private * @type {ReactComponent} */ this._inputComponent = null; // Bind event handlers so they are only bound once for every instance. this._onKeyDown = this._onKeyDown.bind(this); this._onPasswordChange = this._onPasswordChange.bind(this); this._onSubmit = this._onSubmit.bind(this); this._setInput = this._setInput.bind(this); } /** * Directly bind a handler to the input element. This is done in order to * intercept enter presses so any outer forms do not become submitted. * Atlaskit Button does not expose a way to hook onto keydown events. * * @inheritdoc */ componentDidMount() { this._inputComponent.input.onkeydown = this._onKeyDown; } /** * Remove any handlers set directly on DOM elements. * * @inheritdoc */ componentWillUnmount() { this._inputComponent.input.onkeydown = null; } /** * Implements React's {@link Component#render()}. * * @inheritdoc * @returns {ReactElement} */ render() { const { t } = this.props; return (