fix(rn,styles) cleanup unused styles

This commit is contained in:
Saúl Ibarra Corretgé 2022-06-20 23:09:13 +02:00 committed by Saúl Ibarra Corretgé
parent b428ce2dcd
commit d61fe58fcf
10 changed files with 16 additions and 228 deletions

View File

@ -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);
const messageStyles
= messageIsError ? styles.errorMessage : styles.progressMessage;
return (
<Text style = { messageStyles }>
{ message }
</Text>
);
return t(messageKey, messageOptions);
}
return null;
@ -326,8 +303,7 @@ function _mapStateToProps(state) {
_configHosts: configHosts,
_connecting: Boolean(connecting) || Boolean(thenableWithCancel),
_error: connectionError || authenticateAndUpgradeRoleError,
_progress: progress,
_styles: ColorSchemeRegistry.get(state, 'LoginDialog')
_progress: progress
};
}

View File

@ -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')
}
});

View File

@ -29,11 +29,7 @@ export default {
inviteButtonBackground: 'rgb(0, 119, 225)',
onVideoText: 'white'
},
'Dialog': {
border: 'rgba(0, 3, 6, 0.6)',
buttonBackground: ColorPalette.blue,
buttonLabel: ColorPalette.white
},
'Dialog': {},
'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)',

View File

@ -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'
}
});

View File

@ -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
style = { [
styles.lonelyMessage,
_styles.lonelyMessage
] }>
<Text style = { styles.lonelyMessage }>
{ t('lonelyMeetingExperience.youAreAlone') }
</Text>
{ !_isInviteFunctionsDiabled && !_isInBreakoutRoom && (
<TouchableOpacity
onPress = { this._onPress }
style = { [
styles.lonelyButton,
_styles.lonelyButton
] }>
style = { styles.lonelyButton }>
<Icon
size = { 24 }
src = { IconAddPeople }
style = { styles.lonelyButtonComponents } />
<Text
style = { [
styles.lonelyButtonComponents,
_styles.lonelyMessage
] }>
<Text style = { styles.lonelyButtonComponents }>
{ 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,
_styles: ColorSchemeRegistry.get(state, 'Conference')
_isLonelyMeeting: conference && getParticipantCountWithFake(state) === 1
};
}

View File

@ -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')
}
});

View File

@ -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,
_headerStyles: ColorSchemeRegistry.get(state, 'Header')
_documentUrl: documentUrl
};
}

View File

@ -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:

View File

@ -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,
type Props as AbstractProps } from '../AbstractMuteEveryoneDialog';
abstractMapStateToProps as _mapStateToProps,
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));

View File

@ -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,
type Props as AbstractProps } from '../AbstractMuteEveryonesVideoDialog';
abstractMapStateToProps as _mapStateToProps,
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));