• Luke Schoen's avatar
    fix: Add connected-offline state. Wrap individual components with RequireHealthOverlay · f7e110be
    Luke Schoen authored
    Summary of actions performed:
    
    * App.js routes
    	* AccountsList
    		* New functionality - `<RequireHealthOverlay require='connected-offline'>`
    			* Note: we need to be connected even for the AccountsList page since most accounts actually come from parity-ethereum (as pointed out by @amaurymartiny). New functionality (@amaurymartiny proposal) uses additional 'connected-offline' state so if we are connected to the node but not to the internet we can show the AccountsList page
    	* Accounts (token list page)
    		* Retain existing functionality - `<RequireHealthOverlay require='sync'>`
    	* Create Account / Import Account
    		* New functionality - `<RequireHealthOverlay require='connected-offline'>`
    	* Backup Account
    		* New functionality - `<RequireHealthOverlay require='connected-offline'>`
    	* Onboarding
    		* New functionality - no overlay since not wrapping App.js
    	* Search tokens (Whitelist)
    		* Retain existing functionality - `<RequireHealthOverlay require='sync'>`
    * Send.js routes
    	* TxForm, Unlock, TxQrCode, ScanSignedTx, SignedTxSummary
    		* Retain existing functionality - `<RequireHealthOverlay require='sync'>`
    	* Sent
    		* Retain existing functionality by wrapping the individual component instead of App.js with: `<RequireHealthOverlay require='connected' fullscreen>`
    
    * Note: `RequireHealthOverlay` has two states:
    		* `require='connected-offline` no alert/overlay when user connected to a local node but not connected to the internet
    		* `require='connected'` shows full screen alert when the user is not connected to the node and and not connected to the internet
    		* `require='sync'` shows when the user is not sync
    * Note: Only the Sent component has a fullscreen overlay
    * Note: This wraps everything related to eth/token/balance/transfer with `require='sync'`
    * Note: We are not wrapping App.js anymore since when using both `<RequireHealthOverlay require='connected' fullscreen>` in addition to wrapping other components such as Accounts.js with `<RequireHealthOverlay require='connected-offline'>` doesn't allow it. Instead just wrap individual components
    f7e110be