Moves native password required prompt to room lock feature.

Moves native dialogs to use dialog container. Implements native Dialog that uses react native Prompt.

react/features/conference/components/Conference.native.js

@@ -6,10 +6,8 @@ import { DialogContainer } from '../../base/dialog';
 import { Container } from '../../base/react';
 import { FilmStrip } from '../../film-strip';
 import { LargeVideo } from '../../large-video';
-import { RoomLockPrompt } from '../../room-lock';
 import { Toolbar } from '../../toolbar';
 
-import PasswordRequiredPrompt from './PasswordRequiredPrompt';
 import { styles } from './styles';
 
 /**
@@ -30,23 +28,6 @@ class Conference extends Component {
      * @static
      */
     static propTypes = {
-        /**
-         * The indicator which determines whether a password is required to join
-         * the conference and has not been provided yet.
-         *
-         * @private
-         * @type {JitsiConference}
-         */
-        _passwordRequired: React.PropTypes.object,
-
-        /**
-         * The indicator which determines whether the user has requested to lock
-         * the conference/room.
-         *
-         * @private
-         * @type {JitsiConference}
-         */
-        _roomLockRequested: React.PropTypes.object,
         dispatch: React.PropTypes.func
     }
 
@@ -128,9 +109,6 @@ class Conference extends Component {
 
                 <DialogContainer />
 
-                {
-                    this._renderPrompt()
-                }
             </Container>
         );
     }
@@ -164,56 +142,6 @@ class Conference extends Component {
         this._setToolbarTimeout(toolbarVisible);
     }
 
-    /**
-     * Renders a prompt if a password is required to join the conference.
-     *
-     * @private
-     * @returns {ReactElement}
-     */
-    _renderPasswordRequiredPrompt() {
-        const required = this.props._passwordRequired;
-
-        if (required) {
-            return (
-                <PasswordRequiredPrompt conference = { required } />
-            );
-        }
-
-        return null;
-    }
-
-    /**
-     * Renders a prompt if necessary such as when a password is required to join
-     * the conference or the user has requested to lock the conference/room.
-     *
-     * @private
-     * @returns {ReactElement}
-     */
-    _renderPrompt() {
-        return (
-            this._renderPasswordRequiredPrompt()
-                || this._renderRoomLockPrompt()
-        );
-    }
-
-    /**
-     * Renders a prompt if the user has requested to lock the conference/room.
-     *
-     * @private
-     * @returns {ReactElement}
-     */
-    _renderRoomLockPrompt() {
-        const requested = this.props._roomLockRequested;
-
-        if (requested) {
-            return (
-                <RoomLockPrompt conference = { requested } />
-            );
-        }
-
-        return null;
-    }
-
     /**
      * Triggers the default toolbar timeout.
      *
@@ -231,35 +159,4 @@ class Conference extends Component {
     }
 }
 
-/**
- * Maps (parts of) the Redux state to the associated Conference's props.
- *
- * @param {Object} state - The Redux state.
- * @private
- * @returns {{
- *     _passwordRequired: boolean
- * }}
- */
-function _mapStateToProps(state) {
-    return {
-        /**
-         * The indicator which determines whether a password is required to join
-         * the conference and has not been provided yet.
-         *
-         * @private
-         * @type {JitsiConference}
-         */
-        _passwordRequired: state['features/base/conference'].passwordRequired,
-
-        /**
-         * The indicator which determines whether the user has requested to lock
-         * the conference/room.
-         *
-         * @private
-         * @type {JitsiConference}
-         */
-        _roomLockRequested: state['features/room-lock'].requested
-    };
-}
-
-export default reactReduxConnect(_mapStateToProps)(Conference);
+export default reactReduxConnect()(Conference);

react/features/room-lock/actionTypes.js

