search

Expensify / App

Welcome to New Expensify: a complete re-imagination of financial collaboration, centered around chat. Help us build the next generation of Expensify by sharing feedback and contributing to the code.
https://new.expensify.com
MIT License
3.56k stars 2.9k forks source link

[HOLD for payment 2024-07-22] [HOLD for payment 2024-07-17] [$1000] mWeb - Chat – Unable to zoom the image with pinching #36597

Closed kbecciv closed 4 months ago

kbecciv commented 9 months ago

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Version Number: v1.4.42-1 Reproducible in staging?: y Reproducible in production?: y If this was caught during regression testing, add the test name, ID and link from TestRail: Email or phone of affected tester (no customers): Logs: https://stackoverflow.com/c/expensify/questions/4856 Expensify/Expensify Issue URL: Issue reported by: Applause - Interna; Team Slack conversation:

Issue found when executing PR https://github.com/Expensify/App/pull/34080

Action Performed:

  1. Go to https://staging.new.expensify.com/
  2. Login
  3. Go to a report with attachments
  4. Open an (image) attachment
  5. Check that image gestures/transformations are working (pinching)

Expected Result:

Able to zoom the image with pinching

Actual Result:

Unable to zoom the image with pinching

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

Screenshots/Videos

Add any screenshot/video evidence

https://github.com/Expensify/App/assets/93399543/ce464be6-14ca-4d7a-a2eb-598f8ae21ba6

View all open jobs on GitHub

Upwork Automation - Do Not Edit
  • Upwork Job URL: https://www.upwork.com/jobs/~016170309acaa20014
  • Upwork Job ID: 1758158238713884672
  • Last Price Increase: 2024-06-04
  • Automatic offers:
    • situchan | Contributor | 0
    • dukenv0307 | Reviewer | 102684851
    • ZhenjaHorbach | Contributor | 102711497
Issue OwnerCurrent Issue Owner: @dukenv0307
dukenv0307 commented 6 months ago

@jsdev2547 Do you mind to update the proposal?

melvin-bot[bot] commented 6 months ago

@laurenreidexpensify, @dukenv0307 Whoops! This issue is 2 days overdue. Let's get this updated quick!

laurenreidexpensify commented 6 months ago

Still working through solutions

melvin-bot[bot] commented 6 months ago

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

dukenv0307 commented 5 months ago

Will give an update in a hour

dukenv0307 commented 5 months ago

@jscoder2151

Can you pls test your branch and upload the evidence about your fix? I faced with the error when I drag image

https://github.com/Expensify/App/assets/129500732/4c998baa-5690-4b40-a82f-510d7e8b16a3

dukenv0307 commented 5 months ago

can you share your video test? @jscoder2151

dukenv0307 commented 5 months ago

Did you try with the large image (screenshot full desktop screen)? @jscoder2151

It did not work on my side. I can't zoom the image a bit and after zooming I cannot drag it

https://github.com/Expensify/App/assets/129500732/c9f6a1b3-17ae-4119-841e-87c7ac65d6aa

laurenreidexpensify commented 5 months ago

Still working through proposals

melvin-bot[bot] commented 5 months ago

@laurenreidexpensify, @dukenv0307 Whoops! This issue is 2 days overdue. Let's get this updated quick!

dukenv0307 commented 5 months ago

@jscoder2151 any updates?

laurenreidexpensify commented 5 months ago

Still working through proposals

melvin-bot[bot] commented 5 months ago

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

dukenv0307 commented 5 months ago

Waiting for more proposals

ghost commented 5 months ago

@dukenv0307 I have resolved the issue with large image when zooming the image would not zoom and then not pan. Also revised branch.

android-web.webm

badeggg commented 5 months ago

Maybe I'll update my proposal soon, just maybe...

laurenreidexpensify commented 5 months ago

Still waiting / working through proposals

dukenv0307 commented 5 months ago

Thanks @jscoder2151. I'll verify your proposal in a few hours

badeggg commented 5 months ago

Hi, I have updated my proposal

Hi, I have added my proposal. Since my previous proposal is in the default fold section of this web page, I add a new one instead of updating it.

dukenv0307 commented 5 months ago

@jscoder2151 Nice work. We almost get it done. Some minor feedbacks before I can accept your proposal

  1. We should not zoom out the image to be invisible.
  2. After zoom in, we should not drag the image out of its box

https://github.com/Expensify/App/assets/129500732/29d95b9c-568a-49a2-96c8-326bd9252eb8

laurenreidexpensify commented 5 months ago

Still waiting to finalise proposals

melvin-bot[bot] commented 5 months ago

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

dukenv0307 commented 5 months ago

@jscoder2151 I see your video above, we still can drag the image out of its box. Is it correct?

Screenshot 2024-06-07 at 09 50 41
dukenv0307 commented 5 months ago

@jscoder2151 pls check the video below. On native, we can't drag the zoomed image out of the box

https://github.com/Expensify/App/assets/129500732/5aa3d016-41d7-4846-b49f-81c6591a53d4

laurenreidexpensify commented 5 months ago

