robcalcroft / react-native-in-app-notification

:bell: Customisable in-app notification component for React Native

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Notification background disappears couple seconds after notification

zoozalp opened this issue · comments

In the following code, white background stays in view for couple seconds after notification disappears. I've seen this in Android but not tested on iOS yet.

Is it a bug or am I missing something?

`import React from "react";
import {View, Platform, PushNotificationIOS, StyleSheet} from "react-native";
import Notification from "react-native-in-app-notification";

const defaultIcon = require("../assets/defaultImages/logo_small.png");

export class InAppNotification extends React.Component {

handleRegister = token => {
    console.log('push token', token);
};

handleNotification = notification => {
    console.log("notification", notification);
    const message = Platform.OS === "ios" ? notification._alert : notification;
    if (!message) {
        console.log("Empty message.");
    } else {
        console.log("message", message);
        if (!this.notification) {
            console.log("In app notification ref is not set yet.");
        } else {
            this.notification.show({
                icon: defaultIcon,
                title: message.title,
                message: message.body
                // onPress: () => Alert.alert('Alert', 'You clicked the notification!'),
            });
        }
    }

    // required on iOS only (see fetchCompletionHandler docs: https://facebook.github.io/react-native/docs/pushnotificationios.html)
    if (Platform.OS === "ios") {
        notification.finish(PushNotificationIOS.FetchResult.NoData);
    }
};

componentDidMount() {
    const {pushNotification: PushNotification} = this.props;
    PushNotification.onNotification(this.handleNotification);
    PushNotification.onRegister(this.handleRegister);
}

render() {
    return (
        <View style={styles.root}>
            <Notification ref={ref => {this.notification = ref;}}/>
        </View>
    )
}

}

const styles = {
root: {
position: "absolute",
top: 0,
left: 0,
right: 0,
height: 200,
elevation: 999,
zIndex: 999
}
};`