Bluesky app fork with some witchin' additions 💫
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Add tabs explainer and fix 'black screen' during onboard

+31 -2
public/img/tabs-explainer.jpg

This is a binary file and will not be displayed.

+26 -1
src/view/com/onboard/FeatureExplainer.tsx
··· 10 10 View, 11 11 } from 'react-native' 12 12 import {TabView, SceneMap, Route, TabBarProps} from 'react-native-tab-view' 13 + import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' 13 14 import {UserGroupIcon} from '../../lib/icons' 14 15 import {useStores} from '../../../state' 15 16 import {s} from '../../lib/styles' 16 - import {SCENE_EXPLAINER} from '../../lib/assets' 17 + import {SCENE_EXPLAINER, TABS_EXPLAINER} from '../../lib/assets' 17 18 18 19 const Intro = () => ( 19 20 <View style={styles.explainer}> ··· 49 50 </View> 50 51 ) 51 52 53 + const Tabs = () => ( 54 + <View style={styles.explainer}> 55 + <View style={styles.explainerIcon}> 56 + <View style={s.flex1} /> 57 + <FontAwesomeIcon 58 + icon={['far', 'clone']} 59 + style={[s.black, s.mb5]} 60 + size={36} 61 + /> 62 + <View style={s.flex1} /> 63 + </View> 64 + <Text style={styles.explainerHeading}>Tabs</Text> 65 + <Text style={styles.explainerDesc}> 66 + Never lose your place! Long-press on posts and links to open them in a new 67 + tab. 68 + </Text> 69 + <Text style={styles.explainerDesc}> 70 + <Image source={TABS_EXPLAINER} style={styles.explainerImg} /> 71 + </Text> 72 + </View> 73 + ) 74 + 52 75 const SCENE_MAP = { 53 76 intro: Intro, 54 77 scenes: Scenes, 78 + tabs: Tabs, 55 79 } 56 80 const renderScene = SceneMap(SCENE_MAP) 57 81 ··· 62 86 const routes = [ 63 87 {key: 'intro', title: 'Intro'}, 64 88 {key: 'scenes', title: 'Scenes'}, 89 + {key: 'tabs', title: 'Tabs'}, 65 90 ] 66 91 67 92 const onPressSkip = () => store.onboard.next()
+1
src/view/lib/assets.native.ts
··· 2 2 3 3 export const DEF_AVATAR: ImageSourcePropType = require('../../../public/img/default-avatar.jpg') 4 4 export const SCENE_EXPLAINER: ImageSourcePropType = require('../../../public/img/scene-explainer.jpg') 5 + export const TABS_EXPLAINER: ImageSourcePropType = require('../../../public/img/tabs-explainer.jpg')
+3
src/view/lib/assets.ts
··· 4 4 export const SCENE_EXPLAINER: ImageSourcePropType = { 5 5 uri: '/img/scene-explainer.jpg', 6 6 } 7 + export const TABS_EXPLAINER: ImageSourcePropType = { 8 + uri: '/img/tabs-explainer.jpg', 9 + }
+1 -1
src/view/screens/Onboard.tsx
··· 26 26 } 27 27 28 28 return ( 29 - <View style={{flex: 1}}> 29 + <View style={{flex: 1, backgroundColor: '#fff'}}> 30 30 <Com /> 31 31 </View> 32 32 )