Still waiting to finalise proposals

dukenv0307 commented 5 months ago

but I can use the spring effect along x and y axis so the the zoomed image moves back in the box using spring effect

Nice, can you update the branch for that? Thanks @jscoder2151

laurenreidexpensify commented 5 months ago

Still waiting to finalise proposals

dukenv0307 commented 5 months ago

Thanks @jscode2151 for your patience. It looks nice. Let's go with your solution

🎀👀🎀 C+ reviewed

melvin-bot[bot] commented 5 months ago

Triggered auto assignment to @flodnv, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

melvin-bot[bot] commented 5 months ago

📣 @dukenv0307 🎉 An offer has been automatically sent to your Upwork account for the Reviewer role 🎉 Thanks for contributing to the Expensify app!

Offer link Upwork job

melvin-bot[bot] commented 5 months ago

📣 @jscoder2151 You have been assigned to this job! Please apply to the Upwork job and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻 Once you apply to this job, your Upwork ID will be stored and you will be automatically hired for future jobs! Keep in mind: Code of Conduct | Contributing 📖

laurenreidexpensify commented 5 months ago

@dukenv0307 @jscoder2151 updated upwork link - https://www.upwork.com/jobs/~012edca6feab8f4800

ZhenjaHorbach commented 5 months ago

I can take over as the contributor !

For more context Came from this thread https://expensify.slack.com/archives/C02NK2DQWUX/p1715341830418119

melvin-bot[bot] commented 5 months ago

📣 @ZhenjaHorbach 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link Upwork job Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻 Keep in mind: Code of Conduct | Contributing 📖

ZhenjaHorbach commented 5 months ago

@mallenexpensify Thank you 😀

PR will be ready today or tomorrow If you don't mind I want to spend some time investigating the issue and the chosen proposal.

dukenv0307 commented 5 months ago

@badeggg In the PR phase, the author used LightBox as you suggested before. I also test your mention here

Unable to make FlatList to be part of react-native-gesture-handler's gesture system. That's why we can't swipe to switch after change Image to Lightbox, like this I have tried every possible way I can imagine. So we have to do scrolling by self

I still can swipe

https://github.com/Expensify/App/assets/129500732/3b0d1e2d-30b0-44f2-8bc6-e26e008a2acd

manualActivation(true) of Gesture.Pan() not working on mWeb

how can we verify that?

double tap .numberOfTaps(2) not working on chrome for iOS, does work on safari on iOS

@ZhenjaHorbach Can you check the bug on chrome iOS?

react-native-gesture-handler@2.14.1 may not reporting 'allTouches' when onTouchesMove correctly on mWeb, stale touch may exist.

Can you elaborate more?

badeggg commented 5 months ago

If the bug I noticed does not exist any more, maybe it's because dependency version updating.

And, just curious, why the assigned contributor is not the one who proposed the c+ accepted proposal.

ZhenjaHorbach commented 5 months ago

@badeggg In the PR phase, the author used LightBox as you suggested before. I also test your mention here

Unable to make FlatList to be part of react-native-gesture-handler's gesture system. That's why we can't swipe to switch after change Image to Lightbox, like this I have tried every possible way I can imagine. So we have to do scrolling by self

I still can swipe

Screen.Recording.2024-06-18.at.10.15.51.mov

manualActivation(true) of Gesture.Pan() not working on mWeb

how can we verify that?

double tap .numberOfTaps(2) not working on chrome for iOS, does work on safari on iOS

@ZhenjaHorbach Can you check the bug on chrome iOS?

react-native-gesture-handler@2.14.1 may not reporting 'allTouches' when onTouchesMove correctly on mWeb, stale touch may exist.

Can you elaborate more?

Actually yes, the bug exists double tap.numberOfTaps(2) is working on chrome for iOS but very strange and unexpectedly For the zoom to work we need to click 3 or 4 times So I will update the PR today or tomorrow

melvin-bot[bot] commented 4 months ago

Reviewing label has been removed, please complete the "BugZero Checklist".

melvin-bot[bot] commented 4 months ago

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

If no regressions arise, payment will be issued on 2024-07-17. :confetti_ball:

For reference, here are some details about the assignees on this issue:

melvin-bot[bot] commented 4 months ago

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

melvin-bot[bot] commented 4 months ago

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

If no regressions arise, payment will be issued on 2024-07-22. :confetti_ball:

For reference, here are some details about the assignees on this issue:

melvin-bot[bot] commented 4 months ago

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

mallenexpensify commented 4 months ago

Contributor: @ZhenjaHorbach paid $1000 via Upwork Contributor+: @dukenv0307 paid $1000 via Upwork.

@dukenv0307 plz complete the BZ checklist above.

dukenv0307 commented 4 months ago

BugZero Checklist:

Regression tests:

  1. Open reports with attachments on mobile web.
  2. Open image attachment.
  3. Verify image can be dragged and zoomed using pan and pinch gestures.

Do we 👍 or 👎

mallenexpensify commented 4 months ago

Thanks @dukenv0307 TestRail update