[On Hold #44778] Submit Expense - Inconsistent Error Messages for Password Protected PDFs on Mweb and Android

@s77rt

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: 1.4.86-0
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Email or phone of affected tester (no customers): abebemiherat@gmail.com
Issue reported by: Applause - Internal Team

Action Performed:

On Android: Sign in with Expensify > FAB > Submit Expense
Add an amount and attach a password-protected PDF
On Mweb: Repeat the above steps
Observe the error messages

Expected Result:

The error message should be consistent for the same password-protected PDF across both platforms

Actual Result:

Different error messages appear for password-protected PDFs on Mweb and Android

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Add any screenshot/video evidence

Bug6519420_1718889532550.ju.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

Upwork Job URL: https://www.upwork.com/jobs/~01a71dc36f6e73ac8e
Upwork Job ID: 1806742272201940772
Last Price Increase: 2024-07-05

Issue Owner

Current Issue Owner: @s77rt

@CortneyOfstad

Triggered auto assignment to @CortneyOfstad (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

@CortneyOfstad

@CortneyOfstad FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

Proposal

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

Submit Expense - Inconsistent Error Messages for Password Protected PDFs on Mweb and Android

What is the root cause of that problem?

The error title is wrong attachmentPicker.wrongFileType.

App/src/pages/iou/request/step/IOURequestStepScan/index.tsx

Line 219 in f618a94

    
           setUploadReceiptError(true, 'attachmentPicker.wrongFileType', 'attachmentPicker.protectedPDFNotSupported');

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

We should be using attachmentPicker.attachmentError.

What alternative solutions did you explore? (Optional)

Proposal

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

Inconsistent Error Messages for Password Protected PDFs on Mweb and Android

What is the root cause of that problem?

The root cause is that we are handling errors concerning password protected pdf files for native apps in MoneyRequestConfirmationList. That is because password protected pdf error is not caught by the validation put in IOURequestStepScan for native devices. Hence 'Attachment error' message is displayed because of the default error key attachmentPicker.attachmentError put in MoneyRequestConfirmationList

App/src/components/MoneyRequestConfirmationList.tsx

Lines 1237 to 1238 in f618a94

    
           <ConfirmModal 
        
               title={translate('attachmentPicker.attachmentError')}

For web, we handle password protected pdf in IOURequestStepScan.index

App/src/pages/iou/request/step/IOURequestStepScan/index.tsx

Lines 216 to 219 in f618a94

    
           if (fileExtension === 'pdf') { 
        
               return isPdfFilePasswordProtected(file).then((isProtected: boolean) => { 
        
                   if (isProtected) { 
        
                       setUploadReceiptError(true, 'attachmentPicker.wrongFileType', 'attachmentPicker.protectedPDFNotSupported');

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

Change web error message key to attachmentPicker.attachmentError in IOURequestStepScan.index

App/src/pages/iou/request/step/IOURequestStepScan/index.tsx

Lines 216 to 219 in f618a94

    
           if (fileExtension === 'pdf') { 
        
               return isPdfFilePasswordProtected(file).then((isProtected: boolean) => { 
        
                   if (isProtected) { 
        
                       setUploadReceiptError(true, 'attachmentPicker.wrongFileType', 'attachmentPicker.protectedPDFNotSupported');

This will change web error message to Attachment error

What alternative solutions did you explore? (Optional)

Change native platform error message to attachmentPicker.wrongFileType in MoneyRequestConfirmationList

App/src/components/MoneyRequestConfirmationList.tsx

Lines 1237 to 1238 in f618a94

    
           <ConfirmModal 
        
               title={translate('attachmentPicker.attachmentError')}

This will change native platforms error message to Invalid file type

Proposal

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

Error Messages for Password Protected PDFs on Android is incorrect

What is the root cause of that problem?

On web (only web), we implemented a check to identify Password Protected PDF files and show the correct error message

App/src/pages/iou/request/step/IOURequestStepScan/index.tsx

Lines 216 to 220 in 5bccd00

    
           if (fileExtension === 'pdf') { 
        
               return isPdfFilePasswordProtected(file).then((isProtected: boolean) => { 
        
                   if (isProtected) { 
        
                       setUploadReceiptError(true, 'attachmentPicker.wrongFileType', 'attachmentPicker.protectedPDFNotSupported'); 
        
                       return false;

However, the isPdfFilePasswordProtected function only operates on the web platform (it is not defined for native). Therefore, if we upload a password-protected PDF file on the native platform, the Scan page will not generate an error. Instead, the error message occurs on the confirmation page on the native

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

Fortunately, we can determine whether the PDF file requires a password by utilizing the onPassword callback of the PDFThumbnail Component on the confirmation page

Need to define new state

    const [invalidAttachmentTitle, setInvalidAttachmentTitle] = useState(translate('attachmentPicker.attachmentError'));

Update this state on onPassword and onLoadError callback

App/src/components/MoneyRequestConfirmationList.tsx

Line 1129 in 5bccd00

onPassword={() => {

setInvalidAttachmentTitle(translate('attachmentPicker.wrongFileType'));

App/src/components/MoneyRequestConfirmationList.tsx

Line 1133 in 5bccd00

onLoadError={() => {

setInvalidAttachmentTitle(translate('attachmentPicker.attachmentError'));

Using new state

App/src/components/MoneyRequestConfirmationList.tsx

Line 1238 in 5bccd00

title={translate('attachmentPicker.attachmentError')}

title={invalidAttachmentTitle}

What alternative solutions did you explore? (Optional)

@CortneyOfstad

@CortneyOfstad Huh... This is 4 days overdue. Who can take care of this?

Sorry was OoO!

I think this may be more BE (tied to design) so going to get confirmation!

Asked here

Bumped the thread in design again 👍

Still waiting on proposals

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

@s77rt

@s77rt, thank you for your suggestion. Currently, we're using react-native-pdf to detect if a PDF file requires a password in our native setup. However, this method requires rendering the PDF file using the PDF component from react-native-pdf. Upon further investigation into react-native-pdf, I found that it doesn't offer a direct API specifically for checking password protection.

We have two potential solutions:

Integrate another library that handles PDF password detection.
Extend react-native-pdf by implementing native code for both Android and iOS.

Personally, neither of these methods seems justified for addressing such a minor issue. My proposal seems like a workaround, but it effectively resolves the issue without making significant alterations

@cretadn22

@cretadn22 Your proposal will only change the text error but still keep the inconsistency where on web the validation is done on the scan page while on native it's done on the confirmation page.

I would prefer doing one of the following:

Make the pdfjs library work on native (only for checking if the pdf is password protected and not rendering)
Extend react-native-pdf as you mentioned

@cretadn22

@cretadn22

Upon further investigation into react-native-pdf, I found that it doesn't offer a direct API specifically for checking password protection.

There is an exported PdfManager that we can use to load the file without rendering.

@s77rt

@s77rt, sorry for delay on this, we are already handling PDF validation here. I think we can close this out.

@CortneyOfstad

@CortneyOfstad Let hold this on #44778

@s77rt

Sounds good — thanks @s77rt!

Deployed to production! Going to close 🎉

Navigation Menu

Repository navigation

[On Hold #44778] Submit Expense - Inconsistent Error Messages for Password Protected PDFs on Mweb and Android #44091

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

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)

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)

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)

18 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

	<ConfirmModal
	title={translate('attachmentPicker.attachmentError')}

	if (fileExtension === 'pdf') {
	return isPdfFilePasswordProtected(file).then((isProtected: boolean) => {
	if (isProtected) {
	setUploadReceiptError(true, 'attachmentPicker.wrongFileType', 'attachmentPicker.protectedPDFNotSupported');

[On Hold #44778] Submit Expense - Inconsistent Error Messages for Password Protected PDFs on Mweb and Android #44091

Description

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

Activity

melvin-bot commented on Jun 20, 2024

lanitochka17 commented on Jun 20, 2024

Krishna2323 commented on Jun 20, 2024

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)

etCoderDysto commented on Jun 20, 2024

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)

cretadn22 commented on Jun 20, 2024

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)

melvin-bot commented on Jun 25, 2024

CortneyOfstad commented on Jun 25, 2024

CortneyOfstad commented on Jun 25, 2024

CortneyOfstad commented on Jun 28, 2024

18 remaining items

s77rt commented on Jul 4, 2024

melvin-bot commented on Jul 5, 2024

cretadn22 commented on Jul 5, 2024

s77rt commented on Jul 6, 2024

s77rt commented on Jul 6, 2024

Krishna2323 commented on Jul 6, 2024

s77rt commented on Jul 7, 2024

CortneyOfstad commented on Jul 9, 2024

CortneyOfstad commented on Jul 31, 2024

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions