fix(rn,styles) cleanup unused styles

react/features/authentication/components/native/LoginDialog.js

@@ -1,21 +1,15 @@
 import React, { Component } from 'react';
-import { Text } from 'react-native';
 import Dialog from 'react-native-dialog';
 import { connect as reduxConnect } from 'react-redux';
 import type { Dispatch } from 'redux';
 
-import { ColorSchemeRegistry } from '../../../base/color-scheme';
 import { toJid } from '../../../base/connection';
 import { connect } from '../../../base/connection/actions.native';
 import { _abstractMapStateToProps } from '../../../base/dialog';
 import { translate } from '../../../base/i18n';
 import { JitsiConnectionErrors } from '../../../base/lib-jitsi-meet';
-import type { StyleType } from '../../../base/styles';
 import { authenticateAndUpgradeRole, cancelLogin } from '../../actions.native';
 
-// Register styles.
-import './styles';
-
 /**
  * The type of the React {@link Component} props of {@link LoginDialog}.
  */
@@ -48,11 +42,6 @@ type Props = {
      */
     _progress: number,
 
-    /**
-     * The color-schemed stylesheet of this feature.
-     */
-    _styles: StyleType,
-
     /**
      * Redux store dispatch method.
      */
@@ -186,12 +175,10 @@ class LoginDialog extends Component<Props, State> {
             _connecting: connecting,
             _error: error,
             _progress: progress,
-            _styles: styles,
             t
         } = this.props;
 
         let messageKey;
-        let messageIsError = false;
         const messageOptions = {};
 
         if (progress && progress < 1) {
@@ -212,27 +199,17 @@ class LoginDialog extends Component<Props, State> {
                                 this.props._configHosts)
                         && credentials.password === this.state.password) {
                     messageKey = 'dialog.incorrectPassword';
-                    messageIsError = true;
                 }
             } else if (name) {
                 messageKey = 'dialog.connectErrorWithMsg';
                 messageOptions.msg = `${name} ${error.message}`;
-                messageIsError = true;
             }
         } else if (connecting) {
             messageKey = 'connection.CONNECTING';
         }
 
         if (messageKey) {
-            const message = t(messageKey, messageOptions);
+            return t(messageKey, messageOptions);
-            const messageStyles
-                = messageIsError ? styles.errorMessage : styles.progressMessage;
-
-            return (
-                <Text style = { messageStyles }>
-                    { message }
-                </Text>
-            );
         }
 
         return null;
@@ -326,8 +303,7 @@ function _mapStateToProps(state) {
         _configHosts: configHosts,
         _connecting: Boolean(connecting) || Boolean(thenableWithCancel),
         _error: connectionError || authenticateAndUpgradeRoleError,
-        _progress: progress,
+        _progress: progress
-        _styles: ColorSchemeRegistry.get(state, 'LoginDialog')
     };
 }
 

react/features/authentication/components/native/styles.js

@@ -1,41 +0,0 @@
-import { ColorSchemeRegistry, schemeColor } from '../../../base/color-scheme';
-import { BoxModel } from '../../../base/styles';
-
-/**
- * The styles of the authentication feature.
- */
-ColorSchemeRegistry.register('LoginDialog', {
-
-    /**
-     * The style of {@code Text} rendered by the {@code Dialog}s of the
-     * feature authentication.
-     */
-    dialogText: {
-        margin: BoxModel.margin,
-        marginTop: BoxModel.margin * 2
-    },
-
-    /**
-     * The style used when an error message is rendered.
-     */
-    errorMessage: {
-        color: schemeColor('errorText')
-    },
-
-    /**
-     * The style of {@code LoginDialog}.
-     */
-    loginDialog: {
-        flex: 0,
-        flexDirection: 'column',
-        marginBottom: BoxModel.margin,
-        marginTop: BoxModel.margin
-    },
-
-    /**
-     * The style used then a progress message is rendered.
-     */
-    progressMessage: {
-        color: schemeColor('text')
-    }
-});

react/features/base/color-scheme/defaultScheme.js

@@ -29,11 +29,7 @@ export default {
         inviteButtonBackground: 'rgb(0, 119, 225)',
         onVideoText: 'white'
     },
