[TMA-132] App Splash Screen (#38)

* Add splash screen to onboarding stack

* Fix improper wizard behavior

* Set search bar autoCapitalize to none

* Add splash screen fade transition

* Update stack navigator screenOptions

1 files changed, 12 insertions, 7 deletions

diff --git a/src/components/onboarding/RegistrationWizard.tsx b/src/components/onboarding/RegistrationWizard.tsx
index 31c3bbdf..0094c8af 100644
--- a/src/components/onboarding/RegistrationWizard.tsx
+++ b/src/components/onboarding/RegistrationWizard.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, {useEffect} from 'react';
 import {View, StyleSheet, ViewProps, Keyboard} from 'react-native';
 import * as Animatable from 'react-native-animatable';
 
@@ -13,12 +13,17 @@ const RegistrationWizard = (props: RegistrationWizardProps) => {
   // detects visibility of keyboard to display or hide wizard
   const [keyboardVisible, setKeyboardVisible] = React.useState(false);
 
-  Keyboard.addListener('keyboardDidShow', () => {
-    setKeyboardVisible(true);
-  });
-  Keyboard.addListener('keyboardDidHide', () => {
-    setKeyboardVisible(false);
-  });
+  useEffect(() => {
+    const showKeyboard = () => setKeyboardVisible(true);
+    Keyboard.addListener('keyboardWillShow', showKeyboard);
+    return () => Keyboard.removeListener('keyboardWillShow', showKeyboard);
+  }, []);
+
+  useEffect(() => {
+    const hideKeyboard = () => setKeyboardVisible(false);
+    Keyboard.addListener('keyboardWillHide', hideKeyboard);
+    return () => Keyboard.removeListener('keyboardWillHide', hideKeyboard);
+  }, []);
 
   return (
     <View {...props}>