https://github.com/wrathchaos/react-native-internet-connection-alert

Fully customizable internet connection listener with the built-in alert for React Native
https://github.com/wrathchaos/react-native-internet-connection-alert

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

Last synced: 9 days ago
JSON representation

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

• Host: GitHub
• URL: https://github.com/wrathchaos/react-native-internet-connection-alert
• Owner: WrathChaos
• Created: 2020-08-24T09:23:50.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-04-16T20:15:33.000Z (over 1 year ago)
• Last Synced: 2024-12-09T18:11:33.918Z (18 days ago)
• Topics: alert, connection, internet, internet-connection, internet-listener, javascript, listener, network, react, react-native
• Language: Java
• Homepage: https://freakycoder.com
• Size: 26.9 MB
• Stars: 80
• Watchers: 4
• Forks: 13
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


[![Battle Tested ✅](https://img.shields.io/badge/-Battle--Tested%20%E2%9C%85-03666e?style=for-the-badge)](https://github.com/WrathChaos/react-native-internet-connection-alert)

[![Fully customizable internet connection connection with built-in alert for React Native](https://img.shields.io/badge/-Fully%20customizable%20internet%20connection%20connection%20with%20built--in%20alert%20for%20React%20Native-orange?style=for-the-badge)](https://github.com/WrathChaos/react-native-internet-connection-alert)

[![npm version](https://img.shields.io/npm/v/react-native-internet-connection-alert.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-internet-connection-alert)

[![npm](https://img.shields.io/npm/dt/react-native-internet-connection-alert.svg?style=for-the-badge)](https://www.npmjs.com/package/react-native-internet-connection-alert)

![Platform - Android and iOS](https://img.shields.io/badge/platform-Android%20%7C%20iOS-blue.svg?style=for-the-badge)

[![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=for-the-badge)](https://opensource.org/licenses/MIT)

[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg?style=for-the-badge)](https://github.com/prettier/prettier)



  





  

  



# Installation

Add the dependency:

```bash

npm i react-native-internet-connection-alert

```

## Peer Dependencies

IMPORTANT! You need install them


```js

"react-native-dropdownalert": "=> 4.5.1",

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

```

# Usage

## Import

```jsx

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

```

## Fundamental Usage

I **strongly suggest** that cover **whole applicatio**n 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.

```jsx

 {

    console.log("Connection State: ", connectionState);

  }}

>

  {/* {... Your whole application should be here ... } */}

```

# 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](https://github.com/testshallpass/react-native-dropdownalert)

## Future Plans

- [x] ~~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.