Change login icons to ion & Format
This commit is contained in:
50
src/Login.js
50
src/Login.js
@@ -1,14 +1,24 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { View, Text, TextInput, Button, ToastAndroid } from 'react-native';
|
import {Button, Text, TextInput, ToastAndroid, View} from 'react-native';
|
||||||
import SharedPreferences from 'react-native-shared-preferences';
|
import SharedPreferences from 'react-native-shared-preferences';
|
||||||
import Icon from 'react-native-vector-icons/MaterialIcons'
|
import Icon from 'react-native-vector-icons/Ionicons'
|
||||||
import DeviceInfo from 'react-native-device-info';
|
import DeviceInfo from 'react-native-device-info';
|
||||||
import * as axios from "axios";
|
import * as axios from "axios";
|
||||||
|
|
||||||
const urlRegex = new RegExp("^(http|https)://", "i");
|
const urlRegex = new RegExp("^(http|https)://", "i");
|
||||||
const defaultClientName = DeviceInfo.getManufacturer() + ' ' + DeviceInfo.getDeviceId();
|
const defaultClientName = DeviceInfo.getManufacturer() + ' ' + DeviceInfo.getDeviceId();
|
||||||
export default class Login extends React.Component {
|
export default class Login extends React.Component {
|
||||||
state = {tryConnect: null, url: null, error: null, version: null, name: '', pass: '', loggedIn: null, client: defaultClientName};
|
state = {
|
||||||
|
tryConnect: null,
|
||||||
|
url: null,
|
||||||
|
error: null,
|
||||||
|
version: null,
|
||||||
|
name: '',
|
||||||
|
pass: '',
|
||||||
|
loggedIn: null,
|
||||||
|
client: defaultClientName
|
||||||
|
};
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
SharedPreferences.getItem("@global:url", (url) => {
|
SharedPreferences.getItem("@global:url", (url) => {
|
||||||
if (url) {
|
if (url) {
|
||||||
@@ -35,7 +45,7 @@ export default class Login extends React.Component {
|
|||||||
|
|
||||||
createClient = () => {
|
createClient = () => {
|
||||||
const {client, url, pass, name} = this.state;
|
const {client, url, pass, name} = this.state;
|
||||||
axios.post(url + 'client', {name: client}, {auth:{username: name, password: pass}}).then((resp) => {
|
axios.post(url + 'client', {name: client}, {auth: {username: name, password: pass}}).then((resp) => {
|
||||||
SharedPreferences.setItem('@global:token', resp.data.token);
|
SharedPreferences.setItem('@global:token', resp.data.token);
|
||||||
ToastAndroid.show("Created client " + client + " for user " + name, ToastAndroid.SHORT);
|
ToastAndroid.show("Created client " + client + " for user " + name, ToastAndroid.SHORT);
|
||||||
this.props.navigation.navigate('AuthLoading')
|
this.props.navigation.navigate('AuthLoading')
|
||||||
@@ -70,12 +80,12 @@ export default class Login extends React.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (urlRegex.test(url)) {
|
if (urlRegex.test(url)) {
|
||||||
if(url.match(/^http:\/\//i)){
|
if (url.match(/^http:\/\//i)) {
|
||||||
this.version(url.replace(/^http:\/\//i,"https://"), () => {
|
this.version(url.replace(/^http:\/\//i, "https://"), () => {
|
||||||
this.version(url, this.notReachable, this.reachedButNot)
|
this.version(url, this.notReachable, this.reachedButNot)
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
this.version(url, this.notReachable,this.reachedButNot)
|
this.version(url, this.notReachable, this.reachedButNot)
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
this.setState({...this.state, error: 'url must either start with http:// or https://'})
|
this.setState({...this.state, error: 'url must either start with http:// or https://'})
|
||||||
@@ -84,7 +94,7 @@ export default class Login extends React.Component {
|
|||||||
|
|
||||||
checkUser = () => {
|
checkUser = () => {
|
||||||
const {url, pass, name} = this.state;
|
const {url, pass, name} = this.state;
|
||||||
axios.get(url + 'current/user', {auth:{username: name, password: pass}}).then((resp) => {
|
axios.get(url + 'current/user', {auth: {username: name, password: pass}}).then((resp) => {
|
||||||
this.setState({...this.state, loggedIn: true})
|
this.setState({...this.state, loggedIn: true})
|
||||||
}).catch((resp) => {
|
}).catch((resp) => {
|
||||||
this.setState({...this.state, loggedIn: false})
|
this.setState({...this.state, loggedIn: false})
|
||||||
@@ -95,38 +105,40 @@ export default class Login extends React.Component {
|
|||||||
const {tryConnect, error, version, url, client, loggedIn} = this.state;
|
const {tryConnect, error, version, url, client, loggedIn} = this.state;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center'}}>
|
<View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
|
||||||
<View style={{width: "80%"}}>
|
<View style={{width: "80%"}}>
|
||||||
<Text style={{fontSize: 20, textAlign:'center'}}>Gotify</Text>
|
<Text style={{fontSize: 20, textAlign: 'center'}}>Gotify</Text>
|
||||||
<View style={{ alignItems: 'center', flexDirection: 'row'}}>
|
<View style={{alignItems: 'center', flexDirection: 'row'}}>
|
||||||
<TextInput
|
<TextInput
|
||||||
value={url}
|
value={url}
|
||||||
placeholder="URL f.ex https://push.domain.tld"
|
placeholder="URL f.ex https://push.domain.tld"
|
||||||
style={{alignSelf: 'stretch', flex: 1}}
|
style={{alignSelf: 'stretch', flex: 1}}
|
||||||
keyboardType="url"
|
keyboardType="url"
|
||||||
onChangeText={this.handleChange('url', {tryConnect: false, version: null})}/>
|
onChangeText={this.handleChange('url', {tryConnect: false, version: null})}/>
|
||||||
<Icon.Button name="send" style={{alignSelf: 'flex-end'}} iconStyle={{marginRight: 0}} onPress={this.checkUrl}/>
|
<Icon.Button name="md-send" style={{alignSelf: 'flex-end'}} iconStyle={{marginRight: 0}}
|
||||||
|
onPress={this.checkUrl}/>
|
||||||
</View>
|
</View>
|
||||||
{error && <Text style={{textAlign:'center', color: 'red'}}>{error}</Text>}
|
{error && <Text style={{textAlign: 'center', color: 'red'}}>{error}</Text>}
|
||||||
{version && <Text style={{textAlign:'center', color: 'green'}}>Gotify v{version.version}</Text>}
|
{version && <Text style={{textAlign: 'center', color: 'green'}}>Gotify v{version.version}</Text>}
|
||||||
{tryConnect === true && (
|
{tryConnect === true && (
|
||||||
<React.Fragment>
|
<React.Fragment>
|
||||||
<TextInput placeholder="Username"
|
<TextInput placeholder="Username"
|
||||||
onChangeText={this.handleChange('name', {loggedIn: null})}
|
onChangeText={this.handleChange('name', {loggedIn: null})}
|
||||||
style={{width: '100%'}}/>
|
style={{width: '100%'}}/>
|
||||||
<View style={{ alignItems: 'center', flexDirection: 'row'}}>
|
<View style={{alignItems: 'center', flexDirection: 'row'}}>
|
||||||
|
|
||||||
<TextInput placeholder="Password"
|
<TextInput placeholder="Password"
|
||||||
secureTextEntry={true}
|
secureTextEntry={true}
|
||||||
onChangeText={this.handleChange('pass', {loggedIn: null})}
|
onChangeText={this.handleChange('pass', {loggedIn: null})}
|
||||||
style={{alignSelf: 'stretch', flex: 1}}
|
style={{alignSelf: 'stretch', flex: 1}}
|
||||||
/>
|
/>
|
||||||
<Icon.Button name="send" style={{alignSelf: 'flex-end'}} iconStyle={{marginRight: 0}} onPress={this.checkUser}/>
|
<Icon.Button name="md-send" style={{alignSelf: 'flex-end'}} iconStyle={{marginRight: 0}}
|
||||||
|
onPress={this.checkUser}/>
|
||||||
</View>
|
</View>
|
||||||
{loggedIn === true && (
|
{loggedIn === true && (
|
||||||
<React.Fragment>
|
<React.Fragment>
|
||||||
|
|
||||||
<Text style={{textAlign:'center', color: 'green'}}>
|
<Text style={{textAlign: 'center', color: 'green'}}>
|
||||||
valid user
|
valid user
|
||||||
</Text>
|
</Text>
|
||||||
|
|
||||||
@@ -134,12 +146,12 @@ export default class Login extends React.Component {
|
|||||||
value={client}
|
value={client}
|
||||||
onChangeText={this.handleChange('client')}
|
onChangeText={this.handleChange('client')}
|
||||||
style={{width: '100%'}}/>
|
style={{width: '100%'}}/>
|
||||||
<Button title="Create Client" onPress={this.createClient} />
|
<Button title="Create Client" onPress={this.createClient}/>
|
||||||
|
|
||||||
</React.Fragment>
|
</React.Fragment>
|
||||||
)}
|
)}
|
||||||
{loggedIn === false && (
|
{loggedIn === false && (
|
||||||
<Text style={{textAlign:'center', color: 'red'}}>
|
<Text style={{textAlign: 'center', color: 'red'}}>
|
||||||
wrong name / pass
|
wrong name / pass
|
||||||
</Text>
|
</Text>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user