diff --git a/src/components/StarterPack/Wizard/BackGestureDetector.ios.tsx b/src/components/StarterPack/Wizard/BackGestureDetector.ios.tsx
new file mode 100644
index 0000000000..bf0b2593c0
--- /dev/null
+++ b/src/components/StarterPack/Wizard/BackGestureDetector.ios.tsx
@@ -0,0 +1,28 @@
+import React from 'react'
+import {Gesture, GestureDetector} from 'react-native-gesture-handler'
+import {runOnJS} from 'react-native-reanimated'
+
+export function BackGestureDetector({
+ onBack,
+ children,
+}: {
+ onBack: () => void
+ children: React.ReactNode
+}) {
+ const swipeGesture = Gesture.Pan()
+ .maxPointers(1)
+ .onEnd(({translationX, translationY, velocityX}) => {
+ if (
+ // Make sure it isn't a scrollview
+ translationX > translationY &&
+ translationY <= 10 &&
+ translationX >= 25 &&
+ // Shouldn't be a really slow swipe
+ velocityX >= 300
+ ) {
+ runOnJS(onBack)()
+ }
+ })
+
+ return {children}
+}
diff --git a/src/components/StarterPack/Wizard/BackGestureDetector.tsx b/src/components/StarterPack/Wizard/BackGestureDetector.tsx
new file mode 100644
index 0000000000..84440fc58b
--- /dev/null
+++ b/src/components/StarterPack/Wizard/BackGestureDetector.tsx
@@ -0,0 +1,11 @@
+import React from 'react'
+
+export function BackGestureDetector({
+ onBack: _onBack,
+ children,
+}: {
+ onBack: () => void
+ children: React.ReactNode
+}) {
+ return children
+}
diff --git a/src/screens/StarterPack/Wizard/StepDetails.tsx b/src/screens/StarterPack/Wizard/StepDetails.tsx
index 24c992c60b..be73f55dd2 100644
--- a/src/screens/StarterPack/Wizard/StepDetails.tsx
+++ b/src/screens/StarterPack/Wizard/StepDetails.tsx
@@ -2,13 +2,16 @@ import React from 'react'
import {View} from 'react-native'
import {msg, Trans} from '@lingui/macro'
import {useLingui} from '@lingui/react'
+import {useNavigation} from '@react-navigation/native'
+import {NavigationProp} from 'lib/routes/types'
import {useProfileQuery} from 'state/queries/profile'
import {useSession} from 'state/session'
import {useWizardState} from '#/screens/StarterPack/Wizard/State'
import {atoms as a, useTheme} from '#/alf'
import * as TextField from '#/components/forms/TextField'
import {StarterPack} from '#/components/icons/StarterPack'
+import {BackGestureDetector} from '#/components/StarterPack/Wizard/BackGestureDetector'
import {ScreenTransition} from '#/components/StarterPack/Wizard/ScreenTransition'
import {Text} from '#/components/Typography'
@@ -16,6 +19,7 @@ export function StepDetails() {
const {_} = useLingui()
const t = useTheme()
const [state, dispatch] = useWizardState()
+ const navigation = useNavigation()
const {currentAccount} = useSession()
const {data: currentProfile} = useProfileQuery({
@@ -24,61 +28,71 @@ export function StepDetails() {
})
return (
-
-
-
-
-
- Invites, but personal
-
-
-
- Invite your friends to follow your favorite feeds and people
-
-
+ {
+ if (navigation.canGoBack()) {
+ navigation.goBack()
+ } else {
+ navigation.navigate('Home')
+ }
+ }}>
+
+
+
+
+
+ Invites, but personal
+
+
+
+ Invite your friends to follow your favorite feeds and people
+
+
+
+
+
+ What do you want to call your starter pack?
+
+
+ dispatch({type: 'SetName', name: text})}
+ />
+
+
+ {state.name?.length ?? 0}/50
+
+
+
+
+
+
+ Tell us a little more
+
+
+
+ dispatch({type: 'SetDescription', description: text})
+ }
+ multiline
+ style={{minHeight: 150}}
+ />
+
+
-
-
- What do you want to call your starter pack?
-
-
- dispatch({type: 'SetName', name: text})}
- />
-
-
- {state.name?.length ?? 0}/50
-
-
-
-
-
-
- Tell us a little more
-
-
-
- dispatch({type: 'SetDescription', description: text})
- }
- multiline
- style={{minHeight: 150}}
- />
-
-
-
-
+
+
)
}
diff --git a/src/screens/StarterPack/Wizard/StepFeeds.tsx b/src/screens/StarterPack/Wizard/StepFeeds.tsx
index 6752a95db3..8353f545cb 100644
--- a/src/screens/StarterPack/Wizard/StepFeeds.tsx
+++ b/src/screens/StarterPack/Wizard/StepFeeds.tsx
@@ -17,6 +17,7 @@ import {useWizardState} from '#/screens/StarterPack/Wizard/State'
import {atoms as a, useTheme} from '#/alf'
import {useThrottledValue} from '#/components/hooks/useThrottledValue'
import {Loader} from '#/components/Loader'
+import {BackGestureDetector} from '#/components/StarterPack/Wizard/BackGestureDetector'
import {ScreenTransition} from '#/components/StarterPack/Wizard/ScreenTransition'
import {WizardFeedCard} from '#/components/StarterPack/Wizard/WizardListCard'
import {Text} from '#/components/Typography'
@@ -64,50 +65,58 @@ export function StepFeeds({moderationOpts}: {moderationOpts: ModerationOpts}) {
}
return (
-
-
-
- setQuery(t)}
- onPressCancelSearch={() => setQuery('')}
- onSubmitQuery={() => {}}
- />
-
-
- fetchNextPage() : undefined
- }
- onEndReachedThreshold={2}
- renderScrollComponent={props => }
- keyboardShouldPersistTaps="handled"
- containWeb={true}
- sideBorders={false}
- style={{flex: 1}}
- ListEmptyComponent={
-
- {isLoadingSearch ? (
-
- ) : (
-
- No feeds found. Try searching for something else.
-
- )}
+ dispatch({type: 'Back'})}>
+
+
+
+ setQuery(t)}
+ onPressCancelSearch={() => setQuery('')}
+ onSubmitQuery={() => {}}
+ />
- }
- />
-
+
+ fetchNextPage() : undefined
+ }
+ onEndReachedThreshold={2}
+ renderScrollComponent={props => (
+
+ )}
+ keyboardShouldPersistTaps="handled"
+ containWeb={true}
+ sideBorders={false}
+ style={{flex: 1}}
+ ListEmptyComponent={
+
+ {isLoadingSearch ? (
+
+ ) : (
+
+
+ No feeds found. Try searching for something else.
+
+
+ )}
+
+ }
+ />
+
+
)
}
diff --git a/src/screens/StarterPack/Wizard/StepProfiles.tsx b/src/screens/StarterPack/Wizard/StepProfiles.tsx
index 8fe7f52fed..5dd97ba066 100644
--- a/src/screens/StarterPack/Wizard/StepProfiles.tsx
+++ b/src/screens/StarterPack/Wizard/StepProfiles.tsx
@@ -13,6 +13,7 @@ import {List} from 'view/com/util/List'
import {useWizardState} from '#/screens/StarterPack/Wizard/State'
import {atoms as a, useTheme} from '#/alf'
import {Loader} from '#/components/Loader'
+import {BackGestureDetector} from '#/components/StarterPack/Wizard/BackGestureDetector'
import {ScreenTransition} from '#/components/StarterPack/Wizard/ScreenTransition'
import {WizardProfileCard} from '#/components/StarterPack/Wizard/WizardListCard'
import {Text} from '#/components/Typography'
@@ -53,49 +54,57 @@ export function StepProfiles({
}
return (
-
-
-
- setQuery('')}
- onSubmitQuery={() => {}}
- />
-
-
- }
- keyboardShouldPersistTaps="handled"
- containWeb={true}
- sideBorders={false}
+ dispatch({type: 'Back'})}>
+ fetchNextPage() : undefined
- }
- onEndReachedThreshold={isNative ? 2 : 0.25}
- ListEmptyComponent={
-
- {isLoadingResults ? (
-
- ) : (
-
- Nobody was found. Try searching for someone else.
-
- )}
+ direction={state.transitionDirection}>
+
+
+ setQuery('')}
+ onSubmitQuery={() => {}}
+ />
- }
- />
-
+
+ (
+
+ )}
+ keyboardShouldPersistTaps="handled"
+ containWeb={true}
+ sideBorders={false}
+ style={[a.flex_1]}
+ onEndReached={
+ !query && !screenReaderEnabled ? () => fetchNextPage() : undefined
+ }
+ onEndReachedThreshold={isNative ? 2 : 0.25}
+ ListEmptyComponent={
+
+ {isLoadingResults ? (
+
+ ) : (
+
+
+ Nobody was found. Try searching for someone else.
+
+
+ )}
+
+ }
+ />
+
+
)
}
diff --git a/src/screens/StarterPack/Wizard/index.tsx b/src/screens/StarterPack/Wizard/index.tsx
index 7cee86f840..b0017b5f70 100644
--- a/src/screens/StarterPack/Wizard/index.tsx
+++ b/src/screens/StarterPack/Wizard/index.tsx
@@ -579,9 +579,9 @@ function Footer({
function getName(item: AppBskyActorDefs.ProfileViewBasic | GeneratorView) {
if (typeof item.displayName === 'string') {
- return enforceLen(sanitizeDisplayName(item.displayName), 16, true)
+ return enforceLen(sanitizeDisplayName(item.displayName), 28, true)
} else if (typeof item.handle === 'string') {
- return enforceLen(sanitizeHandle(item.handle), 16, true)
+ return enforceLen(sanitizeHandle(item.handle), 28, true)
}
return ''
}