Fully customizable internet connection listener with the built-in alert for React Native

Home Page: https://freakycoder.com

JavaScript 8.58% Starlark 1.49% Java 37.63% Ruby 3.13% Objective-C 5.88% TypeScript 13.02% Makefile 3.76% C++ 17.18% Objective-C++ 8.99% Shell 0.34%

react-native react javascript internet connection internet-connection network alert listener internet-listener

react-native-internet-connection-alert's Introduction

Installation

Add the dependency:

npm i react-native-internet-connection-alert

Peer Dependencies

IMPORTANT! You need install them

"react-native-dropdownalert": "=> 4.5.1",
"@react-native-community/netinfo": "=> 8.3.0"

Usage

Import

import InternetConnectionAlert from "react-native-internet-connection-alert";

Fundamental Usage

I strongly suggest that cover whole application with InternetConnectionAlert component it will handle itself and be able to shows the built-in alert on your whole application. Otherwise, just cover the screen where you need to use this library.

<InternetConnectionAlert
  onChange={(connectionState) => {
    console.log("Connection State: ", connectionState);
  }}
>
  {/* {... Your whole application should be here ... } */}
</InternetConnectionAlert>

Configuration - Props

Property	Type	Default	Description
onChange	function	undefined	if you need the connection state when it is changed, you can use this function
type	DropdownAlertType	error	Use some of the prepared dropdown types or if you want to use your own customization set 'custom'
title	string	Internet Connection Problem	to change the title of built-in alert
message	string	Please check your network connection	to change the message of built-in alert
useInternetReachability	boolean	false	to change the check for connection state to use internet reachability

Everything is customizable on built-in dropdownalert. Simply please look at the React Native Dropdown Alert

Future Plans

~~LICENSE~~
Write an article about the lib on Medium

Author

FreakyCoder, [email protected]

License

React Native Internet Connection Alert is available under the MIT license. See the LICENSE file for more info.

react-native-internet-connection-alert's People

Contributors

Stargazers

Watchers

Forkers

react-native-internet-connection-alert's Issues

not showing on connected but internet not reachable

this library only shows the Notification when isConnected of netinfo library is false. This has to consider the isInternetReachable attribute as well.

null is not an object (evaluating '_this.dropDownAlertRef.closeAction')

I am getting this error when I close the internet to test it and then in console log it keep pushing infinite number of this error:

Possible Unhandled Promise Rejection (id: 220):
TypeError: Network request failed

i want to disable dropdown how can i ? i use snackbar to show error

error on install

I'm getting this error while trying to install with the command npm i react-native-internet-connection-alert

Invalid tag name "=> 5.9.6": Tags may not have any characters that encodeURIComponent encodes

i've already installed dependencies. What is going on here?

Dropdown alert doesn't show on android 'RELEASE' version

Hi,
I tried to use this package on release apk version of my app and it doesn't work.
Am I missing something?

Thanks

in IOS it still stuck on top if internet back to online

this is my app.js code

 return (
    <SafeAreaProvider>
      <CustomStatusBar backgroundColor="#5CA2E2" />
    <InternetConnectionAlert
      onChange={connectionState => {
        // console.log("Connection State: ", connectionState)
      }}>
        
      <Provider store={store}>
        <NavigationContainer>
          <HomeStackNavigation />
          <Toast />
        </NavigationContainer>
      </Provider>
    </InternetConnectionAlert>
    </SafeAreaProvider>
  );

Dependencies

"react-native-internet-connection-alert": "^0.1.7",
"react-native-dropdownalert": "4.5.1",
@react-native-community/netinfo": "8.0.0",

on android above 10 version, it works fine but below 9 it stuck on top even after the internet is back to online

isInternetReachable

Can you add a check for isInternetReachable and not only isConnected?