How to properly pass and update data from child to parent component React Typescript

I’ve been trying to pass data from a child to a parent component in a few different ways and none of them seem to work, but I can’t figure out what I’m doing wrong.

Visitor Documents is the parent component. I have this logic in it:

const VisitorDocuments: FC<VisitorDocumentsProps> = ({ chatId }) => {
  const [uploadedDocuments, setUploadedDocuments] = useState([]);

  // const handleDocumentsUpdate = useCallback(
  //   (documents: any) => setUploadedDocuments(documents),
  //   [],
  // );

  const handleDocumentsUpdate = (documents: any) => {
    setUploadedDocuments(documents);
  };

  return (
    <>
      <AgentDocumentsFormProvider chatId={chatId}>
        <Accordion>
          <AccordionTab>
            <AgentDocumentsFormProvider chatId={chatId} allowUpload allowDelete>
              <DocumentsForm
                types={DocumentTypesUtils.INSURANCE_CARD}
                //setUploadedDocuments={setUploadedDocuments}
                onDocumentsUpdate={handleDocumentsUpdate}
              />
            </AgentDocumentsFormProvider>
          </AccordionTab>
        </Accordion>
      </AgentDocumentsFormProvider>
    </>
  );
};

I tried by just passing the setter and try to set the value I also try with handleDocumentsUpdate function, but the uploadedDocuments value is always an empty array.
And this is the child component and the things I tried to do in it:

    const DocumentsForm: FC<{
      types?: DocumentTypes[];
      setUploadedDocuments?: React.Dispatch<React.SetStateAction<any>>;
      onDocumentsUpdate?: (documents: any) => void;
    }> = ({ types = DEFAULT_TYPES, setUploadedDocuments, onDocumentsUpdate }) => {
      const { loading, documents } = useContext(DocumentsFormContext);
    
      // useEffect(() => {
      //   if (setUploadedDocuments) {
      //     setUploadedDocuments(documents);
      //   }
      // }, [documents, setUploadedDocuments]);
    
      useEffect(() => {
        onDocumentsUpdate?.(documents);
      }, [documents, onDocumentsUpdate]);
    .....

Apparently I’m updating things wrong or there’s another problem I’m not sure. In the child component I have values ​​for documents and I just want to pass them to the parent. I would be grateful if someone could help me urgently 🙂