Render PDF documents in Explorer

[vmradulescu]

To support Andrew and further Integrators who will be minting multi page PDF documents as Data NFTs, a required upgrade to Explorer is needed in order to support PDF documents

Expectation:

• wallet file viewer support: when a user clicks on “view data” on the explorer wallet, the PSD doc should load inline like our images and SVGs.

• App Marketplace: New custom App in the App Explorer that’s called “MultiversX Infographics” (similar to the MultiversX Bubbles app). This lists support data NFTs that are PDFs, when user clicks on “view Data”, the PDF needs to open inline. You SHOULD use the existing MultiversX bubbles app page code as a template as this code is nice and clean.

PDF Tool:

• should allow for “paging” if there are multiple pages in the PDF document

Dev testing:

• PDF Data NFT's will be provided on devnet that will utilize some of the test versions. Will be posted below.

https://devnet-explorer.multiversx.com/transactions/cddd58686c2e445c192f122b611cc87099561c03cee65ffdbdef59f29452df36#b292855a3cfed9834360249a8f5f996e98f387400d6f9d0bec138c15c858ddc9

https://stg.datadex.itheum.io/datanfts/marketplace/DATANFTFT4-3ba099-01dc/offer-2103

Possible tech options for PDF rendering:

• https://www.npmjs.com/package/react-pdf

Timeline: Product Spec creation: 11th of August PDF Data NFT's available: 11th of August Brief and assignment: 11th of August Development: 16-17th of August Final testing: 17th of August Deployment: 17th-18th of August

*Timeline may change based on Andrei's strategy.

[damienen]

Done. Moving to review

[fuzzyduke]

As per the current implementation seen for the above app, the 2 requirements are not met.

1. The PDF should open in an inline view.
2. Pagination should be accessible within the viewer for the PDF.

Currently it seems like the PDF alone is just opening in a new tab and as that is the case there is no app mechanism for pagination, just the normal PDF render in a browser window.

Please clarify the implementation.

[damienen]

Talked with @newbreedofgeek about this and he gave the OK for this implementation. Also, pagination is available, you view the document page by page.

But best to do is to clarify that this is ok in the morning

On Mon, Aug 14, 2023, 9:24 PM Eddy @.***> wrote:

As per the current implementation seen for the above app, the 2 requirements are not met.

1. The PDF should open in an inline view.
2. Pagination should be accessible within the viewer for the PDF.

Currently it seems like the PDF alone is just opening in a new tab and as that is the case there is no app mechanism for pagination, just the normal PDF render in a browser window. [image: image] https://user-images.githubusercontent.com/121969933/260538857-84bc4f47-4b5c-451a-8644-266b8a692e76.png

Please clarify the implementation.

— Reply to this email directly, view it on GitHub https://github.com/Itheum/explorer-dapp/issues/101#issuecomment-1677855012, or unsubscribe https://github.com/notifications/unsubscribe-auth/AKV4Z5QSUPBPNPZ6A73TPR3XVJUNHANCNFSM6AAAAAA3MOJYDM . You are receiving this because you were assigned.Message ID: @.***>

[vmradulescu]

Checked the current implementation:

• PDF's are not loading inline like our images and SVG's
• The new custom app called MultiversX Infographics is displayed on the app marketplace and in the dropdown list

Let's clarify in the morning regarding on how the opening of the pdf should be handled. As in my view, right now we are opening it in a new tab and using the browser's pdf viewer, which would mean that there isnt actually a need for an app for this, which might confuse users.

[newbreedofgeek]

We will do both:

1. In Wallet View, we just open in a new tab
2. In the App View, we will show a preview of the PDF with paging. And Also allow the user to open in a new tab so they can get the best UX with the browser's default PDF viewer

I've built this and preview link is coming soon

@vmradulescu @fuzzyduke @damienen