@@ -1,24 +0,0 @@
-import { Symbol } from '../base/react';
-
-/**
- * The type of Redux action which begins a (user) request to lock a specific
- * JitsiConference.
- *
- * {
- *     type: BEGIN_ROOM_LOCK_REQUEST,
- *     conference: JitsiConference
- * }
- */
-export const BEGIN_ROOM_LOCK_REQUEST = Symbol('BEGIN_ROOM_LOCK_REQUEST');
-
-/**
- * The type of Redux action which end a (user) request to lock a specific
- * JitsiConference.
- *
- * {
- *     type: END_ROOM_LOCK_REQUEST,
- *     conference: JitsiConference,
- *     password: string
- * }
- */
-export const END_ROOM_LOCK_REQUEST = Symbol('END_ROOM_LOCK_REQUEST');

react/features/room-lock/actions.js

@@ -1,8 +1,6 @@
 import { setPassword } from '../base/conference';
-import { openDialog } from '../base/dialog';
-import { PasswordRequiredPrompt } from './components';
-
-import { BEGIN_ROOM_LOCK_REQUEST, END_ROOM_LOCK_REQUEST } from './actionTypes';
+import { hideDialog, openDialog } from '../base/dialog';
+import { PasswordRequiredPrompt, RoomLockPrompt } from './components';
 
 /**
  * Begins a (user) request to lock a specific conference/room.
@@ -21,10 +19,7 @@ export function beginRoomLockRequest(conference) {
         }
 
         if (conference) {
-            dispatch({
-                type: BEGIN_ROOM_LOCK_REQUEST,
-                conference
-            });
+            dispatch(openDialog(RoomLockPrompt, { conference }));
         }
     };
 }
@@ -45,11 +40,7 @@ export function endRoomLockRequest(conference, password) {
                 ? dispatch(setPassword(conference, conference.lock, password))
                 : Promise.resolve();
         const endRoomLockRequest_ = () => {
-            dispatch({
-                type: END_ROOM_LOCK_REQUEST,
-                conference,
-                password
-            });
+            dispatch(hideDialog());
         };
 
         setPassword_.then(endRoomLockRequest_, endRoomLockRequest_);
@@ -63,7 +54,7 @@ export function endRoomLockRequest(conference, password) {
  * requesting password.
  * @protected
  * @returns {{
- *     type: BEGIN_DIALOG_REQUEST,
+ *     type: OPEN_DIALOG,
  *     component: Component,
  *     props: React.PropTypes
  * }}

react/features/room-lock/components/PasswordRequiredPrompt.native.js

@@ -1,9 +1,8 @@
 import React, { Component } from 'react';
-import Prompt from 'react-native-prompt';
 import { connect } from 'react-redux';
+import { Dialog } from '../../base/dialog';
 
 import { setPassword } from '../../base/conference';
-import { translate } from '../../base/i18n';
 
 /**
  * Implements a React Component which prompts the user when a password is
@@ -22,15 +21,7 @@ class PasswordRequiredPrompt extends Component {
          * @type {JitsiConference}
          */
         conference: React.PropTypes.object,
-        dispatch: React.PropTypes.func,
-
-        /**
-         * The function to translate human-readable text.
-         *
-         * @public
-         * @type {Function}
-         */
-        t: React.PropTypes.func
+        dispatch: React.PropTypes.func
     }
 
     /**
@@ -54,15 +45,13 @@ class PasswordRequiredPrompt extends Component {
      * @returns {ReactElement}
      */
     render() {
-        const { t } = this.props;
 
         return (
-            <Prompt
+            <Dialog
+                bodyKey = 'dialog.passwordLabel'
                 onCancel = { this._onCancel }
                 onSubmit = { this._onSubmit }
-                placeholder = { t('dialog.passwordLabel') }
-                title = { t('dialog.passwordRequired') }
-                visible = { true } />
+                titleKey = 'dialog.passwordRequired' />
         );
     }
 
@@ -70,14 +59,14 @@ class PasswordRequiredPrompt extends Component {
      * Notifies this prompt that it has been dismissed by cancel.
      *
      * @private
-     * @returns {void}
+     * @returns {boolean} whether to hide dialog.
      */
     _onCancel() {
         // XXX The user has canceled this prompt for a password so we are to
         // attempt joining the conference without a password. If the conference
         // still requires a password to join, the user will be prompted again
         // later.
-        this._onSubmit(undefined);
+        return this._onSubmit(undefined);
     }
 
     /**
@@ -86,13 +75,15 @@ class PasswordRequiredPrompt extends Component {
      *
      * @param {string} value - The submitted value.
      * @private
-     * @returns {void}
+     * @returns {boolean} whether to hide dialog.
      */
     _onSubmit(value) {
         const conference = this.props.conference;
 
         this.props.dispatch(setPassword(conference, conference.join, value));
+
+        return true;
     }
 }
 
