diff --git a/src/components/SliderDots.tsx b/src/components/SliderDots.tsx index 795dba69f..8c7f862af 100644 --- a/src/components/SliderDots.tsx +++ b/src/components/SliderDots.tsx @@ -5,7 +5,7 @@ import Animated, { interpolate, useAnimatedStyle, } from 'react-native-reanimated'; -import { View } from '../styles/components'; +import { Pressable } from '../styles/components'; const DOT_SIZE = 7; @@ -13,10 +13,12 @@ const Dot = ({ animValue, index, length, + onPress, }: { index: number; length: number; animValue: SharedValue; + onPress: () => void; }): ReactElement => { const width = DOT_SIZE; @@ -39,9 +41,9 @@ const Dot = ({ }, [animValue, index, length]); return ( - + - + ); }; diff --git a/src/navigation/root/RootNavigator.tsx b/src/navigation/root/RootNavigator.tsx index cdb491dfa..0acf5b2f3 100644 --- a/src/navigation/root/RootNavigator.tsx +++ b/src/navigation/root/RootNavigator.tsx @@ -202,18 +202,10 @@ const RootNavigator = (): ReactElement => { name="ActivityAssignContact" component={ActivityAssignContact} /> - + - + diff --git a/src/screens/Onboarding/Slideshow.tsx b/src/screens/Onboarding/Slideshow.tsx index a16babe17..223b51a6c 100644 --- a/src/screens/Onboarding/Slideshow.tsx +++ b/src/screens/Onboarding/Slideshow.tsx @@ -171,11 +171,15 @@ const Slideshow = ({ return { opacity }; }, [slides.length, progressValue]); + const scrollToSlide = (index: number): void => { + ref.current?.scrollTo({ index, animated: true }); + }; + const onHeaderButton = (): void => { if (isLastSlide) { navigation.navigate('Passphrase'); } else { - ref.current?.scrollTo({ index: slides.length - 1, animated: true }); + scrollToSlide(slides.length - 1); } }; @@ -241,13 +245,16 @@ const Slideshow = ({ - + {slides.map((_, i) => ( scrollToSlide(i)} /> ))} diff --git a/src/screens/Profile/Profile.tsx b/src/screens/Profile/Profile.tsx index 9f066e2ad..31b38c951 100644 --- a/src/screens/Profile/Profile.tsx +++ b/src/screens/Profile/Profile.tsx @@ -13,9 +13,7 @@ import { StyleSheet, View, useWindowDimensions } from 'react-native'; import QRCode from 'react-native-qrcode-svg'; import { FadeIn, FadeOut } from 'react-native-reanimated'; import Share from 'react-native-share'; -import { useAppSelector } from '../../hooks/redux'; -import DetectSwipe from '../../components/DetectSwipe'; import Divider from '../../components/Divider'; import NavigationHeader from '../../components/NavigationHeader'; import ProfileCard from '../../components/ProfileCard'; @@ -24,6 +22,7 @@ import ProfileLinks from '../../components/ProfileLinks'; import SafeAreaInset from '../../components/SafeAreaInset'; import Tooltip from '../../components/Tooltip'; import IconButton from '../../components/buttons/IconButton'; +import { useAppSelector } from '../../hooks/redux'; import { useProfile, useSlashtags } from '../../hooks/slashtags'; import type { RootStackScreenProps } from '../../navigation/types'; import { onboardingProfileStepSelector } from '../../store/reselect/slashtags'; @@ -45,11 +44,11 @@ const Profile = memo((props: RootStackScreenProps<'Profile'>): ReactElement => { switch (onboardingProfileStep) { case 'Intro': - return ; + return ; case 'InitialEdit': return ; case 'OfflinePayments': - return ; + return ; default: return ; } @@ -66,10 +65,6 @@ const ProfileScreen = ({ const [showCopy, setShowCopy] = useState(false); const [isSharing, setIsSharing] = useState(false); - const onSwipeLeft = (): void => { - navigation.popToTop(); - }; - const handleCopy = useCallback((): void => { setShowCopy(() => true); setTimeout(() => setShowCopy(() => false), 1200); @@ -112,56 +107,54 @@ const ProfileScreen = ({ onActionPress={(): void => navigation.navigate('Contacts')} /> - - - - - - - - - - - - { - navigation.navigate('ProfileEdit'); - }}> - - - - - - {showCopy && ( - - - - )} - - - - - + + + + + + + + + + + { + navigation.navigate('ProfileEdit'); + }}> + + + + + + {showCopy && ( + + + + )} + + + + ); }; diff --git a/src/screens/Profile/ProfileOnboarding.tsx b/src/screens/Profile/ProfileOnboarding.tsx index 589a30d63..2546947c8 100644 --- a/src/screens/Profile/ProfileOnboarding.tsx +++ b/src/screens/Profile/ProfileOnboarding.tsx @@ -1,4 +1,3 @@ -import { NativeStackNavigationProp } from '@react-navigation/native-stack'; import React, { memo, ReactElement, @@ -8,17 +7,12 @@ import React, { } from 'react'; import { Trans, useTranslation } from 'react-i18next'; import { Image, ImageSourcePropType, StyleSheet, View } from 'react-native'; -import { useAppDispatch, useAppSelector } from '../../hooks/redux'; -import DetectSwipe from '../../components/DetectSwipe'; import NavigationHeader from '../../components/NavigationHeader'; import SafeAreaInset from '../../components/SafeAreaInset'; import SwitchRow from '../../components/SwitchRow'; import Button from '../../components/buttons/Button'; -import type { - RootStackParamList, - RootStackScreenProps, -} from '../../navigation/types'; +import { useAppDispatch, useAppSelector } from '../../hooks/redux'; import { selectedNetworkSelector, selectedWalletSelector, @@ -33,35 +27,30 @@ import { updateSlashPayConfig } from '../../utils/slashtags'; const crownImageSrc = require('../../assets/illustrations/crown.png'); const coinsImageSrc = require('../../assets/illustrations/coin-stack.png'); -export const ProfileIntro = memo( - ({ navigation }: RootStackScreenProps<'Profile'>): ReactElement => { - const { t } = useTranslation('slashtags'); +export const ProfileIntro = memo((): ReactElement => { + const { t } = useTranslation('slashtags'); - return ( - - - }} - /> - - - {t('onboarding_profile1_text')} - - - ); - }, -); + return ( + + + }} + /> + + + {t('onboarding_profile1_text')} + + + ); +}); -export const OfflinePayments = ({ - navigation, -}: RootStackScreenProps<'Profile'>): ReactElement => { +export const OfflinePayments = (): ReactElement => { const { t } = useTranslation('slashtags'); const dispatch = useAppDispatch(); const selectedWallet = useAppSelector(selectedWalletSelector); @@ -75,7 +64,6 @@ export const OfflinePayments = ({ return ( ; illustration: ImageSourcePropType; nextStep: TSlashtagsState['onboardingProfileStep']; buttonText: string; @@ -124,34 +110,28 @@ const Layout = memo( }): ReactElement => { const dispatch = useAppDispatch(); - const onSwipeLeft = (): void => { - navigation.popToTop(); - }; - return ( - - - - - - {children} - -