[HOLD for payment 2021-11-09] Reduce the haptic feedback vibration to a short bip

[isagoico]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

Upwork posting: https://www.upwork.com/jobs/~0105c031baf3dfd3df

---

Action Performed:

1. Navigate to a conversation in mobile
2. Press and hold on a message

Expected Result:

There should be a short blip of vibration.

Actual Result:

Current vibration is longer that it should be.

To achieve the desired result, we should:

1. Update our app to use react-native-haptic-feedback
2. Fork the library, and update the forked lib to have the same vibration as slack does when selecting messages
3. Once the PR is merged into our codebase, create a PR upstream so that the functionality can be merged into react-native-haptic-feedback

Workaround:

N/A

Platform:

Where is this issue occurring?

• iOS
• Android

Version Number: 1.0.82-0

Logs: https://stackoverflow.com/c/expensify/questions/4856

Notes/Photos/Videos: Any additional supporting documentation

Expensify/Expensify Issue URL:

View all open jobs on Upwork

---

From @quinthar https://expensify.slack.com/archives/C01GTK53T8Q/p1627669368027700

I love the new haptic feedback when you long tap on mobile. However, it uses a kind of strange vibration. Can we match the same vibration that slack uses with long tap? It's just a incredibly short blip.

[MelvinBot]

Triggered auto assignment to @pecanoro (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[MelvinBot]

Triggered auto assignment to @Jag96 (External), see https://stackoverflow.com/c/expensify/questions/8582 for more details.

[Jag96]

It looks like there's some more context on this issue in this slack thread. cc @rushatgabhane since you had some good thoughts here.

[rushatgabhane]

@Jag96 I'm not able to find any npm package which matches the short blip of Slack.

However, I can get the exact haptic feedback as Slack's using native code for Android.

Here are our options for adding native code.

1. Directly into New Expensify using NativeModules.
2. Create a new npm package.

Which one do you prefer?

Alternatively, we could settle for a shorter duration of the strange vibration using rn-haptic-feedback.

[Jag96]

We've used NativeModules before here so I think that would be fine, but I'd reply to the thread in slack (and send to the main channel as well by ticking Also send to expensify-open-source) just to see if anybody has any opinions.

And just to confirm, using NativeModules would you just override the index.android.js functionality and continue using the current lib for iOS?

[rushatgabhane]

And just to confirm, using NativeModules would you just override the index.android.js functionality and continue using the current lib for iOS?

No. I won't using the current lib (expo-haptics) at all.
NativeModules will be used for both iOS and Android.

[rushatgabhane]

Update from slack thread

We decided to add bip() method to Vibration API by creating a PR for React Native.

I won't be available for a few weeks. So I won't be taking this issue.
But here are things that might help with implementation.

Android: Vibrate(createPredefined(VibrationEffect.EFFECT_CLICK))
iOS: Selection

Correction: bip() not blip()

[quinthar]

Tiny thing: I vote naming the API call "bip" instead of "blip". When you say it out loud, "bip" is closer to the actual vibrate we're going for.

…

On Tue, Aug 3, 2021 at 1:34 PM Rushat Gabhane ***@***.***> wrote: Update from slack thread <https://expensify.slack.com/archives/C01GTK53T8Q/p1627669368027700> We decided to add blip() method to Vibration <https://reactnative.dev/docs/vibration> API by creating a PR for React Native. I won't be available for a few weeks. So I won't be taking this issue. But here are things that might help with implementation. Android: Vibrate(createPredefined(VibrationEffect.EFFECT_CLICK)) iOS: Selection <https://developer.apple.com/design/human-interface-guidelines/ios/user-interaction/haptics/> — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#4355 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAEMNURFQSCEDCPEFWASKN3T3BHD7ANCNFSM5BLKL4VA> . Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&utm_campaign=notification-email> .

[MelvinBot]

@Jag96 Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[arpitdeveloper]

In this case we add the code

{<TouchableOpacity
         
         onLongPress={() => Vibration.vibrate(1 * ONE_SECOND_IN_MS)}
     >
....
</TouchableOpacity>}

in InvertedFlatList in "/src/pages/home/report/ReportActionsView.js"

[chira37]

change src\components\PressableWithSecondaryInteraction\index.native.js

import {Vibration} from 'react-native';

<Pressable
...
        onLongPress={(e) => {
            e.preventDefault();
            Vibration.vibrate(20);
            props.onSecondaryInteraction(e);   
        }}
...
    >
        {props.children}
    </Pressable> ````

in src\components\PressableWithSecondaryInteraction

it will reduce time from 50 (with haptics library) millisecond to 20 millisecond

[Jag96]

@arpitdeveloper @chira37 please see the description of this issue for the desired implementation:

To achieve the desired result, we should:

1. Update the Vibration lib in our react native fork to add a new function bip that will use the shortest, strongest vibration possible (see slack thread)
2. Once the PR is merged, create a PR upstream so that the functionality can be merged into React Native's Vibration library

[silverfoxgit]

We can reduce the time of vibration.
This is possible in React Native.

[Jag96]

Still held on n6, clearing overdue label

[Jag96]

Still held on n6

[kadiealexander]

Please refer to this post for updated information on the n6 hold, we've raised the bonus to $250 for all issues where a PR is created before the N6 hold is lifted.

[rushatgabhane]

@Jag96 should I submit a PR to NewDot?

--
I've taken the liberty to add new methods to rn-haptic-feedback (like effectClick, effectHeavyClick etc).
And also made the code more modular. PR link

I hoped that my PR to rn-haptic-feedback would have been merged by now.
But there has been no reply on it for 4 weeks.

Is there anything that I can do to get it merged faster?
Should I email a maintainer?

[Jag96]

@rushatgabhane this is still on n6-hold, and we'll need to create an Expensify fork of rn-haptic-feedback first for this where you can then submit a PR, so I think we can hold for now. If the n6-hold label comes off and the PR still hasn't been reviewed in the rn-haptic-feedback repo then we can get that repo forked by Expensify, have you create a PR on the Expensify fork, get it reviewed/tested, and then make a PR in NewDot to use that fork in our package.json.

Going to assign you the issue here, re-create the Upwork posting since it looks like it expired, and hire you for the job.

Since there hasn't been any reply for a bit I think it's fine to email the maintainer to see if they missed it, you can also try requesting a review from mkuczera (and tagging them in the PR description) since it looks like they have reviewed many of the more recent PRs merged to the repo.

[rushatgabhane]

Got it, thanks!

[Jag96]

Removed the n6-hold label and created an internal ticket to get the repo forked. @rushatgabhane once the repo is forked I'll post the URL here so you can create your PR against it!

[Jag96]

@rushatgabhane the fork can be located here: https://github.com/Expensify/react-native-haptic-feedback. Please create your PR there! You can then create a draft PR in Expensify/App that has the changes required and points to your latest commit on your Expensify/react-native-haptic-feedback PR so we can test the changes that way.

[rushatgabhane]

Hi Joe!
My PR for adding new haptic methods got merged into junina-de/react-native-haptic-feedback.

So I created a new draft PR (5960) which uses it, and fixes this issue.

Expensify's fork of rn-haptic-feedback isn't needed now.

[Jag96]

@rushatgabhane sounds good, once the Expensify/App PR is merged I'll go ahead and remove the unneeded repo

[botify]

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.1.12-3 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Fix - Reduce the haptic feedback vibration to a short bip #5960

If no regressions arise, payment will be issued on 2021-11-09. 🎊

[Jag96]

Paid, including n6 hold bonus!

[rushatgabhane]

Thanks a ton!