feat(dev): option to render web app inside the mobile app (#1164)

* feat (WIP): render web app inside the mobile app

* fix: web app loading

* chore: build scripts related to mobile web bundle

* feat: show WebView header, which lets to close the WebView

* refactor: remove extra component

* chore: correct type

* chore: remove TODO

Co-authored-by: Mo <mo@standardnotes.com>

packages/mobile/src/Screens/Settings/Sections/OptionsSection.tsx

@@ -1,3 +1,4 @@
+import { WebAppOptionEnabled } from '@Lib/constants'
 import { useSignedIn } from '@Lib/SnjsHelperHooks'
 import { useNavigation } from '@react-navigation/native'
 import { ButtonCell } from '@Root/Components/ButtonCell'
@@ -7,7 +8,7 @@ import { SectionHeader } from '@Root/Components/SectionHeader'
 import { TableSection } from '@Root/Components/TableSection'
 import { useSafeApplicationContext } from '@Root/Hooks/useSafeApplicationContext'
 import { ModalStackNavigationProp } from '@Root/ModalStack'
-import { SCREEN_MANAGE_SESSIONS, SCREEN_SETTINGS } from '@Root/Screens/screens'
+import { SCREEN_MANAGE_SESSIONS, SCREEN_SETTINGS, SCREEN_WEB_APP } from '@Root/Screens/screens'
 import { ButtonType, PrefKey } from '@standardnotes/snjs'
 import moment from 'moment'
 import React, { useCallback, useMemo, useState } from 'react'
@@ -182,6 +183,10 @@ export const OptionsSection = ({ title, encryptionAvailable }: Props) => {
     )
   }, [application.alertService])
 
+  const openWebApp = useCallback(() => {
+    navigation.push(SCREEN_WEB_APP)
+  }, [navigation])
+
   return (
     <TableSection>
       <SectionHeader title={title} />
@@ -221,6 +226,10 @@ export const OptionsSection = ({ title, encryptionAvailable }: Props) => {
         onPress={onExportPress}
       />
 
+      {WebAppOptionEnabled && (
+        <ButtonCell testID="openWebApp" leftAligned title={'Open Web App'} onPress={() => openWebApp()} />
+      )}
+
       {!signedIn && (
         <SectionedAccessoryTableCell
           testID="lastExportDate"

packages/mobile/src/Screens/screens.ts

@@ -16,3 +16,5 @@ export const SCREEN_MANAGE_SESSIONS = 'ManageSessions' as const
 export const MODAL_BLOCKING_ALERT = 'ModalBlockingAlert' as const
 
 export const SCREEN_VIEW_PROTECTED_NOTE = 'ViewProtectedNote' as const
+
+export const SCREEN_WEB_APP = 'WebApp' as const