Add an Offline component

📱 Works only on a smartphone.

📡 What you will learn

• Add offline feedback message
• Use an advanced React Pattern: Context API

👾 Before we start the exercise

• We are going to install and use react-native-offline
• Have a look at react-native-offline documentation

👨‍🚀 Exercise 3

• Install the library

npm install react-native-offline

• Update the entry point of your application to add a new provider

import { NetworkProvider } from 'react-native-offline';

NetworkProvider will injects the network state to children components via React Context.

• Create a new file ScreenContainer.tsx and paste this component
• Create a new file Offline.tsx and and paste this component
• On Offline.tsx display a message when the user is not connected

🔭 Hint: Use !isConnected to check if the feature works when you are online.