[APP-775] Add Welcome screen after account creation (#1038)

* add comments to step 1-3

* add onboarding screen

* add analytics for onboarding tracking

* fix useEffect

* change text

* change icon size

* put onboarding into bottom sheet modal instead of react navigation

* wip

* Simplify the type validation

* Fix: only trigger onboarding modal when account creation succeeds

* Add the 'session-ready' event which fires when the new session is stable

* Use the 'session-ready' event to trigger the onboarding modal

* update copy

* update copy

---------

Co-authored-by: Paul Frazee <pfrazee@gmail.com>

src/view/com/modals/Modal.tsx

@@ -27,6 +27,7 @@ import * as ContentFilteringSettingsModal from './ContentFilteringSettings'
 import * as ContentLanguagesSettingsModal from './lang-settings/ContentLanguagesSettings'
 import * as PostLanguagesSettingsModal from './lang-settings/PostLanguagesSettings'
 import * as PreferencesHomeFeed from './PreferencesHomeFeed'
+import * as OnboardingModal from './OnboardingModal'
 
 const DEFAULT_SNAPPOINTS = ['90%']
 
@@ -117,6 +118,9 @@ export const ModalsContainer = observer(function ModalsContainer() {
   } else if (activeModal?.name === 'preferences-home-feed') {
     snapPoints = PreferencesHomeFeed.snapPoints
     element = <PreferencesHomeFeed.Component />
+  } else if (activeModal?.name === 'onboarding') {
+    snapPoints = OnboardingModal.snapPoints
+    element = <OnboardingModal.Component />
   } else {
     return null
   }

src/view/com/modals/Modal.web.tsx

@@ -26,6 +26,7 @@ import * as AddAppPassword from './AddAppPasswords'
 import * as ContentFilteringSettingsModal from './ContentFilteringSettings'
 import * as ContentLanguagesSettingsModal from './lang-settings/ContentLanguagesSettings'
 import * as PostLanguagesSettingsModal from './lang-settings/PostLanguagesSettings'
+import * as OnboardingModal from './OnboardingModal'
 
 import * as PreferencesHomeFeed from './PreferencesHomeFeed'
 
@@ -107,6 +108,8 @@ function Modal({modal}: {modal: ModalIface}) {
     element = <EditImageModal.Component {...modal} />
   } else if (modal.name === 'preferences-home-feed') {
     element = <PreferencesHomeFeed.Component />
+  } else if (modal.name === 'onboarding') {
+    element = <OnboardingModal.Component />
   } else {
     return null
   }

src/view/com/modals/OnboardingModal.tsx

@@ -0,0 +1,8 @@
+import React from 'react'
+import {Onboarding} from '../auth/onboarding/Onboarding'
+
+export const snapPoints = ['90%']
+
+export function Component() {
+  return <Onboarding />
+}