[HOLD for payment 2024-03-14] [$500] [MEDIUM] Smartscan: Show PDF receipt thumbnails

@sobitneupane

Coming from here. CC: @sobitneupane @pradeepmdk @Gonals

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.3.98-5
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: @trjExpensify
Slack conversation: #30747 (comment)

Action Performed:

Request Money > Scan > Upload a PDF receipt > choose a participant
Observe there isn't a preview of the PDF receipt in the thumbnail on the confirmation page
Click confirm to create the request
Observe there isn't a preview of the PDF receipt in the thumbnail on the report preview component in the chat
Click the report preview component
Observe there isn't a preview of the PDF receipt in the thumbnail on the request preview component in the expense/iouReport
Click the request preview component
Observe there isn't a preview of the PDF receipt in the thumbnail on the receipt preview component in the request view

Expected Result:

PDF receipts should show a preview in the relevant thumbnails throughout the app.

P.s this also includes in the split preview component, so let's make sure it works there.

Actual Result:

Generic "empty" thumbnail previews are displayed for PDF receipts.

Workaround:

Yes, they can tap the thumbnail to see the PDF but they'd really not know to do that.

Platforms:

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

Screenshots/Videos

Confirmation screen:

Report preview on the chat:

Request preview on the expense/iouReport:

Receipt preview on the request:

View all open jobs on GitHub

Upwork Automation - Do Not Edit

Upwork Job URL: https://www.upwork.com/jobs/~01f90fbd2f6a7c49f2
Upwork Job ID: 1725113274629943296
Last Price Increase: 2023-11-23

@trjExpensify

Current assignee @trjExpensify is eligible for the Bug assigner, not assigning anyone new.

Job added to Upwork: https://www.upwork.com/jobs/~01f90fbd2f6a7c49f2

Bug0 Triage Checklist (Main S/O)

This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
This bug is not a duplicate report (check E/App issues and #expensify-bugs)
- If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
This bug is reproducible using the reproduction steps in the OP. S/O
- If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
- If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
This issue is filled out as thoroughly and clearly as possible
- Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

@0xmiroslav

Triggered auto assignment to Contributor-plus team member for initial proposal review - @0xmiroslav (External)

Proposal

Please re-state the problem that we are trying to solve in this issue.

Show PDF receipt thumbnails

What is the root cause of that problem?

We're getting thumbnail for receipt here

App/src/libs/ReceiptUtils.ts

Line 31 in 69a3358

    
           function getThumbnailAndImageURIs(transaction: Transaction, receiptPath: string | null = null, receiptFileName: string | null = null): ThumbnailAndImageURI {

We do not have the logic to get the thumbnail of pdf

-> Default image is shown

What changes do you think we should make in order to solve the problem?

We can lean on the source to get the thumbnail for pdf.

Here's the sample source https://www.expensify.com/receipts/{id}.pdf -> the thumbnail should be https://www.expensify.com/receipts/{id}.jpg.1024.jpg

    const isReceiptPDF = Str.isPDF(filename);
...

 if(isReceiptPDF){
            return {thumbnail: `${path.substring(0, path.length-4)}.jpg.1024.jpg`, image: path};
        }

What alternative solutions did you explore? (Optional)

BE will return the thumbnail and use it to shown on FE side

Result

Screen.Recording.2023-11-16.at.18.56.52.mov

@s77rt

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:

[@s77rt / @eh2077] The PR that introduced the bug has been identified. Link to the PR:
[@s77rt / @eh2077] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
[@s77rt / @eh2077] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
[@s77rt / @eh2077] Determine if we should create a regression test for this bug.
[@s77rt / @eh2077] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
[@trjExpensify] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

The PR that introduced the bug has been identified: Not a a bug. This is a feature request
The offending PR has been commented on: n/a
A discussion in #expensify-bugs has been started: n/a
Determine if we should create a regression test for this bug: Yes

Regression Test Proposal

Go to any chat and request money
Choose Scan tab and upload a pdf file
Verify that you're able to preview the PDF receipt in the confirmation page
Complete the money request process
Verify that you're able to preview the PDF receipt in the chat report
Click on the PDF preview
Verify that you're able to preview the PDF receipt in the IOU report
Click on the PDF preview
Verify that you're able to preview the PDF receipt in the money request report
Click on the PDF preview
Verify that you are displayed the PDF file

@trjExpensify

Hi @trjExpensify

Considering the added time and complexity of completing this task, could we discuss the possibility of a bonus for me and C+ @s77rt ?

We have completed several tasks in this new feature, including displaying local PDFs, detecting password-protected PDFs, and refining translations.

It would be great to have it but it’s also fine if not :)

@s77rt

Payment Summary

Upwork Job

C+: @s77rt paid $500 via Upwork
Contributor: @eh2077 paid $500 via Upwork

BugZero Checklist (@trjExpensify)

I have verified the correct assignees and roles are listed above and updated the neccesary manual offers
I have verified that there are no duplicate or incorrect contracts on Upwork for this job (https://www.upwork.com/ab/applicants/1725113274629943296/hired)
I have paid out the Upwork contracts or cancelled the ones that are incorrect
I have verified the payment summary above is correct

@eh2077

Hey @eh2077, thanks for the request. I agree the scope of this issue increased to encompass password-protected PDFs and updating the file type modal. I've added a bonus and sent you both offers for $750.

@trjExpensify

@trjExpensify We had a regression #37852. Should the payment here be $375 in that case?

Ah, I didn't see that. Okay cool, so then I'm fine with keeping the bounty at $500 and not reducing for that regression. Once you guys accept the offers, I'll pay a different amount. 👍

@trjExpensify

@trjExpensify Accepted! Thank you!

Paid both of you, thanks!

Navigation Menu

Repository navigation

[HOLD for payment 2024-03-14] [$500] [MEDIUM] Smartscan: Show PDF receipt thumbnails #31432

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

Bug0 Triage Checklist (Main S/O)

Proposal

Please re-state the problem that we are trying to solve in this issue.

What is the root cause of that problem?

What changes do you think we should make in order to solve the problem?

What alternative solutions did you explore? (Optional)

Result

205 remaining items

Payment Summary

BugZero Checklist (@trjExpensify)

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

[HOLD for payment 2024-03-14] [$500] [MEDIUM] Smartscan: Show PDF receipt thumbnails #31432

Description

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

Activity

melvin-bot commented on Nov 16, 2023

melvin-bot commented on Nov 16, 2023

melvin-bot commented on Nov 16, 2023

Bug0 Triage Checklist (Main S/O)

melvin-bot commented on Nov 16, 2023

tienifr commented on Nov 16, 2023

Proposal

Please re-state the problem that we are trying to solve in this issue.

What is the root cause of that problem?

What changes do you think we should make in order to solve the problem?

What alternative solutions did you explore? (Optional)

Result

205 remaining items

melvin-bot commented on Mar 7, 2024

s77rt commented on Mar 8, 2024

eh2077 commented on Mar 12, 2024

melvin-bot commented on Mar 14, 2024

Payment Summary

BugZero Checklist (@trjExpensify)

trjExpensify commented on Mar 15, 2024

s77rt commented on Mar 15, 2024

trjExpensify commented on Mar 15, 2024

s77rt commented on Mar 15, 2024

trjExpensify commented on Mar 18, 2024

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions