[RN] Remove mobile notifications

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

@@ -11,21 +11,18 @@ import { connect, disconnect } from '../../base/connection';
 import { getParticipantCount } from '../../base/participants';
 import { Container, LoadingIndicator, TintedView } from '../../base/react';
 import {
-    isNarrowAspectRatio,
     makeAspectRatioAware
 } from '../../base/responsive-ui';
 import { TestConnectionInfo } from '../../base/testing';
 import { createDesiredLocalTracks } from '../../base/tracks';
 import { ConferenceNotification } from '../../calendar-sync';
 import {
-    FILMSTRIP_SIZE,
     Filmstrip,
     isFilmstripVisible,
     TileView
 } from '../../filmstrip';
 import { LargeVideo } from '../../large-video';
 import { CalleeInfoContainer } from '../../invite';
-import { NotificationsContainer } from '../../notifications';
 import { Captions } from '../../subtitles';
 import { setToolboxVisible, Toolbox } from '../../toolbox';
 import { shouldDisplayTileView } from '../../video-layout';
@@ -305,12 +302,6 @@ class Conference extends Component<Props> {
                 <View
                     pointerEvents = 'box-none'
                     style = { styles.toolboxAndFilmstripContainer }>
-                    {/*
-                      * Notifications are rendered on the very top of other
-                      * components like subtitles, toolbox and filmstrip.
-                      */
-                        this._renderNotificationsContainer()
-                    }
 
                     <Captions onPress = { this._onClick } />
 
@@ -336,6 +327,7 @@ class Conference extends Component<Props> {
                 {
                     this._renderConferenceNotification()
                 }
+
             </Container>
         );
     }
@@ -386,33 +378,6 @@ class Conference extends Component<Props> {
                 ? <ConferenceNotification />
                 : undefined);
     }
-
-    /**
-     * Renders a container for notifications to be displayed by the
-     * base/notifications feature.
-     *
-     * @private
-     * @returns {React$Element}
-     */
-    _renderNotificationsContainer() {
-        const notificationsStyle = {};
-
-        // In the landscape mode (wide) there's problem with notifications being
-        // shadowed by the filmstrip rendered on the right. This makes the "x"
-        // button not clickable. In order to avoid that a margin of the
-        // filmstrip's size is added to the right.
-        //
-        // Pawel: after many attempts I failed to make notifications adjust to
-        // their contents width because of column and rows being used in the
-        // flex layout. The only option that seemed to limit the notification's
-        // size was explicit 'width' value which is not better than the margin
-        // added here.
-        if (this.props._filmstripVisible && !isNarrowAspectRatio(this)) {
-            notificationsStyle.marginRight = FILMSTRIP_SIZE;
-        }
-
-        return <NotificationsContainer style = { notificationsStyle } />;
-    }
 }
 
 /**

react/features/notifications/components/Notification.native.js

@@ -1,106 +0,0 @@
-// @flow
-
-import React from 'react';
-import { Text, TouchableOpacity, View } from 'react-native';
-
-import { Icon } from '../../base/font-icons';
-import { translate } from '../../base/i18n';
-
-import { NOTIFICATION_TYPE } from '../constants';
-
-import AbstractNotification, {
-    type Props
-} from './AbstractNotification';
-import styles from './styles';
-
-/**
- * Implements a React {@link Component} to display a notification.
- *
- * @extends Component
- */
-class Notification extends AbstractNotification<Props> {
-    /**
-     * Implements React's {@link Component#render()}.
-     *
-     * @inheritdoc
-     * @returns {ReactElement}
-     */
-    render() {
-        const {
-            appearance,
-            isDismissAllowed,
-            t,
-            title,
-            titleArguments,
-            titleKey
-        } = this.props;
-
-        let notificationStyle;
-
-        switch (appearance) {
-        case NOTIFICATION_TYPE.ERROR:
-            notificationStyle = styles.notificationTypeError;
-            break;
-        case NOTIFICATION_TYPE.NORMAL:
-            notificationStyle = styles.notificationTypeNormal;
-            break;
-        case NOTIFICATION_TYPE.SUCCESS:
-            notificationStyle = styles.notificationTypeSuccess;
-            break;
-        case NOTIFICATION_TYPE.WARNING:
-            notificationStyle = styles.notificationTypeWarning;
-            break;
-        case NOTIFICATION_TYPE.INFO:
-        default:
-            notificationStyle = styles.notificationTypeInfo;
-        }
-
-        return (
-            <View
-                pointerEvents = 'box-none'
-                style = { [
-                    styles.notification,
-                    notificationStyle
-                ] }>
-                <View style = { styles.contentColumn }>
-                    <View
-                        pointerEvents = 'box-none'
-                        style = { styles.notificationTitle }>
-                        <Text style = { styles.titleText }>
-                            {
-                                title || t(titleKey, titleArguments)
-                            }
-                        </Text>
-                    </View>
-                    <View
-                        pointerEvents = 'box-none'
-                        style = { styles.notificationContent }>
-                        {
-                            this._getDescription().map((line, index) => (
-                                <Text
-                                    key = { index }
-                                    style = { styles.contentText }>
-                                    { line }
-                                </Text>
-                            ))
-                        }
-                    </View>
-                </View>
-                {
-                    isDismissAllowed
-                    && <TouchableOpacity onPress = { this._onDismissed }>
-                        <Icon
-                            name = { 'close' }
-                            style = { styles.dismissIcon } />
-                    </TouchableOpacity>
-                }
-            </View>
-        );
-    }
-
-    _getDescription: () => Array<string>;
-
-    _onDismissed: () => void;
-}
-
-export default translate(Notification);

