[MOB-10402] Improve Example App Code Quality (#779)

* Saparate sample app screens from App.js

* Migrate sample class components to hooks

* Extract sample buttons into components

* Extract reusable Screen component from screens

* Add tab bar icons in example app

* Extract reusable Section component in example app

* Add welcome heading in example app

* Move sample app source into `src` directory

* Improve primary color selection a11y in sample app

* Hide checkmark icon in ColorButton from a11y in sample

* Add a11y label to color theme switch in sample

* Update survey tokens in sample app

* Fix typo in sample's home screen

Co-authored-by: Youssef Raafat <99807625+TheBuggedYRN@users.noreply.github.com>

* Show welcome header in sample's home screen only

* Set default primary color to default blue in sample

* Set colorTheme state to enum value instead of boolean

* Render invocation events dynamically in sample

* More convenient variable names in sample

* Use `Alert` API instead of deprecated `alert` in sample

* Change components default exports to named exports

Co-authored-by: Youssef Raafat <99807625+TheBuggedYRN@users.noreply.github.com>

Author: a7medev

example/App.js

@@ -83,6 +83,12 @@ project.ext.react = [
 
 apply from: "../../node_modules/react-native/react.gradle"
 
+project.ext.vectoricons = [
+    iconFontNames: ['Ionicons.ttf']
+]
+
+apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"
+
 /**
  * Set this to true to create two separate APKs instead of one:
  *   - An APK that only works on ARM devices

example/android/app/build.gradle

@@ -3,7 +3,7 @@
  */
 
 import { AppRegistry } from 'react-native';
-import App from './App';
+import { App } from './src/App';
 import { name as appName } from './app.json';
 
 AppRegistry.registerComponent(appName, () => App);