Is it possible to push the rewrite to npm registry?

This warning is poping up in the console every time and it is coming from src/DefaultNotificationBody/index.ios.js. On line 14 the code should be changed from:

top: isIphoneX() && getStatusBarHeight(),

to

top: isIphoneX() ? getStatusBarHeight() : 0,

Hi, can you please show me an example of using react-native-in-app-notification with react-redux.

On your docs says:

export default withInAppNotification(MyApp);

But i need to use it on my Routes file (so i can routing on notification onPress event), i am using react-native-router-flux, so right now i have this on my Routes file:

export default connect(mapStateToProps)(Routes);

I think i can't consume the showNotification prop on that file.

Maybe if i use this approach can i make it?:

https://gist.github.com/testshallpass/d76c656874e417bef4e0e6a63fc492af

So not using the context and use the static class helper.

What do you think guys.

Thanks.

I have problem when I'm implemented this with hooks

Got any ideas on how i can pass additional props to showNotification function, in order to be able to customise the appearance, depending on the notification type. For example, i want to show green background for success notifications, and red for error etc.

Problem

if i call the notification two or more times consecutively it renders just the first one. If i use a timeout for the second one i get a good behaviour.

Proposal

I'm thinking implement a delayed queue in order to show consecutive calls in a queued way and show them one by one with a timeout. Do you accept a pull request for this?

1. onPress is not at the outmost layer that overwrites onClose
2. Could be more clear that onClose is a predefined function, not a default value that you can pass into the custom component props.

  <TouchableHighlight
    style={defaultStyles.root}
    activeOpacity={0.3}
    underlayColor="transparent"
  >
    <View style={[defaultStyles.container, { paddingBottom: title && message ? 10 : 0 }]}>
      <TouchableHighlight
        style={defaultStyles.root}
        activeOpacity={0.3}
        underlayColor="transparent"
        onPress={() => {
          onPress()
          onClose()
        }}
      >
        <View>
          {title ? <Text style={[defaultStyles.text, defaultStyles.bold]}>{title}</Text> : null}
          {message ? <Text style={defaultStyles.text}>{message}</Text> : null}
        </View>
      </TouchableHighlight>
      <View>
        <TouchableHighlight activeOpacity={0.3} underlayColor="transparent" onPress={onClose}>
          <Text>Close</Text>
        </TouchableHighlight>
      </View>
    </View>
  </TouchableHighlight>

The height needs to be explicity set to a particular value (including the default 80 unit value). Is there any way to set it to auto so that it's height is determined by text inside.

🚨 You need to enable Continuous Integration on Greenkeeper branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please click the 'fix repo' button on account.greenkeeper.io.

Hey there,

I am trying to pass an icon through but cant get it to display, here is a snippet of my code:

{this.notification && this.notification.show({
title: 'Notification (Tap to close)',
message: 'Hello World',
icon: 'http://www.icon100.com/up/3708/128/630.png',
onPress: () => this.notification.closeNotification()
})}

What am I doing wrong?

    this.props.showNotification({
        title: "test",
        message: "test",
        icon: "test-icon",
        vibrate: false,
        notificationBodyComponent: <CustomComponent/>,
    }); 

apparently doing nothing for me.

It shows black background notification..

Am I using this library wrong?

Hi,
firstly, this lib is awesome eh. Great job!
this is not a issue per say,

I'd like to understand how can I use background props. How can I customize the notification. I couldn't find any tutorial or documentation.

like above image, part of notification is still visible.

Hi, thanks for the awesome module. My requirement is, In my app i'm using chat functionality i need to show the notification type messages by calling this.props.showNotification() once in single screen and need to get notification message in anywhere in the Application. Can you please suggest me how to fix it.

Unable to disable the vibration with vibrate=false.

For me it looks like it's becuase this guard is always true due to prevProps.vibrate always being true.

Modifying the guard to the following seems to be working as intended:
if (this.props.vibrate && this.props.isOpen && !prevProps.isOpen) {...}

I need a custom sound to play on the notification. How can i enable that?

A standard iOS status bar is 20px in height, so most apps have a 20px top spacer to compensate.

When the iOS in-call status is active, the status bar is effectively 40px in height, but iOS just shrinks the entire viewport to make room for the additional 20px. So the application doesn't have to, for example, increase its padding to 40px.

When react-native-in-app-notification hides the status bar for a few seconds while showing an alert, the shrunken viewport expands by 20px back to its default.

This causes the entire layout to shift when a notification is received, and then shift back when it disappears. This only occurs when the in-call status is active.

Tried to use closeInterval property but not working and changing default in source also makes no change.

This is not a issue per say but how can i add image to shownotifcation.
i have the follow code below however the image is not showing
this.props.showNotification({
title: 'Update Received!',
message: data.message,
onPress: () => this.props.navigation.navigate('update',{messagedata:data.message}),
icon: <Image source={{uri:'ttps://facebook.github.io/react-native/docs/assets/favicon.png'}} />
});

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
}
};`

Hi,

When i wrap my application with the Provider, i have a notification showed by default.
This is due to the default props of the DefaultNotificationBody:

DefaultNotificationBody.defaultProps = {
  title: 'Notification',
  message: 'This is a test notification',
  vibrate: true,
  isOpen: false,
  iconApp: null,
  icon: null,
  onPress: () => null,
  onClose: () => null,
};

Has to be:

DefaultNotificationBody.defaultProps = {
  title: null,
  message: null,
  vibrate: true,
  isOpen: false,
  iconApp: null,
  icon: null,
  onPress: () => null,
  onClose: () => null,
};

This is happening with expo and android. But visibly same problem with ios.

Thx.

Hi, is there a way to set "useNativeDriver" on notification animation, thanks.

My apologies for not having found my answer but how do you close the notification ?
Thank you very much for the great work, and thank you in advance for any help here :)

I get this error:

when calling showNotification. Is vibration duration parameter missing? It works on android.