diff --git a/src/screens/Settings/Settings.tsx b/src/screens/Settings/Settings.tsx index 126a1bc88e..02d4071957 100644 --- a/src/screens/Settings/Settings.tsx +++ b/src/screens/Settings/Settings.tsx @@ -1,7 +1,14 @@ -import {useState} from 'react' +import {useMemo, useState} from 'react' import {LayoutAnimation, Pressable, View} from 'react-native' import {Linking} from 'react-native' -import {useReducedMotion} from 'react-native-reanimated' +import {Gesture, GestureDetector} from 'react-native-gesture-handler' +import Animated, { + runOnJS, + useAnimatedStyle, + useReducedMotion, + useSharedValue, + withSpring, +} from 'react-native-reanimated' import {AppBskyActorDefs, moderateProfile} from '@atproto/api' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' @@ -10,6 +17,7 @@ import {NativeStackScreenProps} from '@react-navigation/native-stack' import {IS_INTERNAL} from '#/lib/app-info' import {HELP_DESK_URL} from '#/lib/constants' +import {useHaptics} from '#/lib/haptics' import {useAccountSwitcher} from '#/lib/hooks/useAccountSwitcher' import {CommonNavigatorParams, NavigationProp} from '#/lib/routes/types' import {sanitizeHandle} from '#/lib/strings/handles' @@ -78,6 +86,7 @@ export function SettingsScreen({}: Props) { + Gesture.Pan() + .activateAfterLongPress(1000) + .onStart(() => { + 'worklet' + runOnJS(playHaptic)() + }) + .onUpdate(evt => { + 'worklet' + translateX.set(evt.translationX) + translateY.set(evt.translationY) + }) + .onEnd(() => { + 'worklet' + translateX.set(withSpring(0)) + translateY.set(withSpring(0)) + }), + [playHaptic, translateX, translateY], + ) + + const animatedStyle = useAnimatedStyle(() => { + return { + transform: [ + {translateX: translateX.get()}, + {translateY: translateY.get()}, + ], + } + }) if (!moderationOpts) return null @@ -272,11 +315,15 @@ function ProfilePreview({ return ( <> - + + + + +