diff --git a/app/client/mobile/src/access/Access.styled.ts b/app/client/mobile/src/access/Access.styled.ts
index b849c77a..259ba492 100644
--- a/app/client/mobile/src/access/Access.styled.ts
+++ b/app/client/mobile/src/access/Access.styled.ts
@@ -83,6 +83,12 @@ export const styles = StyleSheet.create({
margin: 4,
marginTop: 16,
},
+ spacer: {
+ width: '100%',
+ display: 'flex',
+ alignItems: 'center',
+ height: 76,
+ },
hidden: {
width: '50%',
margin: 4,
@@ -113,4 +119,17 @@ export const styles = StyleSheet.create({
margin: 16,
bottom: 0,
},
+ modal: {
+ diwplay: 'flex',
+ alignItems: 'center',
+ justifyContent: 'center',
+ },
+ content: {
+ width: '50%',
+ padding: 16,
+ backgroundColor: 'white',
+ },
+ close: {
+ paddingTop: 8,
+ },
});
diff --git a/app/client/mobile/src/access/Access.tsx b/app/client/mobile/src/access/Access.tsx
index 8c96f653..30be2276 100644
--- a/app/client/mobile/src/access/Access.tsx
+++ b/app/client/mobile/src/access/Access.tsx
@@ -3,14 +3,16 @@ import {ScrollView, View, Image} from 'react-native';
import {useAccess} from './useAccess.hook';
import {styles} from './Access.styled';
import left from '../images/login.png';
-import {IconButton, Text, TextInput, Button} from 'react-native-paper';
+import {IconButton, Modal, Text, TextInput, Button} from 'react-native-paper';
import {SafeAreaView} from 'react-native-safe-area-context';
export function Access() {
const [text, setText] = useState('');
const {state, actions} = useAccess();
const [disabled, setDisabled] = useState(false);
+ const [showConfirm, setShowConfirm] = useState(false);
const [showPassword, setShowPassword] = useState(false);
+ const [alert, setAlert] = useState(false);
const login = async () => {
if (!state.loading) {
@@ -40,7 +42,7 @@ export function Access() {
}
console.log('DONE LOGIN');
} else {
- console.log('ALERT ERROR');
+ setAlert(true);
}
}
actions.setLoading(false);
@@ -109,7 +111,8 @@ export function Access() {
autoCapitalize="none"
autoComplete="off"
autoCorrect={false}
- label="Password"
+ value={state.password}
+ label={state.strings.password}
secureTextEntry={!showPassword}
left={}
right={
@@ -144,8 +147,215 @@ export function Access() {
)}
+ {state.mode === 'reset' && (
+
+ {state.strings.accessAccount}
+ }
+ onChangeText={value => actions.setToken(value)}
+ />
+ }
+ onChangeText={value => actions.setNode(value)}
+ />
+
+
+
+
+ )}
+ {state.mode === 'create' && (
+
+ {state.strings.createAccount}
+
+ {!state.available && (
+ }
+ onChangeText={value => actions.setToken(value)}
+ />
+ )}
+
+ }
+ onChangeText={value => actions.setNode(value)}
+ />
+ }
+ onChangeText={value => actions.setUsername(value)}
+ />
+ }
+ right={
+ showPassword ? (
+ setShowPassword(false)}
+ />
+ ) : (
+ setShowPassword(true)}
+ />
+ )
+ }
+ onChangeText={value => actions.setPassword(value)}
+ />
+ }
+ right={
+ showPassword ? (
+ setShowConfirm(false)}
+ />
+ ) : (
+ setShowConfirm(true)}
+ />
+ )
+ }
+ onChangeText={value => actions.setConfirm(value)}
+ />
+
+
+
+
+ )}
+ {state.mode === 'admin' && (
+
+ {state.strings.adminAccess}
+ }
+ onChangeText={value => actions.setNode(value)}
+ />
+ }
+ right={
+ showPassword ? (
+ setShowPassword(false)}
+ />
+ ) : (
+ setShowPassword(true)}
+ />
+ )
+ }
+ onChangeText={value => actions.setPassword(value)}
+ />
+
+
+ )}
+ setAlert(false)} contentContainerStyle={styles.modal}>
+
+ {state.strings.error}
+ {state.strings.tryAgain}
+
+
+
);
}
diff --git a/app/client/mobile/src/access/useAccess.hook.ts b/app/client/mobile/src/access/useAccess.hook.ts
index 777a8471..9bebd25e 100644
--- a/app/client/mobile/src/access/useAccess.hook.ts
+++ b/app/client/mobile/src/access/useAccess.hook.ts
@@ -62,13 +62,19 @@ export function useAccess() {
updateState({taken: false});
clearTimeout(debounceTaken.current);
debounceTaken.current = setTimeout(async () => {
- const available = await app.actions.getUsername(
- username,
- token,
- node,
- secure,
- );
- updateState({taken: !available});
+ try {
+ const available = await app.actions.getUsername(
+ username,
+ token,
+ node,
+ secure,
+ );
+ updateState({taken: !available});
+ }
+ catch (err) {
+ console.log(err);
+ updateState({taken: false});
+ }
}, 2000);
};
diff --git a/app/client/mobile/src/node/Node.tsx b/app/client/mobile/src/node/Node.tsx
index 33f4c143..2c15ac41 100644
--- a/app/client/mobile/src/node/Node.tsx
+++ b/app/client/mobile/src/node/Node.tsx
@@ -1,5 +1,21 @@
+import {Button} from 'react-native-paper';
import {Text} from 'react-native';
+import {AppContext} from '../context/AppContext';
+import {View} from 'react-native';
+import {useContext} from 'react';
export function Node() {
- return NODE;
+ const app = useContext(AppContext);
+
+ return (
+
+ NODE!
+ NODE!
+ NODE!
+ NODE!
+
+
+ );
}