diff --git a/src/Main.tsx b/src/Main.tsx index 4b6b599..6c2e6a2 100644 --- a/src/Main.tsx +++ b/src/Main.tsx @@ -1,23 +1,70 @@ import React, { useEffect, useRef, useState } from 'react'; import { Platform, SafeAreaView, StyleSheet, useColorScheme, DeviceEventEmitter } from 'react-native'; import { Colors } from 'react-native/Libraries/NewAppScreen'; -import StartScreen from './components/StartScreen'; +import DiscoveryScreen from './components/steps/DiscoveryScreen'; //@ts-ignore import Keycard from "react-native-status-keycard"; +import InitializationScreen from './components/steps/InitializationScreen'; +import NFCModal from './NFCModal'; + +enum Step { + Discovery, + Initialization, + Loading, + Authentication +} const Main = () => { const isDarkMode = useColorScheme() === 'dark'; const [isModalVisible, setIsModalVisible] = useState(false); - const didMount = useRef(false) + const didMount = useRef(false); + const [step, setStep] = useState(Step.Discovery); + const [pin, setPin] = useState(null || String); + const keycardConnectHandler = async () => { + try { + const appInfo = await Keycard.getApplicationInfo(); + + switch (step) { + case Step.Discovery: + if (appInfo["initialized?"]) { + if (appInfo["has-master-key?"]) { + setStep(Step.Authentication); + } else { + setStep(Step.Loading); + } + } else { + setStep(Step.Initialization); + } + break; + case Step.Initialization: + setStep(Step.Loading); + break; + case Step.Loading: + setStep(Step.Authentication); + break; + case Step.Authentication: + setStep(Step.Discovery); + break; + default: + setStep(Step.Discovery); + break; + } + + if (pin) { + await Keycard.unpair(pin); + } + } catch (err) { + console.log(err); + } + + setIsModalVisible(false); + } useEffect(() => { if (!didMount.current) { didMount.current = true; - DeviceEventEmitter.addListener("keyCardOnConnected", async () => { - console.log(await Keycard.getApplicationInfo()); - setIsModalVisible(false); - }); + DeviceEventEmitter.addListener("keyCardOnConnected", keycardConnectHandler); DeviceEventEmitter.addListener("keyCardOnDisconnected", () => console.log("keycard disconnected")); DeviceEventEmitter.addListener("keyCardOnNFCEnabled", () => console.log("nfc enabled")); DeviceEventEmitter.addListener("keyCardOnNFCDisabled", () => console.log("nfc disabled")); @@ -28,7 +75,7 @@ const Main = () => { backgroundColor: isDarkMode ? Colors.darker : Colors.lighter, }; - const exitFunc = async () => { + const connectCard = async () => { if (await Keycard.nfcIsSupported() && !await Keycard.nfcIsEnabled()) { await Keycard.openNfcSettings(); } @@ -42,7 +89,9 @@ const Main = () => { return ( - + {step == Step.Discovery && } + {step == Step.Initialization && } + ); } diff --git a/src/components/StartScreen.tsx b/src/components/StartScreen.tsx deleted file mode 100644 index 9fa6d1f..0000000 --- a/src/components/StartScreen.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import {FC } from "react"; -import { StyleSheet, Text, View } from "react-native"; -import NFCModal from "../NFCModal"; -import Button from "./Button"; - -type StartScreenProps = { - onExitBtnFunc: () => void; - isModalVisible: boolean; - modalVisibilityFunc: (val: boolean) => void; -}; - -const StartScreen: FC = props => { - const {onExitBtnFunc, isModalVisible, modalVisibilityFunc} = props; - - return ( - - - We are recruiting Operators to be the founders of a new, self-sovereign world in cyberspace - - - - - - - )}; - -const styles = StyleSheet.create({ - heading: { - textAlign: 'center', - fontSize: 16 - } -}); - -export default StartScreen; \ No newline at end of file diff --git a/src/components/steps/DiscoveryScreen.tsx b/src/components/steps/DiscoveryScreen.tsx new file mode 100644 index 0000000..cb9c5ae --- /dev/null +++ b/src/components/steps/DiscoveryScreen.tsx @@ -0,0 +1,30 @@ +import {FC } from "react"; +import { StyleSheet, Text, View } from "react-native"; +import Button from "../Button"; + +type DiscoveryScreenProps = { + onPressFunc: () => void; +}; + +const DiscoveryScreen: FC = props => { + const {onPressFunc} = props; + + return ( + + + We are recruiting Operators to be the founders of a new, self-sovereign world in cyberspace + + + + + + )}; + +const styles = StyleSheet.create({ + heading: { + textAlign: 'center', + fontSize: 16 + } +}); + +export default DiscoveryScreen; \ No newline at end of file diff --git a/src/components/steps/InitializationScreen.tsx b/src/components/steps/InitializationScreen.tsx new file mode 100644 index 0000000..3a9ab15 --- /dev/null +++ b/src/components/steps/InitializationScreen.tsx @@ -0,0 +1,30 @@ +import {FC } from "react"; +import { StyleSheet, Text, View } from "react-native"; +import Button from "../Button"; + +type InitializationScreenProps = { + onPressFunc: () => void; +}; + +const InitializationScreen: FC = props => { + const {onPressFunc} = props; + + return ( + + + Hello world + + + + + + )}; + +const styles = StyleSheet.create({ + heading: { + textAlign: 'center', + fontSize: 16 + } +}); + +export default InitializationScreen; \ No newline at end of file