-export default translate(connect()(PasswordRequiredPrompt));
+export default connect()(PasswordRequiredPrompt);

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

@@ -1,8 +1,6 @@
 import React, { Component } from 'react';
-import Prompt from 'react-native-prompt';
 import { connect } from 'react-redux';
-
-import { translate } from '../../base/i18n';
+import { Dialog } from '../../base/dialog';
 
 import { endRoomLockRequest } from '../actions';
 
@@ -23,15 +21,7 @@ class RoomLockPrompt extends Component {
          * @type {JitsiConference}
          */
         conference: React.PropTypes.object,
-        dispatch: React.PropTypes.func,
-
-        /**
-         * The function to translate human-readable text.
-         *
-         * @public
-         * @type {Function}
-         */
-        t: React.PropTypes.func
+        dispatch: React.PropTypes.func
     }
 
     /**
@@ -55,15 +45,13 @@ class RoomLockPrompt extends Component {
      * @returns {ReactElement}
      */
     render() {
-        const { t } = this.props;
 
         return (
-            <Prompt
+            <Dialog
+                bodyKey = 'dialog.passwordLabel'
                 onCancel = { this._onCancel }
                 onSubmit = { this._onSubmit }
-                placeholder = { t('dialog.passwordLabel') }
-                title = { t('toolbar.lock') }
-                visible = { true } />
+                titleKey = 'toolbar.lock' />
         );
     }
 
@@ -71,12 +59,12 @@ class RoomLockPrompt extends Component {
      * Notifies this prompt that it has been dismissed by cancel.
      *
      * @private
-     * @returns {void}
+     * @returns {boolean} whether to hide the dialog
      */
     _onCancel() {
         // An undefined password is understood to cancel the request to lock the
         // conference/room.
-        this._onSubmit(undefined);
+        return this._onSubmit(undefined);
     }
 
     /**
@@ -85,11 +73,16 @@ class RoomLockPrompt extends Component {
      *
      * @param {string} value - The submitted value.
      * @private
-     * @returns {void}
+     * @returns {boolean} returns false, we do not want to hide dialog as this
+     * will be handled inside endRoomLockRequest after setting password is
+     * resolved.
      */
     _onSubmit(value) {
         this.props.dispatch(endRoomLockRequest(this.props.conference, value));
+
+        // do not hide
+        return false;
     }
 }
 
-export default translate(connect()(RoomLockPrompt));
+export default connect()(RoomLockPrompt);

react/features/room-lock/index.js

@@ -2,4 +2,3 @@ export * from './actions';
 export * from './components';
 
 import './middleware';
-import './reducer';

react/features/room-lock/reducer.js

@@ -1,33 +0,0 @@
-import {
-    CONFERENCE_FAILED,
-    CONFERENCE_JOINED,
-    CONFERENCE_LEFT
-} from '../base/conference';
-import { ReducerRegistry, setStateProperty } from '../base/redux';
-
-import { BEGIN_ROOM_LOCK_REQUEST, END_ROOM_LOCK_REQUEST } from './actionTypes';
-
-ReducerRegistry.register('features/room-lock', (state = {}, action) => {
-    switch (action.type) {
-    case BEGIN_ROOM_LOCK_REQUEST:
-        return setStateProperty(state, 'requested', action.conference);
-
-    case CONFERENCE_FAILED:
-    case CONFERENCE_LEFT:
-    case END_ROOM_LOCK_REQUEST: {
-        if (state.requested === action.conference) {
-            return setStateProperty(state, 'requested', undefined);
-        }
-        break;
-    }
-
-    case CONFERENCE_JOINED: {
-        if (state.requested !== action.conference) {
-            return setStateProperty(state, 'requested', undefined);
-        }
-        break;
-    }
-    }
-
-    return state;
-});