fix(presence-label):styles

css/_videolayout_default.scss

@@ -627,7 +627,6 @@
     padding-left: 10px;
     padding-right: 10px;
 }
-#remotePresenceMessage .no-presence,
 #remoteConnectionMessage {
     display: none;
 }

modules/UI/videolayout/LargeVideoManager.js

@@ -429,11 +429,8 @@ export default class LargeVideoManager {
                 <Provider store = { APP.store }>
                     <I18nextProvider i18n = { i18next }>
                         <PresenceLabel
-                            noContentStyles = { {
-                                className: 'presence-label no-presence'
-                            } }
                             participantID = { id }
-                            styles = { { className: 'presence-label' } } />
+                            className = 'presence-label' />
                     </I18nextProvider>
                 </Provider>,
                 presenceLabelContainer.get(0));

modules/UI/videolayout/RemoteVideo.js

@@ -574,11 +574,8 @@ RemoteVideo.prototype.addPresenceLabel = function() {
             <Provider store = { APP.store }>
                 <I18nextProvider i18n = { i18next }>
                     <PresenceLabel
-                        noContentStyles = { {
-                            className: 'presence-label no-presence'
-                        } }
                         participantID = { this.id }
-                        styles = { { className: 'presence-label' } } />
+                        className = 'presence-label' />
                 </I18nextProvider>
             </Provider>,
             presenceLabelContainer);

react/features/invite/components/callee-info/CalleeInfo.js

@@ -64,7 +64,7 @@ class CalleeInfo extends Component<Props> {
                     <Container { ...this._style('ringing__status') }>
                         <PresenceLabel
                             defaultPresence = { status }
-                            styles = { this._style('ringing__text') } />
+                            { ...this._style('ringing__text') } />
                     </Container>
                     <Container { ...this._style('ringing__name') }>
                         <Text

react/features/presence-status/components/PresenceLabel.js

@@ -36,17 +36,17 @@ class PresenceLabel extends Component {
          */
         _presence: PropTypes.string,
 
+        /**
+         * Class name for the presence label.
+         */
+        className: PropTypes.string,
+
         /**
          * Default presence status that will be displayed if user's presence
          * status is not available.
          */
         defaultPresence: PropTypes.string,
 
-        /**
-         * Styles for the case where there isn't any content to be shown.
-         */
-        noContentStyles: PropTypes.object,
-
         /**
          * The ID of the participant whose presence status shoul display.
          */
@@ -55,7 +55,7 @@ class PresenceLabel extends Component {
         /**
          * Styles for the presence label.
          */
-        styles: PropTypes.object,
+        style: PropTypes.object,
 
         /**
          * Invoked to obtain translated strings.
@@ -70,14 +70,20 @@ class PresenceLabel extends Component {
      * @returns {ReactElement}
      */
     render() {
-        const { _presence, styles, noContentStyles } = this.props;
-        const combinedStyles = _presence ? styles : noContentStyles;
+        const text = this._getPresenceText();
+
+        if (text === null) {
+            return null;
+        }
+
+        const { style, className } = this.props;
 
         return (
-            <Text { ...combinedStyles }>
-                { this._getPresenceText() }
-            </Text>
-        );
+            <Text
+                className = { className }
+                { ...style }>
+                { text }
+            </Text>);
     }
 
     /**