react/features/notifications/components/NotificationsContainer.native.js

@@ -1,68 +0,0 @@
-// @flow
-
-import React from 'react';
-import { View } from 'react-native';
-import { connect } from 'react-redux';
-
-import AbstractNotificationsContainer, {
-    _abstractMapStateToProps,
-    type Props as AbstractProps
-} from './AbstractNotificationsContainer';
-import Notification from './Notification';
-import styles from './styles';
-
-type Props = AbstractProps & {
-
-    /**
-     * Any custom styling applied to the notifications container.
-     */
-    style: Object
-};
-
-/**
- * Implements a React {@link Component} which displays notifications and handles
- * automatic dismissmal after a notification is shown for a defined timeout
- * period.
- *
- * @extends {Component}
- */
-class NotificationsContainer
-    extends AbstractNotificationsContainer<Props> {
-
-    /**
-     * Implements React's {@link Component#render()}.
-     *
-     * @inheritdoc
-     * @returns {ReactElement}
-     */
-    render() {
-        const { _notifications } = this.props;
-
-        if (!_notifications || !_notifications.length) {
-            return null;
-        }
-
-        return (
-            <View
-                pointerEvents = 'box-none'
-                style = { [
-                    styles.notificationContainer,
-                    this.props.style
-                ] } >
-                {
-                    _notifications.map(
-                        ({ props, uid }) => (
-                            <Notification
-                                { ...props }
-                                key = { uid }
-                                onDismissed = { this._onDismissed }
-                                uid = { uid } />))
-                }
-            </View>
-        );
-    }
-
-    _onDismissed: number => void;
-}
-
-export default connect(_abstractMapStateToProps)(NotificationsContainer);

react/features/notifications/components/styles.js

@@ -1,104 +0,0 @@
-// @flow
-
-import { BoxModel, createStyleSheet, ColorPalette } from '../../base/styles';
-
-/**
- * The styles of the React {@code Components} of the feature notifications.
- */
-export default createStyleSheet({
-
-    /**
-     * The content (left) column of the notification.
-     */
-    contentColumn: {
-        flex: 1,
-        flexDirection: 'column',
-        padding: BoxModel.padding
-    },
-
-    /**
-     * Test style of the notification.
-     */
-    contentText: {
-        color: ColorPalette.white
-    },
-
-    /**
-     * Dismiss icon style.
-     */
-    dismissIcon: {
-        alignSelf: 'center',
-        color: ColorPalette.white,
-        fontSize: 16,
-        padding: 1.5 * BoxModel.padding
-    },
-
-    /**
-     * Outermost view of a single notification.
-     */
-    notification: {
-        borderRadius: 5,
-        flexDirection: 'row',
-        marginTop: 0.5 * BoxModel.margin
-    },
-
-    /**
-     * Outermost container of a list of notifications.
-     */
-    notificationContainer: {
-        flexGrow: 0,
-        justifyContent: 'flex-end',
-        padding: 2 * BoxModel.padding,
-        paddingBottom: BoxModel.padding
-    },
-
-    /**
-     * Wrapper for the message (without title).
-     */
-    notificationContent: {
-        flexDirection: 'column',
-        paddingVertical: 0.5 * BoxModel.padding
-    },
-
-    /**
-     * The View containing the title.
-     */
-    notificationTitle: {
-        paddingVertical: 0.5 * BoxModel.padding
-    },
-
-    /**
-     * Background settings for different notification types.
-     */
-
-    notificationTypeError: {
-        backgroundColor: ColorPalette.R400
-    },
-
-    notificationTypeInfo: {
-        backgroundColor: ColorPalette.N500
-    },
-
-    notificationTypeNormal: {
-        // NOTE: Mobile has black background when the large video doesn't render
-        // a stream, so we avoid using black as the background of the normal
-        // type notifications.
-        backgroundColor: ColorPalette.N500
-    },
-
-    notificationTypeSuccess: {
-        backgroundColor: ColorPalette.G400
-    },
-
-    notificationTypeWarning: {
-        backgroundColor: ColorPalette.Y200
-    },
-
-    /**
-     * Title text style.
-     */
-    titleText: {
-        color: ColorPalette.white,
-        fontWeight: 'bold'
-    }
-});