-    'Dialog': {
+    'Dialog': {},
-        border: 'rgba(0, 3, 6, 0.6)',
-        buttonBackground: ColorPalette.blue,
-        buttonLabel: ColorPalette.white
-    },
     'Header': {
         background: ColorPalette.blue,
         icon: ColorPalette.white,
@@ -41,10 +37,6 @@ export default {
         statusBarContent: ColorPalette.white,
         text: ColorPalette.white
     },
-    'Modal': {},
-    'LargeVideo': {
-        background: '#040404'
-    },
     'Toolbox': {
         button: 'rgb(255, 255, 255)',
         buttonToggled: 'rgb(38, 58, 76)',

react/features/base/dialog/components/native/styles.js

@@ -1,5 +1,3 @@
-// @flow
-
 import { StyleSheet } from 'react-native';
 
 import BaseTheme from '../../../../base/ui/components/BaseTheme.native';
@@ -266,28 +264,3 @@ ColorSchemeRegistry.register('Dialog', {
         borderTopWidth: 1
     }
 });
-
-ColorSchemeRegistry.register('SecurityDialog', {
-    /**
-     * Field on an input dialog.
-     */
-    field: {
-        borderBottomWidth: 1,
-        borderColor: schemeColor('border'),
-        color: schemeColor('text'),
-        fontSize: 14,
-        paddingBottom: 8
-    },
-
-    text: {
-        color: schemeColor('text'),
-        fontSize: 14,
-        marginTop: 8
-    },
-
-    title: {
-        color: schemeColor('text'),
-        fontSize: 18,
-        fontWeight: 'bold'
-    }
-});

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

@@ -1,15 +1,11 @@
-// @flow
-
 import React, { PureComponent } from 'react';
 import { Text, TouchableOpacity, View } from 'react-native';
 
-import { ColorSchemeRegistry } from '../../../base/color-scheme';
 import { getFeatureFlag, INVITE_ENABLED } from '../../../base/flags';
 import { translate } from '../../../base/i18n';
 import { Icon, IconAddPeople } from '../../../base/icons';
 import { getParticipantCountWithFake } from '../../../base/participants';
 import { connect } from '../../../base/redux';
-import { StyleType } from '../../../base/styles';
 import { isInBreakoutRoom } from '../../../breakout-rooms/functions';
 import { doInvitePeople } from '../../../invite/actions.native';
 
@@ -35,11 +31,6 @@ type Props = {
      */
     _isLonelyMeeting: boolean,
 
-    /**
-     * Color schemed styles of the component.
-     */
-    _styles: StyleType,
-
     /**
      * The Redux Dispatch function.
      */
@@ -76,7 +67,6 @@ class LonelyMeetingExperience extends PureComponent<Props> {
             _isInBreakoutRoom,
             _isInviteFunctionsDiabled,
             _isLonelyMeeting,
-            _styles,
             t
         } = this.props;
 
@@ -86,29 +76,18 @@ class LonelyMeetingExperience extends PureComponent<Props> {
 
         return (
             <View style = { styles.lonelyMeetingContainer }>
-                <Text
+                <Text style = { styles.lonelyMessage }>
-                    style = { [
-                        styles.lonelyMessage,
-                        _styles.lonelyMessage
-                    ] }>
                     { t('lonelyMeetingExperience.youAreAlone') }
                 </Text>
                 { !_isInviteFunctionsDiabled && !_isInBreakoutRoom && (
                     <TouchableOpacity
                         onPress = { this._onPress }
-                        style = { [
+                        style = { styles.lonelyButton }>
-                            styles.lonelyButton,
-                            _styles.lonelyButton
-                        ] }>
                         <Icon
                             size = { 24 }
                             src = { IconAddPeople }
                             style = { styles.lonelyButtonComponents } />
-                        <Text
+                        <Text style = { styles.lonelyButtonComponents }>
-                            style = { [
-                                styles.lonelyButtonComponents,
-                                _styles.lonelyMessage
-                            ] }>
                             { t('lonelyMeetingExperience.button') }
                         </Text>
                     </TouchableOpacity>
@@ -117,8 +96,6 @@ class LonelyMeetingExperience extends PureComponent<Props> {
         );
     }
 
-    _onPress: () => void;
-
     /**
      * Callback for the onPress function of the button.
      *
@@ -136,7 +113,7 @@ class LonelyMeetingExperience extends PureComponent<Props> {
  * @private
  * @returns {Props}
  */
-function _mapStateToProps(state): $Shape<Props> {
+function _mapStateToProps(state) {
     const { disableInviteFunctions } = state['features/base/config'];
     const { conference } = state['features/base/conference'];
     const flag = getFeatureFlag(state, INVITE_ENABLED, true);
@@ -145,8 +122,7 @@ function _mapStateToProps(state): $Shape<Props> {
     return {
         _isInBreakoutRoom,
         _isInviteFunctionsDiabled: !flag || disableInviteFunctions,
-        _isLonelyMeeting: conference && getParticipantCountWithFake(state) === 1,
+        _isLonelyMeeting: conference && getParticipantCountWithFake(state) === 1
-        _styles: ColorSchemeRegistry.get(state, 'Conference')
     };
 }
 

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

@@ -1,4 +1,3 @@
-import { ColorSchemeRegistry, schemeColor } from '../../../base/color-scheme';
 import { fixAndroidViewClipping } from '../../../base/styles';
 import BaseTheme from '../../../base/ui/components/BaseTheme.native';
 
@@ -81,6 +80,7 @@ export default {
 
     lonelyButton: {
         alignItems: 'center',
+        backgroundColor: BaseTheme.palette.action01,
         borderRadius: 24,
         flexDirection: 'row',
         height: BaseTheme.spacing[6],
@@ -89,6 +89,7 @@ export default {
     },
 
     lonelyButtonComponents: {
+        color: BaseTheme.palette.text01,
         marginHorizontal: 6
     },
 
@@ -99,6 +100,7 @@ export default {
     },
 
     lonelyMessage: {
+        color: BaseTheme.palette.text01,
         paddingVertical: BaseTheme.spacing[2]
     },
 
@@ -230,13 +232,3 @@ export default {
         paddingLeft: BaseTheme.spacing[2]
     }
 };
-
-ColorSchemeRegistry.register('Conference', {
-    lonelyButton: {
-        backgroundColor: schemeColor('inviteButtonBackground')
-    },
-
-    lonelyMessage: {
-        color: schemeColor('onVideoText')
-    }
-});

react/features/etherpad/components/native/SharedDocument.js

@@ -1,10 +1,7 @@
-// @flow
-
 import React, { PureComponent } from 'react';
 import { View } from 'react-native';
 import { WebView } from 'react-native-webview';
 
-import { ColorSchemeRegistry } from '../../../base/color-scheme';
 import { translate } from '../../../base/i18n';
 import { IconArrowBack } from '../../../base/icons';
 import JitsiScreen from '../../../base/modal/components/JitsiScreen';
@@ -27,11 +24,6 @@ type Props = {
      */
     _documentUrl: string,
 
-    /**
-     * Color schemed style of the header component.
-     */
-    _headerStyles: Object,
-
     /**
      * Default prop for navigation between screen components(React Navigation).
      */
@@ -97,8 +89,6 @@ class SharedDocument extends PureComponent<Props> {
         );
     }
 
-    _renderLoading: () => React$Component<any>;
-
     /**
      * Renders the loading indicator.
      *
@@ -126,8 +116,7 @@ export function _mapStateToProps(state: Object) {
     const documentUrl = getSharedDocumentUrl(state);
 
     return {
-        _documentUrl: documentUrl,
+        _documentUrl: documentUrl
-        _headerStyles: ColorSchemeRegistry.get(state, 'Header')
     };
 }
 

react/features/security/components/security-dialog/native/SecurityDialog.js

@@ -10,14 +10,12 @@ import {
 import { TouchableRipple } from 'react-native-paper';
 import type { Dispatch } from 'redux';
 
-import { ColorSchemeRegistry } from '../../../../base/color-scheme';
 import { FIELD_UNDERLINE } from '../../../../base/dialog';
 import { getFeatureFlag, MEETING_PASSWORD_ENABLED } from '../../../../base/flags';
 import { translate } from '../../../../base/i18n';
 import JitsiScreen from '../../../../base/modal/components/JitsiScreen';
 import { isLocalParticipantModerator } from '../../../../base/participants';
 import { connect } from '../../../../base/redux';
-import { StyleType } from '../../../../base/styles';
 import BaseTheme from '../../../../base/ui/components/BaseTheme';
 import { isInBreakoutRoom } from '../../../../breakout-rooms/functions';
 import { toggleLobbyMode } from '../../../../lobby/actions.any';
@@ -51,11 +49,6 @@ type Props = {
      */
     _conference: Object,
 
-    /**
-     * The color-schemed stylesheet of the feature.
-     */
-    _dialogStyles: StyleType,
-
     /**
      * Whether the local user is the moderator.
      */
@@ -529,7 +522,6 @@ function _mapStateToProps(state: Object): Object {
 
     return {
         _conference: conference,
-        _dialogStyles: ColorSchemeRegistry.get(state, 'Dialog'),
         _isModerator: isLocalParticipantModerator(state),
         _lobbyEnabled: lobbyEnabled,
         _lobbyModeSwitchVisible:

react/features/video-menu/components/native/MuteEveryoneDialog.js

@@ -1,29 +1,16 @@
-// @flow
-
 import React from 'react';
 import Dialog from 'react-native-dialog';
 import { Divider } from 'react-native-paper';
 
-import { ColorSchemeRegistry } from '../../../base/color-scheme';
 import { ConfirmDialog } from '../../../base/dialog';
 import { translate } from '../../../base/i18n';
 import { connect } from '../../../base/redux';
-import { StyleType } from '../../../base/styles';
 import AbstractMuteEveryoneDialog, {
-    abstractMapStateToProps,
+    abstractMapStateToProps as _mapStateToProps,
-    type Props as AbstractProps } from '../AbstractMuteEveryoneDialog';
+    type Props } from '../AbstractMuteEveryoneDialog';
 
 import styles from './styles';
 
-
-type Props = AbstractProps & {
-
-    /**
-     * The color-schemed stylesheet of the base/dialog feature.
-     */
-    _dialogStyles: StyleType
-}
-
 /**
  * A React Component with the contents for a dialog that asks for confirmation
  * from the user before muting all remote participants.
@@ -80,24 +67,6 @@ class MuteEveryoneDialog extends AbstractMuteEveryoneDialog<Props> {
             </ConfirmDialog>
         );
     }
-
-    _onSubmit: () => boolean;
-}
-
-/**
- * Maps part of the Redux state to the props of this component.
- *
- * @param {Object} state - The Redux state.
- * @param {Props} ownProps - The own props of the component.
- * @returns {{
-    *     _dialogStyles: StyleType
-    * }}
- */
-function _mapStateToProps(state: Object, ownProps: Props) {
-    return {
-        ...abstractMapStateToProps(state, ownProps),
-        _dialogStyles: ColorSchemeRegistry.get(state, 'Dialog')
-    };
 }
 
 export default translate(connect(_mapStateToProps)(MuteEveryoneDialog));

react/features/video-menu/components/native/MuteEveryonesVideoDialog.js

@@ -1,28 +1,16 @@
-// @flow
-
 import React from 'react';
 import Dialog from 'react-native-dialog';
 import { Divider } from 'react-native-paper';
 
-import { ColorSchemeRegistry } from '../../../base/color-scheme';
 import { ConfirmDialog } from '../../../base/dialog';
 import { translate } from '../../../base/i18n';
 import { connect } from '../../../base/redux';
-import { StyleType } from '../../../base/styles';
 import AbstractMuteEveryonesVideoDialog, {
-    abstractMapStateToProps,
+    abstractMapStateToProps as _mapStateToProps,
-    type Props as AbstractProps } from '../AbstractMuteEveryonesVideoDialog';
+    type Props } from '../AbstractMuteEveryonesVideoDialog';
 
 import styles from './styles';
 
-type Props = AbstractProps & {
-
-    /**
-     * The color-schemed stylesheet of the base/dialog feature.
-     */
-    _dialogStyles: StyleType
-}
-
 /**
  * A React Component with the contents for a dialog that asks for confirmation
  * from the user before muting all remote participants.
@@ -79,24 +67,6 @@ class MuteEveryonesVideoDialog extends AbstractMuteEveryonesVideoDialog<Props> {
             </ConfirmDialog>
         );
     }
-
-    _onSubmit: () => boolean;
-}
-
-/**
- * Maps part of the Redux state to the props of this component.
- *
- * @param {Object} state - The Redux state.
- * @param {Props} ownProps - The own props of the component.
- * @returns {{
-    *     _dialogStyles: StyleType
-    * }}
- */
-function _mapStateToProps(state: Object, ownProps: Props) {
-    return {
-        ...abstractMapStateToProps(state, ownProps),
-        _dialogStyles: ColorSchemeRegistry.get(state, 'Dialog')
-    };
 }
 
 export default translate(connect(_mapStateToProps)(MuteEveryonesVideoDialog));