diff --git a/react/features/authentication/components/LoginDialog.native.js b/react/features/authentication/components/LoginDialog.native.js index 0cc66c008..103ec7ae8 100644 --- a/react/features/authentication/components/LoginDialog.native.js +++ b/react/features/authentication/components/LoginDialog.native.js @@ -159,15 +159,15 @@ class LoginDialog extends Component { autoCorrect = { false } onChangeText = { this._onUsernameChange } placeholder = { 'user@domain.com' } - style = { styles.loginDialogTextInput } + style = { styles.dialogTextInput } value = { this.state.username } /> - + { messageKey ? t(messageKey, messageOptions || {}) diff --git a/react/features/authentication/components/WaitForOwnerDialog.native.js b/react/features/authentication/components/WaitForOwnerDialog.native.js index 2e16ae925..3fe0c1cff 100644 --- a/react/features/authentication/components/WaitForOwnerDialog.native.js +++ b/react/features/authentication/components/WaitForOwnerDialog.native.js @@ -104,13 +104,49 @@ class WaitForOwnerDialog extends Component { * * @param {string} html - The string which may contain HTML to * render. - * @returns {string} + * @returns {ReactElement[]|string} */ _renderHTML(html) { if (typeof html === 'string') { - // TODO Limited styling may easily be provided by utilizing Text - // with style. - return html.replace(/<\/?b>/gi, ''); + // At the time of this writing, the specified HTML contains a couple + // of spaces one after the other. They do not cause a visible + // problem on Web, because the specified HTML is rendered as, well, + // HTML. However, we're not rendering HTML here. + + // eslint-disable-next-line no-param-reassign + html = html.replace(/\s{2,}/gi, ' '); + + // Render text in text in bold. + const opening = /<\s*b\s*>/gi; + const closing = /<\s*\/\s*b\s*>/gi; + let o; + let c; + let prevClosingLastIndex = 0; + const r = []; + + // eslint-disable-next-line no-cond-assign + while (o = opening.exec(html)) { + closing.lastIndex = opening.lastIndex; + + // eslint-disable-next-line no-cond-assign + if (c = closing.exec(html)) { + r.push(html.substring(prevClosingLastIndex, o.index)); + r.push( + + { html.substring(opening.lastIndex, c.index) } + ); + opening.lastIndex + = prevClosingLastIndex + = closing.lastIndex; + } else { + break; + } + } + if (prevClosingLastIndex < html.length) { + r.push(html.substring(prevClosingLastIndex)); + } + + return r; } return html; diff --git a/react/features/authentication/components/styles.js b/react/features/authentication/components/styles.js index 54b70ef64..696f7d860 100644 --- a/react/features/authentication/components/styles.js +++ b/react/features/authentication/components/styles.js @@ -19,6 +19,34 @@ const text = { * The styles of the authentication feature. */ export default createStyleSheet({ + /** + * The style of bold Text rendered by the Dialogs of the + * feature authentication. + */ + boldDialogText: { + ...text, + fontWeight: 'bold' + }, + + /** + * The style of Text rendered by the Dialogs of the + * feature authentication. + */ + dialogText: { + ...text + }, + + /** + * The style of TextInput rendered by the Dialogs of the + * feature authentication. + */ + dialogTextInput: { + // XXX Matches react-native-prompt's dialogInput because base/dialog's + // Dialog is implemented using react-native-prompt. + fontSize: 18, + height: 50 + }, + /** * The style of LoginDialog. */ @@ -28,23 +56,6 @@ export default createStyleSheet({ flexDirection: 'column' }, - /** - * The style of Text rendered by LoginDialog. - */ - loginDialogText: { - ...text - }, - - /** - * The style of TextInput rendered by LoginDialog. - */ - loginDialogTextInput: { - // XXX Matches react-native-prompt's dialogInput because base/dialog's - // Dialog is implemented using react-native-prompt. - fontSize: 18, - height: 50 - }, - /** * The style of WaitForOwnerDialog. */