I am creating a "Preview Document" button, that takes text from multiple textareas and combines them into a PDF with help of the react-pdf and react-pdf-html packages. This is working fine so far.
Question: how can I make it open in a new tab instead of downloading the document?
I have created a component to create the PDF document (pages is used as a state variable to store content as an array)
// Create Document Component
const MyDocument = ({ pages }) => (
<Document>
{pages.map((page, index) => (
<Page size="A4" key={index}>
<Html>{page}</Html>
</Page>
))}
</Document>
);
And using this component to download the file on the button click
<Button variant="outlined">
<PDFDownloadLink
document={<MyDocument pages={docData.pages} />}
fileName={`${docData.transdocs_name || "preview"}.pdf`}
>
{({ blob, url, loading, error }) =>
loading
? "Creating Preview..."
: "Preview Document"
}
</PDFDownloadLink>
</Button>
Note: I know the PDFDownloadLink component is meant to download the document, but I am not sure which component I should use for preview instead.