When you have no connectivity then you popup message saying,
You are now offline and we will show this
for long duration
and then we'll break.
That's what we will display on the screen.
Now of course we can act on this if you wish to,
when there is a change you can act to turn off certain things and respond appropriately.
But right now in this exercise,
I'm just simply displaying
a toast message on the screen just to indicate that something has changed.
For the WiFi you'll say "You are now connected to WiFi."
Then for cellular we can say,
" You are now connected to cellular" and then you are
now so here you'll say "You now
have an unknown connection."
We are unable to determine what it is so we'll just say "you have
an unknown connection" and that's about it.
Let's save the changes and then go and see how this responds.
Let me restart my application.
When my application restarts you will see in initial pop up on the screen,
with the initial network connectivity that is shown right at the bottom there.
Let me now disconnect my Wifi connection and see what happens.
I have disconnected my Wifi connection and immediately you saw
a toast message there saying you are now offline.
Let me reconnect to my WiFi and
then the moment I get connected you can see the toast message right there saying,
you are now connected to WiFi.
One more time. Let me turn off my Wi-Fi connection.
Then you immediately saw the popup message there.
Then turn the WiFi connection on and then as soon as they get
connected you see the toast message there saying you're not connected to WiFi.
One more time. The moment I go offline it pops up saying,
you are now offline and then the moment I get reconnected,
it pops a toast message saying you are now connected to WiFi and so on.
So that's how the network connectivity information can be
checked using the NetInfo API from React Native.
With this we complete this exercise.
This is a good time for you to do a git commit with the message "Network Info".