[MOB-94] Onboarding haptics (#2552)

Onboarding haptics
This commit is contained in:
ameer2468 2024-06-14 19:42:19 +03:00 committed by GitHub
parent b2aab513d2
commit f8ed254a22
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 23 additions and 3 deletions

View file

@ -2,6 +2,7 @@ import { useNavigation, useRoute } from '@react-navigation/native';
import { AppLogo, BloomOne } from '@sd/assets/images';
import SdMobIntro from '@sd/assets/videos/SdMobIntro.mp4';
import { ResizeMode, Video } from 'expo-av';
import * as Haptics from 'expo-haptics';
import { Image } from 'expo-image';
import { MotiView } from 'moti';
import { CaretLeft } from 'phosphor-react-native';
@ -111,7 +112,13 @@ const GetStartedScreen = ({ navigation }: OnboardingStackScreenProps<'GetStarted
</FadeInUpAnimation>
{/* Get Started Button */}
<FadeInUpAnimation delay={1200} style={tw`mt-8`}>
<AnimatedButton variant="accent" onPress={() => navigation.push('NewLibrary')}>
<AnimatedButton
variant="accent"
onPress={() => {
Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
navigation.push('NewLibrary');
}}
>
<Text style={tw`text-center text-base font-medium text-ink`}>Get Started</Text>
</AnimatedButton>
</FadeInUpAnimation>

View file

@ -1,3 +1,4 @@
import * as Haptics from 'expo-haptics';
import { Controller } from 'react-hook-form';
import { Alert, Text, View } from 'react-native';
import { useOnboardingContext } from '~/components/context/OnboardingContext';
@ -12,7 +13,10 @@ import { OnboardingContainer, OnboardingDescription, OnboardingTitle } from './G
const NewLibraryScreen = ({ navigation }: OnboardingStackScreenProps<'NewLibrary'>) => {
const form = useOnboardingContext().forms.useForm('NewLibrary');
const handleNewLibrary = form.handleSubmit(() => navigation.navigate('Privacy'));
const handleNewLibrary = form.handleSubmit(() => {
Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
navigation.navigate('Privacy');
});
const handleImport = () => {
Alert.alert('TODO');

View file

@ -1,3 +1,4 @@
import * as Haptics from 'expo-haptics';
import { ArrowRight } from 'phosphor-react-native';
import React from 'react';
import { Controller } from 'react-hook-form';
@ -80,7 +81,15 @@ const PrivacyScreen = () => {
)}
/>
</View>
<Button variant="accent" size="sm" onPress={form.handleSubmit(submit)} style={tw`mt-6`}>
<Button
variant="accent"
size="sm"
onPress={() => {
Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
form.handleSubmit(submit)();
}}
style={tw`mt-6`}
>
<Text style={tw`text-center text-base font-medium text-ink`}>Continue</Text>
</Button>
<Pressable