Not able to retrieve state in react-pdf document

Question

Following the example here https://react-pdf.org/advanced#using-the-usepdf-hook

I have a component setup on different tsx file and make it to accept props that will be use in rendering the page. However, I am not able to update the content of the component via props as the document would have rendered while creating the usePDF and making the component to be pass to it as Doc

const [pdfInstance, updatePdfInstance] = usePDF({ document: <OPDocument contents={contents}/> });

while OPDocument tsx exports the below

export const downloadPDF = (url: string, fileName: string) => {
    const anchor = document.createElement("a");
    anchor.href = url!;
    anchor.download = fileName;
    document.body.appendChild(anchor);
    anchor.click();
    document.body.removeChild(anchor);
}

interface OPCodeDocumentProps {
    contents: OPPageContent[]
}

const OPDocument = (props: OPDocumentProps ) => {

    const uiState = useSelector(({ UIState }: AllState) => UIState);

    console.log('props.contents', props.contents)

    return (
        <Document>
            {props.contents.map((c)=>
                <Page size="A4" style={styles.page}>

                    <View style={styles.container}>
                        <View style={styles.section}>
                            <Image src={ Logo } style={styles.logo}/>
                            <Text>{c.text}</Text>
                        </View>
                    </View>
                </Page>
            )}
        </Document>
    )

};

export default OPDocument

Accessing state using useSelector in the document keeps crashing with the below error TypeError: Cannot destructure property 'store' of 't(...)' as it is null. at useSelector.js:37:7 at dfe (OPDocument.tsx:90:21)

However, retrieving the state this way works for other components of my project. How can I pass state to the component or make sure component rerenders so as to be able to pass new props value when download function is called?

Not able to retrieve state in react-pdf document

0 Answers0