[APP-28] add status page link (#987)

* add status page to mobile

* add status page URL to super slow loading screen

* store STATUS_PAGE_URL in constants.ts

src/view/com/auth/withAuthRequired.tsx

@@ -1,11 +1,17 @@
 import React from 'react'
-import {ActivityIndicator, StyleSheet} from 'react-native'
+import {
+  ActivityIndicator,
+  Linking,
+  StyleSheet,
+  TouchableOpacity,
+} from 'react-native'
 import {observer} from 'mobx-react-lite'
 import {useStores} from 'state/index'
 import {CenteredView} from '../util/Views'
 import {LoggedOut} from './LoggedOut'
 import {Text} from '../util/text/Text'
 import {usePalette} from 'lib/hooks/usePalette'
+import {STATUS_PAGE_URL} from 'lib/constants'
 
 export const withAuthRequired = <P extends object>(
   Component: React.ComponentType<P>,
@@ -26,7 +32,7 @@ function Loading() {
 
   const [isTakingTooLong, setIsTakingTooLong] = React.useState(false)
   React.useEffect(() => {
-    const t = setTimeout(() => setIsTakingTooLong(true), 15e3)
+    const t = setTimeout(() => setIsTakingTooLong(true), 15e3) // 15 seconds
     return () => clearTimeout(t)
   }, [setIsTakingTooLong])
 
@@ -38,6 +44,17 @@ function Loading() {
           ? "This is taking too long. There may be a problem with your internet or with the service, but we're going to try a couple more times..."
           : 'Connecting...'}
       </Text>
+      {isTakingTooLong ? (
+        <TouchableOpacity
+          onPress={() => {
+            Linking.openURL(STATUS_PAGE_URL)
+          }}
+          accessibilityRole="button">
+          <Text type="2xl" style={[styles.loadingText, pal.link]}>
+            Check Bluesky status page
+          </Text>
+        </TouchableOpacity>
+      ) : null}
     </CenteredView>
   )
 }