Build an Expense Manager App with React Native – Part 6

Add connection status Banner

We are going to use the AppStateRootSaga we setup previously to show a banner to the user to indicate when he is online or not.

Use the following Banner Component (credits:

First map the offline.isConnected property in the MainScreen :

Now on each state update, check the connectivity value:

Include the NetworkStatusBanner: