forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Add tabs explainer and fix 'black screen' during onboard
+31
-2
public/img/tabs-explainer.jpg
public/img/tabs-explainer.jpg
This is a binary file and will not be displayed.
+26
-1
src/view/com/onboard/FeatureExplainer.tsx
+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
+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
+3
src/view/lib/assets.ts