Connections
Indicate availability of viable connections, along with a hint-refresh button and disconnection controls.
![Screenshot of component Connections basic](/static/0d4c8d0fd35e4de93e8990a9f1c395c8/Connections-basic-desktop.png)
Usage
<Connections preConnect={deviceID => navigate(`/device_loading/${deviceID}`)} postHandshake={deviceID => navigate(`/devices/${deviceID}`)} onFailure={(deviceID, err) => { console.log('Connections component got error', err, deviceID) navigate(`/`) }}/>
Customisation
No device text
When no viable connections are found, default text is displayed.
The default is "No devices found". Override the text by passing a string into noDevicesText
.
![Screenshot of component Connections no-device-default](/static/75ae76717d992788ec9d0bd5549e5c9c/Connections-no-device-default-desktop.png)
![Screenshot of component Connections no-device-override](/static/75ae76717d992788ec9d0bd5549e5c9c/Connections-no-device-override-desktop.png)
<Connections noDevicesText="Can't find hardware... Check under the couch?"/>
Layout information
Customise the contents and layout of the card with internalCardComponent
.
![Screenshot of component Connections basic-h3](/static/227537a7c351266726f018b57fdba259/Connections-basic-h3-desktop.png)
<Connections preConnect={deviceID => navigate(`/device_loading/${deviceID}`)} postHandshake={deviceID => navigate(`/devices/${deviceID}`)} onFailure={(deviceID, err) => { console.log('Connections component got error', err, deviceID) navigate(`/`) internalCardComponent={<h3>A Device!</h3>} }}/>