Working login on mobile

mobile/src/ui/BoundSwitch.js

@@ -0,0 +1,55 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import { View, Switch, Text } from 'react-native'
+import { reactAutoBind } from 'auto-bind2'
+
+export class BoundSwitch extends React.Component {
+  static propTypes = {
+    name: PropTypes.string.isRequired,
+    label: PropTypes.string,
+    binder: PropTypes.object.isRequired,
+  }
+
+  constructor(props) {
+    super(props)
+    reactAutoBind(this)
+    this.state = props.binder.getFieldState(props.name)
+  }
+
+  handleValueChange() {
+    const { binder, name } = this.props
+    const state = binder.getFieldState(name)
+
+    if (!state.readOnly && !state.disabled) {
+      this.setState(binder.updateFieldValue(name, !state.value))
+    }
+  }
+
+  componentWillReceiveProps(nextProps) {
+    if (nextProps.binder !== this.props.binder) {
+      this.setState(nextProps.binder.getFieldState(nextProps.name))
+    }
+  }
+
+  render() {
+    const { name, label } = this.props
+    const { visible, disabled, value } = this.state
+
+    return (
+      <View style={{
+          display: visible ? 'flex' : 'none',
+          flexDirection: 'row',
+        }}>
+        <Switch disabled={disabled} value={value} onValueChange={this.handleValueChange} />
+        <Text style={{
+            color: disabled ? 'gray' : 'black',
+            fontSize: 16,
+            paddingLeft: 8,
+            alignSelf: 'center'
+          }}>
+          {label}
+        </Text>
+      </View>
+    )
+  }
+}