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 (
-
+
)