diff --git a/public/img/tabs-explainer.jpg b/public/img/tabs-explainer.jpg new file mode 100644 index 0000000000..64f0a8fe5b Binary files /dev/null and b/public/img/tabs-explainer.jpg differ diff --git a/src/view/com/onboard/FeatureExplainer.tsx b/src/view/com/onboard/FeatureExplainer.tsx index 0bc0876d16..d6c75ae04b 100644 --- a/src/view/com/onboard/FeatureExplainer.tsx +++ b/src/view/com/onboard/FeatureExplainer.tsx @@ -10,10 +10,11 @@ import { View, } from 'react-native' import {TabView, SceneMap, Route, TabBarProps} from 'react-native-tab-view' +import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {UserGroupIcon} from '../../lib/icons' import {useStores} from '../../../state' import {s} from '../../lib/styles' -import {SCENE_EXPLAINER} from '../../lib/assets' +import {SCENE_EXPLAINER, TABS_EXPLAINER} from '../../lib/assets' const Intro = () => ( @@ -49,9 +50,32 @@ const Scenes = () => ( ) +const Tabs = () => ( + + + + + + + Tabs + + Never lose your place! Long-press on posts and links to open them in a new + tab. + + + + + +) + const SCENE_MAP = { intro: Intro, scenes: Scenes, + tabs: Tabs, } const renderScene = SceneMap(SCENE_MAP) @@ -62,6 +86,7 @@ export const FeatureExplainer = () => { const routes = [ {key: 'intro', title: 'Intro'}, {key: 'scenes', title: 'Scenes'}, + {key: 'tabs', title: 'Tabs'}, ] const onPressSkip = () => store.onboard.next() diff --git a/src/view/lib/assets.native.ts b/src/view/lib/assets.native.ts index aa3c816b83..4b5c3efcae 100644 --- a/src/view/lib/assets.native.ts +++ b/src/view/lib/assets.native.ts @@ -2,3 +2,4 @@ import {ImageSourcePropType} from 'react-native' export const DEF_AVATAR: ImageSourcePropType = require('../../../public/img/default-avatar.jpg') export const SCENE_EXPLAINER: ImageSourcePropType = require('../../../public/img/scene-explainer.jpg') +export const TABS_EXPLAINER: ImageSourcePropType = require('../../../public/img/tabs-explainer.jpg') diff --git a/src/view/lib/assets.ts b/src/view/lib/assets.ts index ad425ca6ff..04c3680896 100644 --- a/src/view/lib/assets.ts +++ b/src/view/lib/assets.ts @@ -4,3 +4,6 @@ export const DEF_AVATAR: ImageSourcePropType = {uri: '/img/default-avatar.jpg'} export const SCENE_EXPLAINER: ImageSourcePropType = { uri: '/img/scene-explainer.jpg', } +export const TABS_EXPLAINER: ImageSourcePropType = { + uri: '/img/tabs-explainer.jpg', +} diff --git a/src/view/screens/Onboard.tsx b/src/view/screens/Onboard.tsx index 0f36494e6a..4aa0e6cac1 100644 --- a/src/view/screens/Onboard.tsx +++ b/src/view/screens/Onboard.tsx @@ -26,7 +26,7 @@ export const Onboard = observer(() => { } return ( - + )