Haptic on profile buttons (#6034)

* play haptic on profile buttons

* change react import

src/screens/Profile/Header/ProfileHeaderLabeler.tsx

@@ -1,4 +1,4 @@
-import React, {memo, useMemo} from 'react'
+import {memo, useCallback, useMemo, useState} from 'react'
 import {View} from 'react-native'
 import {
   type AppBskyActorDefs,
@@ -84,12 +84,10 @@ let ProfileHeaderLabeler = ({
   const {mutateAsync: likeMod, isPending: isLikePending} = useLikeMutation()
   const {mutateAsync: unlikeMod, isPending: isUnlikePending} =
     useUnlikeMutation()
-  const [likeUri, setLikeUri] = React.useState<string>(
-    labeler.viewer?.like || '',
-  )
-  const [likeCount, setLikeCount] = React.useState(labeler.likeCount || 0)
+  const [likeUri, setLikeUri] = useState<string>(labeler.viewer?.like || '')
+  const [likeCount, setLikeCount] = useState(labeler.likeCount || 0)
 
-  const onToggleLiked = React.useCallback(async () => {
+  const onToggleLiked = useCallback(async () => {
     if (!labeler) {
       return
     }
@@ -118,44 +116,44 @@ let ProfileHeaderLabeler = ({
 
   const editProfileControl = useDialogControl()
 
-  const onPressSubscribe = React.useCallback(
-    () =>
-      requireAuth(async (): Promise<void> => {
-        const subscribe = !isSubscribed
+  const onPressSubscribe = useCallback(() => {
+    requireAuth(async (): Promise<void> => {
+      playHaptic()
+      const subscribe = !isSubscribed
 
-        try {
-          await toggleSubscription({
-            did: profile.did,
-            subscribe,
-          })
+      try {
+        await toggleSubscription({
+          did: profile.did,
+          subscribe,
+        })
 
-          logger.metric(
-            subscribe
-              ? 'moderation:subscribedToLabeler'
-              : 'moderation:unsubscribedFromLabeler',
-            {},
-            {statsig: true},
-          )
-        } catch (e: any) {
-          reset()
-          if (e.message === 'MAX_LABELERS') {
-            cantSubscribePrompt.open()
-            return
-          }
-          logger.error(`Failed to subscribe to labeler`, {message: e.message})
+        logger.metric(
+          subscribe
+            ? 'moderation:subscribedToLabeler'
+            : 'moderation:unsubscribedFromLabeler',
+          {},
+          {statsig: true},
+        )
+      } catch (e: any) {
+        reset()
+        if (e.message === 'MAX_LABELERS') {
+          cantSubscribePrompt.open()
+          return
         }
-      }),
-    [
-      requireAuth,
-      toggleSubscription,
-      isSubscribed,
-      profile,
-      cantSubscribePrompt,
-      reset,
-    ],
-  )
+        logger.error(`Failed to subscribe to labeler`, {message: e.message})
+      }
+    })
+  }, [
+    playHaptic,
+    requireAuth,
+    toggleSubscription,
+    isSubscribed,
+    profile,
+    cantSubscribePrompt,
+    reset,
+  ])
 
-  const isMe = React.useMemo(
+  const isMe = useMemo(
     () => currentAccount?.did === profile.did,
     [currentAccount, profile],
   )

src/screens/Profile/Header/ProfileHeaderStandard.tsx

@@ -10,6 +10,7 @@ import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 
 import {useActorStatus} from '#/lib/actor-status'
+import {useHaptics} from '#/lib/haptics'
 import {sanitizeDisplayName} from '#/lib/strings/display-names'
 import {sanitizeHandle} from '#/lib/strings/handles'
 import {logger} from '#/logger'
@@ -79,12 +80,14 @@ let ProfileHeaderStandard = ({
     profile.viewer?.blocking ||
     profile.viewer?.blockedBy ||
     profile.viewer?.blockingByList
+  const playHaptic = useHaptics()
 
   const editProfileControl = useDialogControl()
 
   const onPressFollow = () => {
-    setShowSuggestedFollows(true)
+    playHaptic()
     requireAuth(async () => {
+      setShowSuggestedFollows(true)
       try {
         await queueFollow()
         Toast.show(
@@ -105,6 +108,7 @@ let ProfileHeaderStandard = ({
   }
 
   const onPressUnfollow = () => {
+    playHaptic()
     setShowSuggestedFollows(false)
     requireAuth(async () => {
       try {
@@ -127,6 +131,7 @@ let ProfileHeaderStandard = ({
   }
 
   const unblockAccount = useCallback(async () => {
+    playHaptic()
     try {
       await queueUnblock()
       Toast.show(_(msg({message: 'Account unblocked', context: 'toast'})))
@@ -136,7 +141,7 @@ let ProfileHeaderStandard = ({
         Toast.show(_(msg`There was an issue! ${e.toString()}`), 'xmark')
       }
     }
-  }, [_, queueUnblock])
+  }, [_, queueUnblock, playHaptic])
 
   const isMe = useMemo(
     () => currentAccount?.did === profile.did,